Cómo añadir fragmentos de código personalizados en WordPress (el método más sencillo)

¿Buscas una forma fácil y sencilla de añadir fragmentos de código de WordPress a tu sitio web?

Aprender WordPress no es sólo cuestión de temas y herramientas. A veces, es el poder sutil de los fragmentos de código lo que da a un sitio su sabor único.

¿Esa personalización perfecta que buscas? Se puede conseguir con el código adecuado, pero el problema es que hasta el más mínimo error puede romper tu sitio web.

En este artículo, le mostraremos cómo añadir fácilmente fragmentos de código personalizados en WordPress sin romper su sitio web.

¿Qué son los fragmentos de código en WordPress?

Bajo la interfaz fácil de usar de WordPress, hay un mundo de código que potencia todos sus movimientos.

Estos pequeños fragmentos de código, llamados fragmentos de código, son herramientas compactas pero potentes que instruyen a WordPress sobre funcionalidades específicas.

Aprovechar el poder de estos fragmentos puede marcar la diferencia entre un sitio web de WordPress genérico y uno adaptado a sus necesidades exactas.

Considérelos el equivalente en WordPress de los hechizos, que, cuando se lanzan correctamente, pueden dar excelentes resultados en el frontend.

Cómo añadir fragmentos de código personalizados en WordPress

Para añadir fragmentos de código personalizados en WordPress, puede confiar en la simplicidad y funcionalidad de WPCode. Siga los pasos que se indican a continuación para empezar.

1. Instalar y activar el plugin WPCode

WPCode es la mejor forma de que los usuarios de WordPress añadan fragmentos de código personalizados a sus sitios sin tener que complicarse con el programa functions.php ni preocuparse de romper el sitio por el más mínimo error.

El plugin de fragmentos de código facilita la adición de fragmentos a cualquier parte de su sitio de WordPress, incluidos el pie de página y el encabezado. Puede insertar cualquier código personalizado que desee directamente desde su panel de control en lugar de editar directamente el archivofunctions.php archivo.

Para empezar, tendrás que instalar y activar el plugin de WordPress en tu sitio web. Esto añadirá el plugin al panel de menú izquierdo de tu panel de control de WordPress, desde donde podrás empezar a añadir códigos personalizados rápidamente.

WPCode incluye una biblioteca de más de 1.100 fragmentos de código que puedes utilizar en tu sitio web con unos pocos clics, ¡sin necesidad de conocimientos de desarrollo! También puedes seguir las instrucciones que aparecen a continuación para añadir tu propio código personalizado.

El equipo de WPForms incluso ha agregado algunos fragmentos de código propios. Hemos añadido el código para realizar nuestras personalizaciones de formularios más solicitadas para que pueda ir más allá de la funcionalidad base de WPForms y los complementos. Echa un vistazo a la sección de bonificación al final de este post para un adelanto.

2. Crear el código personalizado (PHP, CSS, HTML)

Si ya tiene listo el código personalizado, sáltese este paso y continúe con el siguiente. Para aquellos que crean el código personalizado desde cero, aquí hay un ejemplo.

Para esta guía, crearemos un código personalizado que previene conflictos de tema que causan que los valores de Radio y Checkbox no se muestren correctamente en WPForms.

El código anterior utiliza CSS para solucionar el problema de conflicto de tema, pero como se mencionó anteriormente, puede crear un código con PHP y HTML también.

3. Añada su código personalizado (nuevo fragmento)

En la barra de menú de administración de WordPress, haga clic en la opción Fragmentos de código y, a continuación, en el botón Añadir nuevo. Como acabas de instalar el plugin, la lista estará vacía.

A continuación, se le enviará a la página Añadir fragmento de código. Aquí puede añadir su propio código o seleccionar un fragmento de código de la biblioteca ya creada.

Haga clic en el botón Usar fragmento junto a la opción Añadir su código personalizado (nuevo fragmento) para insertar su nuevo código.

Ahora, todo lo que necesitas hacer es darle un nombre al fragmento y simplemente copiar y pegar el código personalizado que has creado en el espacio de Vista Previa del Código en el plugin WPCode.

Como hemos creado el código en CSS, en el menú desplegable Tipo de código, hemos seleccionado Fragmento CSS. Puedes cambiarlo en función del código que hayas creado.

A continuación, desplácese hasta la pestaña Inserción. Ahora, seleccione Inserción automática y, en el menú desplegable Ubicación, elija la opción Encabezado de todo el sitio.

Dependiendo del tipo de código que estés creando, puedes incluso elegir añadirlo como un [/] Shortcode a tus páginas/posts.

Si desea asignar etiquetas a su fragmento de código, desplácese hasta la sección Información básica. Esto le ayudará a clasificar sus ejemplos de código por temas y funciones.

Cuando desee mostrar numerosos fragmentos en el mismo lugar, el parámetro Prioridad le permite elegir el orden en que se procesan.

