Cómo implementar automáticamente los cambios en el tema de WordPress usando GitHub e implementar

¿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 el sitio de prueba o en vivo. En este artículo, le mostraremos cómo implementar automáticamente los cambios del tema de WordPress usando GitHub y Deploy.

¿Por qué usar el sistema de control de versiones para el desarrollo de temas de WordPress??

Primero, necesitamos entender que control de versiones medio:

… Un sistema que registra cambios en un archivo o conjunto de archivos a lo largo del tiempo para que pueda recuperar versiones específicas más tarde http://git-scm.com/book/en/v2/Getting-Started-About-Version-Control

En otras palabras, cada vez que cambiamos una plantilla de tema de WordPress, una imagen o un archivo CSS, un sistema de control de versiones realiza un seguimiento de estos cambios. En puntos particulares, podemos etiquetar (confirmar) un lote de cambios. Si esos cambios causan un problema, podemos revertir (o revertir) a una "versión" existente de nuestro tema de WordPress.

Git es un sistema de control de versiones común y permite que varios usuarios (desarrolladores web) trabajen en el mismo código base (como un tema de WordPress). Si dos desarrolladores editan el mismo archivo, Git ha incorporado controles para tratar estos problemas (conocidos como conflictos de combinación).

Los sistemas de control de versiones Git alojados de terceros, como GitHub y BitBucket, permiten a los usuarios dejar problemas (o tickets) si detectan un problema con su código. Los cambios en el código se pueden confirmar (etiquetar) contra un problema en particular, para mostrar los cambios exactos en el código realizados para solucionar un problema. Esto es realmente útil cuando revisa el código dentro de 6 o 12 meses y quiere saber por qué hizo algo de una manera particular..

¿Por qué usar 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.

Puede verlo como un sistema de sincronización unidireccional; por ejemplo, si elimina un archivo de su tema de WordPress, tendrá que acordarse de eliminarlo también a través de FTP. Con un sistema de implementación, esto se hace automáticamente cuando confirma los cambios de código en GitHub.

Configuración de un repositorio GitHub para su tema de WordPress

Primero, configuraremos una cuenta en GitHub, usaremos el cliente GitHub para Windows o Mac para almacenar nuestro tema de WordPress en GitHub.

Dirígete a https://github.com y regístrate 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 de WordPress).

Comience por configurar el nombre del repositorio - el nombre de la carpeta de su tema de WordPress es una buena idea. Luego, elige si esto es un Público o Privado repositorio. Los repositorios públicos están disponibles para que todos puedan ver su código, pero no pueden realizar cambios en él. Los repositorios privados están disponibles para que los veas..

Por último, marque la casilla de verificación a continuación Inicializa este repositorio con un archivo README., y luego haga clic en el Crear repositorio botón.

Si todo ha funcionado, deberías ver tu nuevo repositorio en pantalla:

Instalar GitHub para Windows / Mac

A continuación, debemos colocar el código de nuestro tema de WordPress en nuestro repositorio. Podemos hacerlo usando el cliente GitHub, que se instala en su computadora.

Simplemente visite el sitio web de GitHub Desktop y descargue el cliente de GitHub Desktop disponible para Windows y Mac.

Una vez descargado, inicie el proceso de instalación haciendo clic en Continuar

En la siguiente pantalla, ingrese su nombre de usuario y contraseña de GitHub, que creó cuando se registró en GitHub. Haga clic en el Registrarse botón cuando haya terminado.

Si los detalles de inicio de sesión son correctos, se mostrará su cuenta. Haga clic en el Continuar botón para proceder:

Podemos dejar el Git Config sección como la configuración por defecto. Asegúrese de hacer clic en el Instalar herramientas de línea de comandos opción, antes de hacer clic en el Continuar botón:

Finalmente, haga clic en Listo y aparecerá la pantalla de GitHub..

Agreguemos nuestro repositorio GitHub que creamos anteriormente. Para hacer esto, haga clic en el icono más en la esquina superior derecha, y luego Clon opción. Verá una lista de sus repositorios de GitHub, incluido el que creamos anteriormente:

Haga clic en el repositorio que creó anteriormente y luego haga clic en Clon botón.

Elija dónde en su computadora desea almacenar este repositorio y haga clic en Clon botón una vez que haya elegido esto.

Ahora hemos clonado (copiado) nuestro repositorio alojado en GitHub a nuestra computadora.  

A continuación, debemos agregar nuestro código de tema de WordPress a la carpeta del repositorio, y luego confirmar y sincronizar este código a GitHub.

Comience por encontrar la carpeta que seleccionó en el paso anterior en su computadora. Debería tener un README.md archivo en la carpeta. Dependiendo de la configuración de su computadora, también puede ver los .git carpeta:

Copia y pega el código de tu tema de WordPress en esta carpeta:

Abra la aplicación GitHub Mac o Windows, y ahora verá que los archivos que acaba de agregar aparecen en la ventana:

