Cómo agregar resaltador de sintaxis en Blogger

Ya he compartido un artículo sobre este tema y en ese artículo he compartido un resaltador de sintaxis muy hermoso.Si no ha leído mi artículo anterior sobre el resaltador de sintaxis, léalo aquí.

Creo que estará pensando que si ya he compartido un artículo sobre este tema, ¿cuál es el significado de compartir este artículo nuevamente?

Amigos, sean geniales, esto no es un truco publicitario. Acabo de publicar este artículo sobre el mismo tema nuevamente porque uno de mis amigos me pidió compartir el resaltador de sintaxis como mi sitio web, por eso escribo este artículo.

Así que ahora hablemos de este resaltador de sintaxis.

Este resaltador de sintaxis usos resaltar.js JavaScript plugin para resaltar diferentes tipos de códigos informáticos en cualquier sitio web.

También puedes usar este mismo resaltador de sintaxis en su sitio web de wordpress si lo desea.

¿Qué es el resaltador de sintaxis?

Si es nuevo o si no tiene ningún conocimiento sobre el resaltador de sintaxis, déjeme decirle eso antes de continuar.

El resaltado de sintaxis es una técnica en la que usamos expresiones regulares para hacer coincidir la sintaxis de diferentes cosas y diferentes cadenas alfanuméricas y las hacemos hermosas al darles diferentes colores de texto y colores de fondo y muchos otros estilos.

La técnica de resaltado de sintaxis hace que nuestros códigos de computadora o cualquier otra información útil se vean hermosos en un estilo diferente.

Hay muchos otros resaltadores de sintaxis disponibles en el mercado como prisma.js pero nuestro resaltador de sintaxis utiliza resaltar.js JavaScript plugin.

Así que ahora aquí hay pasos completos que debe seguir para agregar este resaltador de oraciones en su blog de blogger.

Pautas:

1. Ir Panel de Blogger
2. Ir Sección de tema/plantilla
3. Hacer clic Editar HTML
4. Ahora busca

Para buscar cualquier cosa en la sección de plantillas de Blogger, presione Control+F y luego escriba el término para buscar y presione enter.

5. Copie el código proporcionado a continuación y péguelo arriba etiqueta.

