WordPress y WooCommerce: ¿cómo agregar un código personalizado?

Publicado: 2020-12-11

Una de las mejores cosas de WordPress y WooCommerce es que puedes modificar y personalizar tu sitio web de la forma que quieras. Puede usar numerosos complementos, diferentes temas o extensiones. Incluso puede escribir su código para crear una solución exactamente para sus necesidades. En este artículo, le mostraré tres formas de agregar código personalizado a WooCommerce y WordPress.

Tres formas de agregar código personalizado a WooCommerce y WordPress

  • Usar un complemento
  • Uso de las funciones de su tema hijo.php
  • Uso de complementos obligatorios

¿Qué método debe usar?

Los tres métodos funcionan, pero difieren en términos de complejidad y seguridad. Explicaré cada uno de ellos en detalle, pero si no sabe qué solución usar, lea primero este párrafo .

Si eres un completo principiante en WordPress y la idea de agregar un código personalizado te asusta, puedes elegir un complemento para agregar un código personalizado a WooCommerce y WordPress . Esta es la solución más simple, que no requiere conocimientos de código. Sin embargo, tenga en cuenta que esos complementos pueden ser objeto de ataques en su sitio web .

Si está buscando la solución más segura y no quiere depender de su tema, elija Complementos obligatorios . Agregar complementos obligatorios parece complicado, pero si aprende esta funcionalidad, agregar otro código personalizado será muy fácil. También puedo agregar que esta es la forma recomendada por nuestros desarrolladores .

Si crear Must Use Plugin es demasiado para usted, puede usar el archivo functions.php de su tema secundario . También es una buena solución, pero tenga cuidado y siga algunas reglas. Sobre todo, recuerda agregar tu código a un tema Child .

Agregue código personalizado a WordPress con un complemento

No creo que sorprenda a nadie con el hecho de que puede usar un complemento para agregar código personalizado a WordPress. Hay bastantes de ellos en el repositorio de WordPress. En este artículo, le mostraré cómo usar el complemento Code Snippets.

Solución fácil…

Esta solución es cada vez más popular. ¿Porqué es eso? En primer lugar, es el más simple. En la mayoría de los casos, todo lo que tiene que hacer es instalar un complemento adicional, pegar el código y todo estará listo. No requiere ningún conocimiento del código y prestar atención adicional. Además, todos los complementos son gratuitos y están disponibles en el repositorio de WordPress.

Su simplicidad lo convierte en una solución extremadamente tentadora para los usuarios principiantes de WordPress. Lo entiendo. Si eres un novato completo, probablemente usar un complemento para agregar tu código personalizado sea el movimiento correcto . Desafortunadamente, esta solución tiene sus desventajas.

…pero no seguro.

Tenga en cuenta que no es la solución más segura. Por sus características específicas, complementos como Code Snippets pueden ser objeto de ataques a su sitio web . Si desea utilizar esta opción, recuerde usar complementos actualizados regularmente y, además, proteger su sitio web. Sin embargo, será mejor si usa una de las otras soluciones presentadas en ese artículo.

Basta de descripciones y teorías. Es hora de pasar a una guía adecuada.

¿Cómo agregar un código personalizado con el complemento Code Snippets?

Para agregar un nuevo fragmento, simplemente vaya a Fragmentos en el menú de WordPress y haga clic en el botón Agregar nuevo . También puede usar el enlace Agregar nuevo en el menú de WordPress directamente.

agregue un nuevo fragmento en el complemento Code Snippets

En una nueva página, puede agregar su fragmento. En este ejemplo, usaré el código personalizado de mi artículo anterior sobre Cómo agregar una ciudad de los Emiratos Árabes Unidos en WooCommerce.

Ingrese el Título de su código personalizado. Debe ser autodescriptivo para que pueda determinar fácilmente cómo funciona. Puede agregar una descripción para obtener información adicional.

nuevo código personalizado en el complemento Code Snippets

También puede agregar algunas etiquetas y prioridad. Si todo está completo, guarda los cambios y activa el fragmento .

Guarde el nuevo código personalizado en el complemento Code Snippets

Puede hacerlo en la misma página o en la lista Todos los fragmentos .

Activar nuevo código personalizado en el complemento Code Snippets

Si el fragmento es correcto, su código personalizado debería funcionar bien y estar activo en su sitio web.

Agregar código personalizado a functions.php en WordPress

Esta es sin duda la solución más popular para agregar código personalizado en WordPress. En muchos artículos o documentación, puedes encontrar información para agregar un código determinado al archivo functions.php de tu tema. ¿Cómo hacerlo? No es tan complicado.