Verá los cambios resaltados en verde. Estos son los cambios que ha guardado en el repositorio local, pero todavía no los ha confirmado..

A continuación, debemos enviar (cargar) estos archivos a GitHub. Para ello, introduzca algún texto en el Resumen cuadro para explicar los cambios que hemos realizado (por ejemplo,. Mi primer compromiso), y haga clic en Comprometerse a dominar botón.

Esto confirma los cambios que has realizado en el repositorio. Para cargar esos cambios en GitHub, haga clic en el botón Sincronizar en la esquina superior derecha de la ventana de la aplicación GitHub.

Para verificar que su compromiso se haya cargado en GitHub, visite su repositorio en el sitio web de GitHub. Si todo funcionó, verás tu código:

Configuración de despliegue

Hasta ahora, hemos configurado GitHub y comprometido el código de nuestro tema de WordPress en su repositorio de GitHub. El último paso es cargar cualquier cambio en su repositorio de GitHub a su sitio web de WordPress.

DeployHQ o simplemente Implementar, es un servicio basado en web que monitoreará los cambios en su repositorio de GitHub, y cargará automática o manualmente solo esos cambios a su sitio web de WordPress.

Imagínelo como una conexión en medio de su código y servidor web:

Primero necesitas visitar el sitio web de implementación y registro. La implementación 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 su panel de implementación. 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.

Implementar ahora te redireccionará 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ón 'Autorizar 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 y Deploy lo importará por usted.

En el siguiente paso, Deploy le pedirá que proporcione información del servidor. Aquí es donde le dices a Deploy cómo cargar archivos a tu servidor de WordPress.

Necesitarás tus credenciales de FTP para eso.

• Nombre: Proporcione un nombre para esta conexión
• Protocolo: FTP o si tiene SFTP o SSH, puede usarlos también
• Nombre de host El servidor SFTP / FTP de su sitio web.
• Puerto: El puerto SFTP / FTP del host de su sitio web (generalmente SFTP = 22, FTP = 21)
• Nombre de usuario y contraseña: Nombre de usuario y contraseña de FTP.
• Ruta de despliegue: La ruta a la que navegarías antes de cargar tus archivos de tema de WordPress. Por ejemplo, public_html / example.com / wp-content / themes / MyTheme, dónde Mi tema es el tema de WordPress que has comprometido con GitHub.

Haga clic en el botón Guardar para continuar..

La implementación ahora probará 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 Implementar ahora para cargar sus archivos de GitHub en su sitio web.

Implementar le mostrará los detalles de este despliegue. Simplemente haga clic en el botón Implementar en la parte inferior.

Ahora verá el progreso de la implementación. Una vez que la implementación haya finalizado, verás un mensaje de éxito.

Ha implementado con éxito los cambios de GitHub a su sitio web usando Implementar. Ahora, cuando realiza cambios en su tema de WordPress en su computadora, debe enviarlos a GitHub. Después de eso, debe visitar el sitio web de implementación para iniciar la implementación manualmente.

Veamos cómo configurar la implementación automática para que los cambios que confirme en GitHub se implementen automáticamente en su sitio web.

Configuración de la implementación automática

Primero debe visitar su panel de Despliegue e ir a la página de Proyectos. Haga clic en el nombre de su proyecto..

Desde la página del proyecto, lleve el mouse al menú Configuración y luego seleccione Servidores y grupos.

Haga clic en el icono de edición al lado de su servidor.

Esto te llevará a editar la pantalla del servidor. En la columna de la derecha encontrará la configuración de implementación automática..

Asegúrese de que esté encendido. A continuación verá una URL. Copia esta URL como la necesitarás en el siguiente paso.

Inicie sesión en su cuenta de GitHub en una nueva pestaña del navegador. Haga clic en su repositorio y luego haga clic en Configuración. Haga clic en el enlace de Webhooks y Servicios.

Haga clic en el botón Agregar webhook.

Pegue la URL que copió de la página Implementar configuración del servidor en el campo URL de carga útil. Seleccionar aplicación / x-www-form-urlencoded como el tipo de contenido y pulsa Agregar webhook.

Eso es todo, su repositorio de GitHub ahora notificará a Deploy cuando haya nuevos cambios en su repositorio. Deploy implementará automáticamente esos cambios en su sitio web.

Prueba de despliegue automático

Para probar la implementación automática, simplemente realice algunos cambios en su repositorio de temas de WordPress en su computadora.

Abra la aplicación de escritorio GitHub y luego confirme esos cambios.

No olvides hacer clic en el botón de sincronización..

Ahora visita tu proyecto en el panel de despliegue. Haga clic en las implementaciones y encontrará su implementación automática en la lista.

Eso es todo, esperamos que este artículo te haya ayudado a aprender cómo implementar automáticamente los cambios de tema de WordPress usando GitHub y Deploy. También puede consultar nuestra guía sobre cómo crear un entorno de prueba para un sitio de WordPress.

.