<b:if cond='data:blog.pageType == "item"'> <style>
/* Highlighter */
.post-body code{padding:1.2em;max-height:400px;}.post-body .hljs{background:#292a2b;display:block;overflow-x:auto;padding:1em 2em;color:#fff;line-height:1.5;text-align:left;word-spacing:0;font-family:monospace;border-radius:3px}.post-body .hljs-name,.post-body .hljs-strong{font-weight:500}.post-body .hljs-code,.post-body .hljs-emphasis{font-style:italic}.post-body .hljs-tag{color:#62c8f3}.post-body .hljs-variable,.post-body .hljs-template-variable,.post-body .hljs-selector-id,.post-body .hljs-selector-class{color:#ade5fc}.post-body .hljs-string,.post-body .hljs-bullet{color:#a2fca2}.post-body .hljs-type,.post-body .hljs-title,.post-body .hljs-section,.post-body .hljs-attribute,.post-body .hljs-quote,.post-body .hljs-built_in,.post-body .hljs-builtin-name{color:#ffa}.post-body .hljs-number,.post-body .hljs-symbol,.post-body .hljs-bullet{color:#d36363}.post-body .hljs-keyword,.post-body .hljs-selector-tag,.post-body .hljs-literal{color:#fcc28c}.post-body .hljs-comment,.post-body .hljs-deletion,.post-body .hljs-code{color:#888}.post-body .hljs-regexp,.post-body .hljs-link{color:#c6b4f0}.post-body .hljs-meta{color:#fc9b9b}.post-body .hljs-deletion{background-color:#fc9b9b;color:#333}.post-body .hljs-addition{background-color:#a2fca2;color:#333}.post-body .hljs a{color:inherit}.post-body .hljs a:focus,.post-body .hljs a:hover{color:inherit;text-decoration:underline}mark .post-body .hljs-attr,mark .post-body .hljs-string,mark .post-body .hljs-bullet{background-color:#e67e22;color:#fff}.post-body .hljs mark{background-color:tomato;color:#fff;padding:2px 5px;border-radius:2px}.BLOG_mobile_video_class{display:none!important}.post-body .hljs mark *{color:var(--selected-textcolor) !important}.post-body .hljs mark span.hljs-number,.post-body .hljs mark span.hljs-comment,.post-body .hljs mark span.hljs-symbol,.post-body .hljs mark span.hljs-string,.post-body .hljs mark span.hljs-attr,.post-body .hljs mark span.hljs-keyword,.post-body .hljs mark span.hljs-name,.post-body .hljs mark span.hljs-tag{color:#000;margin:.15rem 0}.credit{}
</style></b:if>

6. Ahora busca .
7. Copie el código proporcionado a continuación y péguelo arriba etiqueta.

<b:if cond='data:blog.pageType == "item"'>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script>
//<![CDATA[
var _0x14f5=["x6Ex6Fx2Dx61x74x74x72x69x62x75x74x69x6Fx6E","","x61x74x74x72","x70x72x65x2Cx20x63x6Fx64x65x2Cx20x6Dx61x72x6Bx2Cx20x2Ex6Dx61x72x6Bx2Cx20x6Bx62x64","x3Cx61x20x63x6Cx61x73x73x3Dx22x63x72x65x64x69x74x22x20x68x72x65x66x3Dx22x68x74x74x70x73x3Ax2Fx2Fx77x77x77x2Ex73x6Fx66x74x77x65x62x74x75x74x73x2Ex63x6Fx6Dx2Fx32x30x31x39x2Fx30x35x2Fx68x6Fx77x2Dx74x6Fx2Dx61x64x64x2Dx73x79x6Ex74x61x78x2Dx68x69x67x68x6Cx69x67x68x74x65x72x2Dx69x6Ex2Dx62x6Cx6Fx67x67x65x72x2Ex68x74x6Dx6Cx22x20x72x65x6Cx3Dx22x64x6Fx66x6Fx6Cx6Cx6Fx77x22x20x73x74x79x6Cx65x3Dx22x70x6Fx73x69x74x69x6Fx6Ex3Ax61x62x73x6Fx6Cx75x74x65x3Bx72x69x67x68x74x3Ax38x70x78x3Bx66x6Fx6Ex74x2Dx73x69x7Ax65x3Ax32x30x70x78x3Bx63x6Fx6Cx6Fx72x3Ax23x30x30x30x3Bx74x65x78x74x2Dx64x65x63x6Fx72x61x74x69x6Fx6Ex3Ax6Ex6Fx6Ex65x3Bx62x61x63x6Bx67x72x6Fx75x6Ex64x3Ax23x66x66x66x3Bx70x61x64x64x69x6Ex67x3Ax30x70x78x20x35x70x78x22x3Ex26x63x6Fx70x79x3Bx3Cx2Fx61x3E","x62x65x66x6Fx72x65","x63x6Fx64x65","x75x73x65x20x73x74x72x69x63x74","x73x63x72x69x70x74","x63x72x65x61x74x65x45x6Cx65x6Dx65x6Ex74","x64x6Fx63x75x6Dx65x6Ex74","x67x65x74x45x6Cx65x6Dx65x6Ex74x73x42x79x54x61x67x4Ex61x6Dx65","x74x79x70x65","x74x65x78x74x2Fx6Ax61x76x61x73x63x72x69x70x74","x73x72x63","x69x6Ex73x65x72x74x42x65x66x6Fx72x65","x70x61x72x65x6Ex74x4Ex6Fx64x65","x68x74x74x70x73x3Ax2Fx2Fx72x61x77x63x64x6Ex2Ex67x69x74x68x61x63x6Bx2Ex63x6Fx6Dx2Fx73x6Fx66x74x77x65x62x74x75x74x73x2Fx73x6Fx66x74x77x65x62x74x75x74x73x2Ex63x6Fx6Dx2Fx6Ax73x2Fx68x69x67x68x6Cx69x67x68x74x72x2Ex6Ax73"];$(_0x14f5[3])[_0x14f5[2]](_0x14f5[0],_0x14f5[1]);$(_0x14f5[6])[_0x14f5[5]](_0x14f5[4]);function xvxv(_0xcdf3x2,_0xcdf3x3,_0xcdf3x4){_0x14f5[7];var _0xcdf3x5=window[_0x14f5[10]][_0x14f5[9]](_0x14f5[8]);var _0xcdf3x6=_0xcdf3x3|| window[_0x14f5[10]][_0x14f5[11]](_0x14f5[8])[0];_0xcdf3x5[_0x14f5[12]]= _0x14f5[13];_0xcdf3x5[_0x14f5[14]]= _0xcdf3x2;_0xcdf3x6[_0x14f5[16]][_0x14f5[15]](_0xcdf3x5,_0xcdf3x6);setTimeout(function(){_0xcdf3x5[_0x14f5[12]]= _0xcdf3x4|| _0x14f5[13]})}xvxv(_0x14f5[17])
//]]>
</script></b:if>

8. Ahorrar Tema/Plantilla

Entonces, después de agregar el código siguiendo las pautas proporcionadas anteriormente, si desea resaltar la sintaxis en su sitio web, simplemente debe reemplazar el código de su computadora en

<pre><code>Your Code Here</code></pre>

etiquetas, use su código en su lugar «Tu código aquí».

Ejemplo de uso:

Este es el ejemplo de uso de este resaltador de texto de envío.

<pre><code>&lt;h1&gt;
Softweb Tuts
&lt;/h1&gt;&lt;h2&gt;
Best place to learn blogging.
&lt;/h2&gt;
</code></pre>

Conclusión:

Si desea ver la demostración del resaltador de sintaxis, no tiene que hacer clic en ningún lado ni ir a ninguna página externa, simplemente puede ver la demostración de este resaltador de sintaxis en mi sitio web anterior. Es posible que lo hayas visto antes si eres mi visitante diario y un geek amante de la programación.

Espero que les guste este resaltador de sintaxis y para mi amigo que me pidió que escribiera un artículo al respecto, le estoy muy agradecido.

Estoy muy agradecido con aquellos que dan su opinión en este blog.

Si tiene algún problema, deje los comentarios en la sección de comentarios y no dude en hacer cualquier pregunta sobre esta publicación.