Cómo mostrar código en las publicaciones de WordPress

Por defecto, WordPress texturiza automáticamente, o interpreta, el código HTML o PHP en las publicaciones y páginas del blog. Esto puede suponer un problema para los bloggers de WordPress que desean mostrar el código de programación en sus publicaciones del blog, quizás con fines de tutoría, sin que el software de WordPress interprete y convierta el código. Hay dos soluciones para este problema: escriba el código manualmente usando entidades de caracteres HTML y use el WordPress nativo

 etiquetas, o puede instalar un complemento que automatice las entradas de código utilizando una determinada etiqueta preprogramada. Un complemento altamente recomendado se llama SyntaxHighlighter Evolved, que fue diseñado por el desarrollador oficial de WordPress Alex Mills.

Usar entidades de caracteres HTML y la etiqueta "Pre"

1.

Inicia sesión en tu blog de WordPress y crea una nueva publicación. Utilice la función de editor visual; su pestaña se encuentra en la parte superior derecha del cuadro de entrada de texto de entrada.

2.

Haga clic en la flecha desplegable en la segunda línea de la barra web llamada "Formato". Seleccione "Preformateado" de la lista. La configuración preformateada convertirá su texto al tipo de espacio simple y conservará las entidades de caracteres HTML o PHP.

3.

Escriba el código en el cuadro de texto de la publicación utilizando las entidades de caracteres de código para ciertos caracteres. Por ejemplo, use estas entidades de caracteres para algunos de los tipos de código más comunes:

"=" <= <

=> / = / - = -

] =] [= [• = •

Instalar el complemento evolucionado SyntaxHighlighter

1.

Inicia sesión en tu blog de WordPress. Haga clic en el enlace "Complementos" en el menú del panel. Seleccione "Agregar nuevo".

2.

Escribe "SyntaxHighlighter Evolved" en el cuadro de búsqueda. Haga clic en "Buscar ahora". Busque el complemento en la lista y haga clic en "Instalar ahora". Haga clic en "Aceptar" en la ventana de confirmación. Permitir que el plugin se instale.

3.

Active el complemento haciendo clic en el enlace "Activar complemento".

4.

Acceda a la configuración de SyntaxHighlighter Evolved haciendo clic en "Configuración" en el menú del panel. Haga clic en "SyntaxHighlighter Evolved" en la lista. Ajuste la configuración a su gusto y haga clic en "Guardar cambios" cuando haya terminado.

5.

Crear una nueva entrada de blog. Para insertar y mostrar el código, escriba su código entre dos etiquetas de código abreviado. Por ejemplo, para mostrar el código HTML en su publicación de WordPress, escriba el shortcode [html], su código html y la etiqueta de shortcode que termina, [/ html]. Por ejemplo: [html]

Al principio

[/ html]. Para códigos abreviados adicionales, vea la página de configuración de Sintaxis, Alumbrado Evolucionado. Los códigos cortos se enumeran en la parte inferior de la página.

Cosas necesarias

  • Nombre de usuario y contraseña de WordPress

Propina

  • WordPress proporciona un widget de codificador para los bloggers que son reacios a aprender y usar el tipo de entidades de caracteres tediosos (ver Recursos para el enlace). Escriba su texto HTML o PHP en el cuadro de texto Widget de codificador y haga clic en "Codificar!" El widget convertirá tu texto en las entidades de caracteres HTML apropiadas. Copie y pegue los resultados en su publicación de blog usando las etiquetas "pre".

Advertencia

  • Al usar las etiquetas "pre", WordPress reproducirá literalmente y exactamente su código a medida que se escribe. Si su código contiene cadenas largas de código ininterrumpido, WordPress hará que el código se ejecute horizontalmente fuera de la página y sea inaccesible para sus lectores. En tal caso, agregue un salto de línea, si es posible, dentro de estas cadenas largas presionando la tecla "Enter" en su teclado. Esto puede no ser posible en algunos casos, ya que puede romper el código. En este caso, por lo tanto, un complemento puede ser más adecuado para su blog de WordPress.

Entradas Populares