web-dev-qa-db-fra.com

Comment configurer un surligneur de syntaxe sur Blogger?

Comment configurer un surligneur de syntaxe sur la nouvelle interface de Blogger? J'ai essayé avec de nombreuses options mais rien n'a fonctionné. Veuillez donner vos suggestions.

syntax-highlightingbloggersyntaxhighlighter
63
Anil

1. Tout d'abord, sauvegardez votre modèle de blogueur
2. Après cela, ouvrez votre modèle de blogueur (en mode d'édition HTML) et copiez le tout css indiqué dans ce lien avant </b:skin> tag
3. Collez le code suivant avant </head> tag

<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js' type='text/javascript'></script>

4. Collez le code suivant avant </body> tag.

<script language='javascript'>
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
</script>

5. Enregistrer le modèle Blogger.
6. Maintenant, la coloration syntaxique est prête à l'emploi, vous pouvez l'utiliser avec <pre></pre> tag.

<pre name="code">
...Your html-escaped code goes here...
</pre>

<pre name="code" class="php">
    echo "I like PHP";
</pre>

7. Vous pouvez échapper à votre code ici .
8. Ici est la liste des langues prises en charge pour <class> attribut.

129
Mahesh Meniya

Paiement http://oneqonea.blogspot.com/2012/04/how-do-i-add-syntax-highlighting-to-my.html

C'est un didacticiel "SyntaxHighlighter for Blogger" très simple avec des captures d'écran et tout le reste.

Vous devriez être opérationnel en seulement quelques minutes.

De plus, le tutoriel est construit autour de la "nouvelle interface" à laquelle vous faites référence.

J'espère que cela t'aides. Codage heureux.

22
John Erck

Selon votre modèle, le code JavaScript SyntaxHighlighter peut s'exécuter avant le chargement du contenu. Dans ce cas, la modification du code à exécuter après un court délai d'expiration devrait résoudre le problème. Essayez ceci dans le <head> De votre modèle HTML:

<script type = "text/javascript"> 
 window.setTimeout (fonction () {
 SyntaxHighlighter.config.bloggerMode = true; 
 SyntaxHighlighter.all (); 
}, 10); 
 </script>

Vous pouvez ajouter une personnalisation supplémentaire des paramètres par défaut avant l'appel à ScriptHighlighter.all().

Si vous souhaitez personnaliser l'apparence de l'affichage du code SyntaxHighlighter, ajoutez du CSS comme ceci:

.syntaxhighlighter code {
 famille de polices: Consolas! important; 
 taille de police: 10 px! important; 
}

Le !important Est nécessaire pour remplacer les définitions de thème SyntaxHighlighter.

0
grkvlt