¿Desea implementar automáticamente los cambios de tema de WordPress en su sitio web? La mayoría de los desarrolladores web profesionales utilizan un sistema de control de versiones como GitHub o BitBucket e implementan automáticamente sus cambios en la puesta en escena o en el sitio en vivo. En este artículo, le mostraremos cómo implementar automáticamente los cambios de tema de WordPress usando GitHub y Deploy.
¿Por qué utilizar el sistema de control de versiones para el desarrollo de temas de WordPress?
Primero, necesitamos entender lo que significa control de versiones :
… un sistema que registra los cambios en un archivo o conjunto de archivos a lo largo del tiempo para que pueda recuperar versiones específicas más adelante http://git-scm.com/book/en/v2/Getting-Started-About-Version-Control
En otras palabras, cada vez que cambiamos una plantilla de tema, imagen o archivo CSS de WordPress, un sistema de control de versiones hace un seguimiento de estos cambios. En determinados puntos, podemos etiquetar (confirmar) un lote de cambios. Si esos cambios causan un problema, podemos revertir (o retroceder) a unaversión existente de nuestro Tema de WordPress.
Git es un sistema de control de versiones común, y permite a múltiples usuarios (desarrolladores web) trabajar sobre la misma base de código (como un tema de WordPress). Si dos desarrolladores editan el mismo archivo, Git ha incorporado controles para tratar estos problemas (conocidos como conflictos de fusión).
Los sistemas de control de versiones de Git, como GitHub y BitBucket, permiten a los usuarios dejar problemas (o tickets) si detectan un problema con tu código. Los cambios de código pueden ser confirmados (etiquetados) contra un problema en particular, para mostrar los cambios de código exactos realizados para corregir un problema. Esto es realmente útil cuando miras hacia atrás al código en 6 o 12 meses y quieres saber por qué hiciste algo de una manera particular.
¿Por qué utilizar un sistema de implementación?
Un sistema de implementación, que se integra con servicios como GitHub, le permite cargar automática o manualmente los cambios que haya realizado en su tema de WordPress.
Puedes verlo como un sistema de sincronización unidireccional – por ejemplo, si eliminas un archivo de tu Tema de WordPress, tendrás que acordarte de eliminarlo también a través de FTP. Con un sistema de implementación, esto se hace automáticamente cuando confirmas los cambios de código a GitHub.
Configurar un repositorio GitHub para tu tema de WordPress
Primero crearemos una cuenta en GitHub, usaremos el cliente GitHub para Windows o Mac para almacenar nuestro Tema WordPress en GitHub.
Visite https://github.com y regístrese para obtener una cuenta gratuita.
Una vez que se haya registrado y confirmado su dirección de correo electrónico, haga clic en el icono más en la esquina superior derecha de la pantalla y elija Nuevo repositorio (un repositorio es un contenedor para su código – en este caso, nuestro Tema WordPress).
Comience por establecer el nombre del repositorio – el nombre de la carpeta de su Tema WordPress es una buena idea. A continuación, elija si se trata de un repositorio Público o Privado . Los repositorios públicos están disponibles para que todos puedan ver tu código, pero no pueden hacer cambios en él. Los repositorios privados están disponibles sólo para que usted los vea.
Finalmente, marque la casilla de verificación Inicializar este repositorio con un README , y luego haga clic en el botón Crear repositorio .
Si todo ha funcionado, debería ver su nuevo repositorio en pantalla:
Instalar GitHub para Windows / Mac
A continuación, necesitamos poner el código de nuestro Tema de WordPress en nuestro repositorio. Podemos hacerlo usando el cliente GitHub, que se instala en su ordenador.
Simplemente visite el sitio web de GitHub Desktop y descargue el cliente GitHub Desktop disponible para Windows y Mac.
Una vez descargado, inicie el proceso de instalación haciendo clic en Continuar
En la siguiente pantalla, introduce tu nombre de usuario y contraseña de GitHub, que creaste cuando te registraste en GitHub. Haga clic en el botón Iniciar sesión cuando haya terminado.
Si los datos de acceso son correctos, se mostrará su cuenta. Haga clic en el botón Continuar para continuar:
Podemos dejar la sección Git Config como configuración por defecto. Asegúrese de hacer clic en la opción Instalar herramientas de línea de comandos antes de hacer clic en el botón Continuar :
Finalmente, haz clic en Listo y te aparecerá la pantalla de GitHub.
Añadamos nuestro repositorio GitHub que creamos anteriormente. Para ello, haga clic en el icono más en la esquina superior derecha y, a continuación, en la opción Clonar . Verás una lista de tus repositorios GitHub, incluyendo el que creamos anteriormente:
Haga clic en el repositorio que creó anteriormente y, a continuación, haga clic en el botón Clonar .
Elija en qué parte de su equipo desea almacenar este repositorio y haga clic en el botón Clonar una vez que lo haya elegido.
Ahora hemos clonado (copiado) nuestro repositorio alojado en GitHub en nuestro ordenador.
A continuación, necesitamos añadir nuestro código de Tema de WordPress a la carpeta del repositorio, y luego confirmar y sincronizar este código con GitHub.
Empiece por encontrar la carpeta que seleccionó en el paso anterior en su computadora. Debe tener un archivo README.md en la carpeta. Dependiendo de la configuración de tu ordenador, es posible que también veas la carpeta.git oculta:
Copia y pega el código de tu Tema de WordPress en esta carpeta:
Abre la aplicación GitHub Mac o Windows y verás que los archivos que acabas de añadir aparecen en la ventana:
Verá los cambios resaltados en verde. Estos son los cambios que ha guardado en el repositorio local pero que aún no ha confirmado.
A continuación, necesitamos confirmar (subir) estos archivos a GitHub. Para ello, introduzca algo de texto en el cuadro Resumen para explicar los cambios que hemos realizado (por ejemplo, Mi primera confirmación ) y haga clic en el botón Confirmar como maestro .
Esto confirma los cambios que ha hecho en el repositorio. Para subir esos cambios a GitHub, haz clic en el botón Sincronizar en la esquina superior derecha de la ventana de la aplicación GitHub.
Para comprobar que tu confirmación ha sido cargada en GitHub, visita tu repositorio en el sitio web de GitHub. Si todo funcionó, verás tu código:
Configuración de la implementación
Hasta ahora, hemos configurado GitHub y confirmado el código de nuestro Tema de WordPress en tu repositorio de GitHub. El paso final es subir cualquier cambio en tu repositorio GitHub a tu sitio web de WordPress.
DeployHQ o simplemente Deploy, es un servicio basado en web que monitorea los cambios en su repositorio GitHub, y carga automática o manualmente sólo esos cambios en su sitio web WordPress.
Imagínalo como una conexión en medio de tu código y servidor web:
Primero debe visitar el sitio web de Deploy y registrarse. Deploy es un servicio de pago, pero ofrece una cuenta gratuita para un proyecto y 10 implementaciones por día.
Después de finalizar el registro, puede iniciar sesión en el panel de control de Deploy. Haga clic en crear un nuevo proyecto para empezar.
A continuación, debe proporcionar un nombre para su proyecto y seleccionar su plataforma de alojamiento de código, GitHub. Haga clic en el botón Crear proyecto para continuar.
Deploy te redirigirá ahora a GitHub. Si aún no ha iniciado sesión, se le pedirá que inicie sesión. Después de eso, se te pedirá que permitas que Deploy acceda a tu cuenta de GitHub.
Haga clic en el botónAutorizar aplicación para continuar.
Deploy obtendrá la lista de sus repositorios de GitHub y le pedirá que seleccione un repositorio para este proyecto.
Simplemente haga clic en el repositorio de temas de WordPress e Deploy lo importará por usted.
En el siguiente paso, Deploy le pedirá que proporcione información del servidor. Aquí es donde usted le dice a Deploy cómo subir archivos a su servidor WordPress.
Necesitará sus credenciales FTP para ello.
- Nombre: Proporcione un nombre para esta conexión
- Protocolo: FTP o si tiene SFTP o SSH entonces puede usarlos también
- Nombre de host: El host SFTP/FTP de su sitio web.
- Puerto: Puerto SFTP/FTP del host de su sitio web (normalmente SFTP = 22, FTP = 21)
- Nombre de usuario y contraseña : Nombre de usuario y contraseña FTP.
- Ruta de despliegue: La ruta a la que navegaría antes de cargar los archivos de tema de WordPress. Por ejemplo, public_html/example.com/wp-content/themes/MyTheme , donde MyTheme es el tema de WordPress que has asignado a GitHub.
Haga clic en el botón de guardar para continuar.
Deploy probará ahora la conexión de su servidor y si todo funciona correctamente, le mostrará un mensaje de éxito.
Ahora puede hacer clic en el botón Desplegar ahora para cargar los archivos de GitHub en su sitio web.
Deploy le mostrará los detalles de este despliegue. Simplemente haga clic en el botón Desplegar en la parte inferior.
Ahora verá el progreso de la implementación. Una vez finalizada la implementación, verá un mensaje de éxito.
Has implementado correctamente los cambios de GitHub en tu sitio web utilizando Deploy. Ahora, cuando haces cambios en el tema de WordPress en tu ordenador, tienes que enviarlos a GitHub. Después de eso, debe visitar el sitio web de Desplegar para iniciar la implementación manualmente.
Veamos cómo configurar la implementación automática para que cualquier cambio que confirme en GitHub se implemente automáticamente en su sitio web.
Configuración de la implementación automática
En primer lugar, debe visitar el panel de control de Deploy e ir a la página de Proyectos. Haga clic en el nombre de su proyecto.
Desde la página de su proyecto, lleve el ratón al menú Configuración y seleccione Servidores y grupos.
Haga clic en el icono de edición junto a su servidor.
Esto le llevará a editar la pantalla del servidor. En la columna de la derecha encontrará la configuración de la implementación automática.
Asegúrese de que esté encendido. Debajo verá una URL. Copia esta URL ya que la necesitarás en el siguiente paso.
Accede a tu cuenta de GitHub en una nueva pestaña del navegador. Haga clic en su repositorio y luego en Configuración. Haga clic en el enlace Webhooks and Services.
Haga clic en el botón Añadir Webhook.
Pegue la URL que ha copiado de la página Configuración del servidor de implementación en el campo URL de carga útil. Seleccione application/x-wwww-form-urlencoded como Tipo de contenido y pulse Añadir webhook.
Eso es todo, tu repositorio GitHub notificará ahora a Deploy cuando haya nuevos cambios en tu repositorio. Deploy implementará automáticamente esos cambios en su sitio web.
Prueba de la implementación automática
Para probar la implementación automática, simplemente realice algunos cambios en el repositorio de temas de WordPress de su equipo.
Abra la aplicación de escritorio GitHub y confirme los cambios.
No olvides hacer clic en el botón de sincronización.
Ahora visite su proyecto en el panel de control de Deploy. Haga clic en las implementaciones y encontrará su implementación automática allí.
Eso es todo, esperamos que este artículo te haya ayudado a aprender a implementar automáticamente los cambios de tema de WordPress usando GitHub y Deploy. También puedes ver nuestra guía sobre cómo crear un entorno de preparación para un sitio de WordPress.
Si te ha gustado este artículo, suscríbete a nuestros tutoriales de vídeo de YouTube Channel for WordPress. También puede encontrarnos en Twitter y Facebook.