A continuación, la sofisticada función Lógica condicional inteligente permite mostrar u ocultar fragmentos autoinsertados en función de una serie de criterios.

Por último, sólo tiene que marcar la opción Activo y pulsar el botón Guardar fragmento antes de salir del plugin.

4. Tratamiento de errores en código personalizado

Un error tipográfico en el archivo de un plugin o tema específico del sitio puede hacer que éste deje de estar disponible para los visitantes al utilizar fragmentos de código.

Aparecerá un error de sintaxis o un error interno de servidor 500 en su sitio. Tendrás que utilizar un cliente FTP para revertir los cambios manualmente.

La característica única del plugin WPCode es que identificará y desactivará automáticamente cualquier instancia de errores de sintaxis en el código.

Se mostrará un mensaje de error útil para que lo utilices en la depuración de errores. A medida que añades tu código personalizado, la validación inteligente de fragmentos de código de WPCode encontrará cualquier error.

Al pasar el ratón por encima del problema, aparecerá una ventana emergente con instrucciones para resolverlo.

5. Gestión de sus fragmentos de código personalizados

Si tienes varios fragmentos de código, WPCode hace que sea increíblemente fácil gestionarlos con una interfaz fácil de usar y la biblioteca de fragmentos.

Los fragmentos de código pueden guardarse sin activarlos en su sitio web, y posteriormente podrá activarlos o desactivarlos cuando lo desee.

Además, puedes utilizar etiquetas para clasificar tus fragmentos de código y filtrarlos por tipo y ubicación.

También tiene la opción de exportar fragmentos de código concretos o exportarlos todos en bloque. Simplemente vaya a Fragmentos de código " Herramientas y seleccione la opción Exportar.

El plugin también le permite importar fragmentos si está trasladando su sitio web a un nuevo servidor. Vaya a Code Snippets " Herramientas " Importar y cargue el archivo de exportación.

Bonificación: Añada fragmentos de código personalizados a sus formularios

Si utiliza WPForms en su sitio, puede añadir fragmentos de código para personalizar sus formularios directamente desde el panel de control del plugin WPForms.

Cuando tiene instalados los plugins WPForms y WPCode, puede acceder a una biblioteca de fragmentos de código WPForms ya creados desde la sección Herramientas con la configuración del plugin WPForms.

Con sólo pulsar un botón, puede añadir funciones avanzadas o personalizar la visualización de su formulario. Es como tener tu propio desarrollador web para ayudarte a crear un sitio web a medida.

Algunos ejemplos de los fragmentos de código disponibles en WPForms incluyen:

• Seleccione un intervalo de fechas en el campo de selección de fechas
• Bloquee direcciones IP específicas para que no puedan rellenar su formulario
• Personalizar subetiquetas
• Mostrar el recuento de entradas enviadas

Añadimos continuamente nuevos fragmentos de código al directorio, así que no dudes en ponerte en contacto con nosotros si necesitas ayuda para personalizarlo.

Preguntas frecuentes sobre fragmentos de código personalizados

Añadir fragmentos de código personalizados es un tema de usabilidad muy popular entre nuestros lectores. He aquí algunas respuestas rápidas a algunas de las preguntas más frecuentes:

¿Cuál es el mejor gestor de fragmentos de código para WordPress?

WPCode es la mejor opción para gestionar y ejecutar fragmentos de código en WordPress, ya que ofrece una organización más sencilla y capacidades de integración sin fisuras.

¿Cómo añado CSS a un fragmento de código en WordPress?

Dentro de WPCode, simplemente navegue hasta la sección + Añadir nuevo, introduzca el CSS que desee y asegúrese de seleccionar el tipo de CSS antes de guardar y activar.

¿Cómo puedo añadir código personalizado a WordPress sin plugins?

Puede introducir código personalizado directamente en la sección de su tema functions.php archivo. Sin embargo, una herramienta dedicada como WPCode garantiza una gestión de fragmentos más segura y organizada.

¿Cómo añado código php personalizado a WordPress?

Para PHP, dirígete a la interfaz de WPCode, selecciona + Añadir nuevo, pega tu código PHP y guárdalo. Asegúrate siempre de probarlo primero en un sitio de prueba del tema hijo.

A continuación, aprenda a solicitar una dirección de correo electrónico para descargar archivos

¿No sería genial que los usuarios de WordPress tuvieran que darte su dirección de correo electrónico para poder descargar un archivo? Descubre cómo conseguir que los visitantes de tu sitio WordPress compartan sus direcciones de correo electrónico para poder descargar un archivo.

Cree su formulario WordPress ahora

¿Listo para crear tu formulario? Empieza hoy mismo con el plugin más sencillo para crear formularios en WordPress. WPForms Pro incluye un montón de plantillas gratuitas y ofrece una garantía de devolución de dinero de 14 días.

Si este artículo te ha ayudado, síguenos en Facebook y Twitter para más tutoriales y guías gratuitas sobre WordPress.