Recuerda usar el tema infantil

Recomendamos enfáticamente agregar su código personalizado al archivo functions.php de Child Theme en lugar de a su tema original . Hay dos razones principales para hacerlo. Si agrega su código personalizado al archivo functions.php de su tema habitual, todos los cambios se perderán con cada actualización del tema. Además, es mucho más probable que su sitio web se bloquee al cometer un error en el código o al eliminar un elemento importante del código agregado previamente.

Si desea obtener más información sobre el uso de Child Themes en WordPress, consulte el Manual de temas oficial.

Recuerda que agregar código al archivo functions.php de tu tema te hará dependiente de él. Si decide cambiar su tema o depurar un error en otro tema, el código agregado anteriormente no funcionará. Es por eso que esta solución es mejor para agregar cambios a su tema en lugar de agregar cambios a la funcionalidad del sitio web.

¿Cómo agregar código personalizado a functions.php en WordPress?

Agregue el código a su tema Functions.php desde el panel de WordPress

Simplemente vaya a Apariencia > Editor de temas . Asegúrese de que está editando su tema secundario y seleccione Funciones de tema (functions.php) .

Archivo functions.php del tema infantil

Allí puedes pegar tu código personalizado.

Agregar código personalizado a functions.php en WordPress

Asegúrese de que no haya una etiqueta de cierre ?> y Actualizar archivo .

Agregue el código a su tema Functions.php desde cPanel o FTP

Para hacer eso, use el Administrador de archivos de su cPanel o cliente FTP. En ambas situaciones, vaya a la carpeta public_html > [Carpeta de WordPress] > wp-content > themes > [carpeta de temas] > functions.php .

Agregue el código personalizado en Functions.php desde el cliente FTP

Abre y edita ese archivo. Desplácese hacia abajo hasta el final del archivo, pegue el código y guárdelo. Este método es mejor que usar el panel de WordPress . Si algo en el código está mal y causará algún problema en su sitio web, se puede revertir fácilmente.

Agregar código personalizado usando complementos obligatorios

Must Use Plugins, o simplemente mu-plugins , son complementos instalados de manera diferente a los complementos normales. Se instalan en el directorio wp-content/mu-plugins . Los complementos obligatorios no necesitan (y no pueden) activarse. Tampoco se pueden desactivar. Los complementos están activos y funcionan siempre que estén en el directorio mu-plugins .

Must Use Plugins es una forma ideal de agregar funcionalidad adicional relacionada con el sitio, cosas que siempre deberían funcionar, incluso cuando cambia su tema. También es una solución muy segura. Nuestros desarrolladores recomiendan agregar un código personalizado usando complementos obligatorios.

¿Cómo agregar el complemento obligatorio?

Como verá, agregar Must Use Plugin no es tan difícil. Primero, en el directorio wp-content crea una nueva carpeta mu-plugins . Puede usar el Administrador de archivos de su cliente cPanel o FTP. En el nuevo directorio, cree un nuevo archivo. Agregué simplemente el archivo custom_code.php . Abra el archivo para editarlo y agregue su código personalizado. Recuerde comenzar con <?php, pero no agregue la etiqueta de cierre?>. Su código debería verse así:

<?php

//your custom code

Guarde el archivo y Must Use Plugin debería estar activo y funcionando. Básicamente, puede usar los complementos mu como un antiguo functions.php para agregar código personalizado a WooCommerce y WordPress. Puede agregar muchos o incluso todos nuestros fragmentos en un solo archivo.

Puede encontrar los complementos que debe usar en el panel de WordPress. Simplemente vaya Complementos> Complementos instalados> Uso obligatorio . Será solo el nombre del archivo que ha agregado.

Complemento imprescindible en WordPress

Si desea incluir información adicional sobre el código personalizado en WordPress, puede agregar un comentario típico de complemento al comienzo del archivo, con información sobre el nombre, el autor y la versión:

/*

Plugin Name: My custom code

Description: Functions extending the capabilities of my website

Version: 1.0

Author: Bartosz Gajewski

*/

Con ese comentario adicional, su complemento mu debería verse así:

Complemento imprescindible en WordPress con información adicional

Resumen

Espero que no importa qué método elijas para agregar código personalizado a WooCommerce y WordPress , este artículo te haya sido útil. Las sugerencias presentadas en este artículo deberían ayudarlo no solo a agregar código personalizado, sino también a reducir el riesgo asociado con agregarlo.