Como insertar código fuente en wordpress

Como insertar código fuente en wordpress

0
(0)

¿Te gustaría poder compartir código fuente en tus publicaciones wordpress?

Por seguridad WordPress.org no permite embeber html, css ni javascript.

Si bien, es verdad que para wordpress.com hay un shortcode que lo permite de forma nativa.

Como el sistema de capturas de pantalla no me acaba de convencer porqué me lleva mucho trabajo finalmente he decidido ponerme a buscar una alternativa.

La solución la he encontrado como no podía ser en la instalación del plugin  SyntaxHighlighter Evolved.

Parece que debe ser una buena solución porqué la propia Automattic (junto con Alex Mills) ha contribuido en su desarrollo.

Espero que me podáis perdonar la pluginulímia.

Actualización 21 de septiembre 2018

A pesar de ser un plugin que prometía la realidad es que no me funciona correctamente.

Hay otros plugins interesantes como Enlighter – Customizable Syntax Highlighter .

He probado varios y muchos me dan problemas de compatibilidad con Visual Composer.

Finalmente he terminado usando este otro que cumple a la perfección.

Como funciona el plugin para insertar código fuente

El plugin tiene un asistente visual que te permite escribir sin problemas.

Veamos un ejemplo:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="description" content="Test funcionamiento plugin para source code en wp">
        <meta name="author" content="Francesc Ricart">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Document</title>
        <link rel="stylesheet" href="css/style.css">
    </head>
    <body>
        
        <p>Esto es un párrafo</p>

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
     <script src="js/main.js"></script>
    </body>
</html>

La única pega es que al cargar librerías de Javascript estos plugins no se ven bien en formato AMP.

Métodos alternativos

Si no quires instalar ningún plugin entonces la alternativa es escapar tu los caracteres que pueden inducir a error.

Típicamente <> y </>

Por ejemplo un carácter escapado es &lt; y &gt;

Podéis consultar una referencia completa de caracteres codificados en este enlace.

¡Hola!

Querido lector,

¡Si te ha gustado este contenido te animo a seguirme en mi perfil de empresa de Linkedin!

¿Te ha gustado esta publicación?

¡Valora sobre 5 estrellas esta publicación!

Puntuación media 0 / 5. Votos: 0

Todavía no hay votos. Sé el primero en valorar la entrada.

Si te ha gustado este contenido...

¡Sígueme en las redes!

Vaya, parece que hay puntos a corregir

¿Me ayudas a mejorar?

¿Dónde he fallado?

Entradas relacionadas:

Que tienen los gestores de contenidos (CMS) para ser tan útiles
Los gestores de contenidos son aplicaciones web alojadas en un servidor que nos ayudan enormemente en la tarea de realizar un sitio web. Son herramientas pensadas para que personas sin conocimientos t...
Factores que afectan al tiempo de carga de una página web
Resumimos los principales factores que deberemos tener en cuenta desde el punto de vista de alguien que ha estudiado un curso de confección y publicación de páginas web para la optimización y mejora d...
2 formas de modificar texto repetido en tu wordpress
¿Necesitas modificar un texto o palabra que aparece muchas veces en páginas o entradas de tu web? Te planteo dos propuestas para todos los gustos.
Dónde comprar plantillas para wordpress
Si estás buscando dónde comprar plantillas para wordpress en esta publicación encontarás mi top 10 de lugares favoritos y algunos criterios que tengo en cuenta para asegurarme una buena elección para ...
Mantenimiento web. La obsesión por actualizar todo siempre
Si algo funciona no lo toques. ¿A que se debe la manía de tener que esta siempre actualizando todo? En esta entrada explico mi opinión personal sobre bajo que supuestos me lanzo a una nueva actualizac...
Tutorial como instalar WordPress local en Xampp con imágenes
Guía paso a paso para la instalación de una versión virgen de wordpress (.org) en XAMPP local. Incluye capturas de pantalla y especial mención a los errores típicos en cada paso y como solucionarlos.
Francesc Ricart
hola@francescricart.com

Aprender y enseñar. Enseñar y aprender. En el ámbito docente soy docente ocupacional. En el ámbito profesional consultor web. Ofrezco servicios de mejora continua y mantenimiento web. ¿Qué quieres aprender hoy? Encontraréis más acerca de mi en la página sobre mi

No Comments

Post A Comment

  Acepto la política de privacidad

Responsable: FRANCESC RICART MUÑOZ.

Finalidad: Gestionar los comentarios que realizas en este blog.

Destinatarios: No se cederán datos a terceros, salvo obligación legal.

Derechos: Tienes derecho a acceder, rectificar y suprimir los datos, así como otros derechos, como se explica en la política de privacidad.