2

I'm using the Google Code Prettify CDN link:

<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>

By design, it appends a CSS stylesheet into the DOM:

<link rel="stylesheet" type="text/css" href="https://cdn.rawgit.com/google/code-prettify/master/loader/prettify.css">

This is great if you want to use the default skin (or one of the URL parameter-defined skins the project makes available), but in my case, I want to use a custom theme:

<link rel="stylesheet" href="css/my-custom-theme-that-is-awesome.css">

Uh oh, GCP appended its theme after mine, so now all of my styles are getting overwritten.

Is there a way to use the GCP CDN (or a CDN) and a custom stylesheet without having to add !important to every style in the sheet? Or am I stuck downloading GCP and including it locally in my project?

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
brandonscript
  • 68,675
  • 32
  • 163
  • 220
  • [take a look at](https://github.com/google/code-prettify/blob/master/docs/getting_started.md#serving-your-own-js--css) – maioman May 24 '16 at 21:37
  • Yep, that's where it shows how to use the auto loader - not a custom stylesheet (without downloading) – brandonscript May 24 '16 at 21:46
  • the idea was to use the load event for adding your stylesheet after the one coming in through CDN, but it's just a suggestion – maioman May 24 '16 at 21:58
  • Yeah I did that - it only seems to style the elements after loading not append the stylesheet after. – brandonscript May 24 '16 at 23:24

1 Answers1

2

You can use the non-autoloader version, i.e. https://cdn.rawgit.com/google/code-prettify/master/loader/prettify.js

And execute PR.prettyPrint() when the page is ready. No stylesheet will be downloaded.

Siu Pang Tommy Choi
  • 400
  • 1
  • 11