Creación de un sitio de GitHub Pages

Creación de un sitio de GitHub Pages

Publii incluye soporte para páginas de Github, que te brindan un espacio para crear un sitio web que puedes usar para destacar tus proyectos de Github o para ti mismo. Desafortunadamente, hay poca funcionalidad para crear un sitio web a menos que tengas algunos conocimientos y estés dispuesto a aprender herramientas difíciles de configurar como Jekyll, pero gracias a Publii podrás crear un sitio web impresionante y con todas las funciones en solo unos minutos, que es muy fácil de actualizar y mantener.

Crear una página de Github no lleva mucho tiempo, pero hay algunos pasos que debemos cubrir, comenzando con:

Generando un token de acceso

Antes de que podamos comenzar a crear una página de Github, necesitamos generar un token de acceso; esto permitirá que Publii obtenga acceso y realice cambios en su página de Github para que pueda crear y editar su sitio web cada vez que haga clic en el botón Sincronizar en la aplicación Publii; ¡piense en ello como crear una contraseña que Publii puede usar para ingresar al club Github!

Generar un token de acceso solo toma unos segundos; solo siga estos pasos:

  1. Comience por dirigirse a la página principal de Github e inicie sesión en su cuenta; si aún no tiene una cuenta, simplemente haga clic en el enlace Registrarse y complete el proceso de registro.
    Iniciar sesión en la cuenta de Github
  2. Después de iniciar sesión, abra la configuración de su perfil de Github.
    Configuración del perfil de usuario de Github
  3. En la barra lateral izquierda de la pantalla de tu perfil, haz clic en Configuración de desarrollador.
    Configuración de desarrollador de Github
  4. En la página de aplicaciones de GitHub, en la barra lateral izquierda, haz clic en la opción Tokens de acceso personal y selecciona la opción Tokens (clásico) .
    Enlace a tokens de acceso personal
  5. Ahora estamos en la página de tokens de acceso personal; necesitamos crear uno nuevo para nuestro sitio, así que haga clic en el botón Generar nuevo token cerca de la parte superior de la pantalla y seleccione la opción Generar nuevo token (clásico) .
    Generar nuevo token
  6. En la siguiente pantalla, completa un nombre en la sección Nota , por ejemplo, "Página de GitHub de Publii". Ahora, en la sección Seleccionar ámbitos , agrega una marca de verificación a la opción principal Repositorio , que le dará al token acceso a todos los aspectos de la administración de tu repositorio. También puedes establecer una fecha de vencimiento para tu token, por ejemplo, "90 días", para ayudar a mantener segura tu información. Por último, haz clic en el botón verde Generar token en la parte inferior de la pantalla.
    Nuevo token de acceso personal a GitHub
  7. Ahora volverás a la página de tokens de acceso personal, pero ahora tu nuevo token estará visible en la parte superior de la lista. Hagas lo que hagas, no cierres ni actualices esta página; el token solo estará visible inmediatamente después de su generación. Haz clic en el ícono Copiar junto a tu token (mira la imagen a continuación) y cópialo en un lugar seguro, ya que lo necesitaremos al configurar Publii para que funcione con nuestra página de Github.
    Copiar token de acceso personal

    Recuerda: no podrás volver a ver el token, así que asegúrate de guardarlo en algún lugar.

Ahora tenemos un token generado, por lo que podemos crear nuestro sitio web en Publii y darle acceso a nuestra página de Github.

Creando nuestro sitio web estático en Github Pages

Ya tenemos nuestro token de acceso, por lo que esto permitirá a Publii acceder a nuestra página de Github para cargar los archivos del sitio web, pero ahora tenemos que crear el área en Github donde irá nuestro sitio. Regresemos a Github y comencemos:

  1. Inicie sesión en Github normalmente, luego haga clic en el ícono más en la barra superior para abrir un submenú; ahora haga clic en la opción Nuevo repositorio para ir a la pantalla Crear un nuevo repositorio .
    Crear un repositorio en Github
  2. En esta pantalla, completa un Nombre de repositorio y deja el repositorio como Público (las páginas de Github siempre son públicas, incluso cuando el repositorio que las aloja se hace privado). A continuación, haz clic en el botón verde Crear repositorio en la parte inferior de la pantalla.
    Crear un nuevo repositorio de GitHub
  3. Ahora estamos en la pantalla de configuración rápida . Puede que parezca un poco confuso, pero solo tenemos que hacer una cosa sencilla. Hacer clic en el enlace README , como se muestra en la imagen siguiente. Esto nos llevará a una pantalla para crear un archivo README.
    Configuración rápida de páginas de Github
  4. En la pantalla de edición del archivo README, simplemente haga clic en el botón Confirmar nuevo archivo . Solo estamos creando este archivo porque su repositorio necesita que se agregue al menos un elemento para crear su rama maestra, donde se guardarán todos sus archivos de Publii. Este archivo creado se eliminará automáticamente la primera vez que Publii se sincronice con nuestra página de Github.
    Confirmar nuevo archivo
  5. Después de confirmar el archivo, volvemos a la lista de archivos; haga clic en la pestaña Configuración cerca de la parte superior de la pantalla.
    Configuración de páginas de Github
  6. En la pantalla de configuración, en la barra lateral izquierda, haz clic en Páginas ; en la sección Generación e implementación , específicamente en la sección Rama , haz clic en la lista desplegable que, por defecto, muestra Ninguna y selecciona la rama principal de la lista de opciones. Ahora haz clic en el botón Guardar para asegurarte de que los cambios se hayan confirmado.
    Rama principal de Github Pages
  7. Después de guardar, tus páginas de GitHub estarán listas para usarse como un servidor de sitios web estático; para ver tu sitio web, deberás ir a la URL proporcionada en el cuadro de mensaje. A veces, es posible que debas actualizar la página que estás viendo actualmente para ver el cuadro de URL. Por supuesto, tu sitio aún no tiene ningún archivo, pero vamos a cambiar eso.
    URL de páginas de GitHub

Y eso es todo en lo que respecta a Github; ahora podemos saltar a Publii para el paso final.

Sincronización de su sitio estático de Publii con Github

Con todo preparado en Github, podemos actualizar la configuración de conexión en Publii para sincronizar con el repositorio de páginas de Github que acabamos de crear. Primero, abre Publii; si aún no has creado tu sitio web, crea uno y agrega al menos una publicación y asegúrate de haber seleccionado un tema; sin ellos, tu sitio no se creará correctamente.

Configuración de páginas de GitHub

Ahora haga clic en la opción Servidor en la barra lateral izquierda para abrir la pantalla Configuración del servidor . Complete los campos con la siguiente información:

  • URL del sitio web : esta será la ruta de su repositorio de Github, que utiliza el formato "SU_NOMBRE_DE_USUARIO.github.io/SU_NOMBRE_DE_REPOSITORIO" .
  • Servidor API  : de forma predeterminada, este campo ya está completado con el servidor API estándar. Sin embargo, si está ejecutando su propia instancia de GitHub, puede cambiar el servidor API ingresándolo aquí.
  • Nombre de usuario : agregue su nombre de usuario de Github aquí.
  • Repositorio : ingrese aquí el nombre de su repositorio de Github (lo configuramos en el paso 2 de la sección Página de Github anterior).
  • Rama - Si ha estado siguiendo nuestra guía, escriba main (sensible a mayúsculas y minúsculas) en el campo de texto; los usuarios experimentados pueden querer especificar otras configuraciones como gh-pages , docs , etc.
  • Token : ¿Recuerdas el token de acceso que guardamos en la primera parte de esta guía? Introdúcelo aquí para que Publii pueda acceder al repositorio.
  • Cargas paralelas  : el valor predeterminado es "1". Establece la cantidad de secuencias de carga que Publii puede usar al cargar el contenido de su sitio a GitHub Pages. Los números más altos permiten cargas más rápidas, pero pueden causar errores en conexiones lentas o un error 403 debido a los límites de velocidad de carga de la API.
  •  Limitación de velocidad de API  : deshabilite esta opción solo si está usando Github Enterprise con la limitación de velocidad de API deshabilitada. De lo contrario, deshabilitar esta opción puede provocar errores de implementación.

Una vez que se hayan configurado todas las opciones, haga clic en el botón Guardar configuración para guardar los cambios. Ahora puede ser un buen momento para hacer clic en el botón Probar conexión , que comprobará si Publii puede conectarse a su página de Github; si no es así, es posible que algunos de los campos se hayan ingresado incorrectamente.

Ya está todo listo, así que podemos hacer clic en el botón Sincronizar su sitio web en la barra lateral de Publii para comenzar la implementación.

¡IMPORTANTE! Es posible que el sitio Publii que cargó no sea visible inmediatamente una vez que se haya completado el proceso de sincronización; puede que transcurra aproximadamente un minuto antes de que pueda ver los cambios en su sitio web. Si desea volver a verificar que se hayan aplicado los cambios, puede consultar la sección Confirmaciones de su repositorio y marcar el ícono junto a su última confirmación en el área de confirmación:

Botón de confirmación de páginas de Github
Lista de commits de GitHub

Si el icono es un punto naranja, significa que se han recibido los cambios, pero aún no se han implementado. Después de una breve espera, se agregarán los cambios.

Limitaciones

La implementación del soporte de Github Pages en Publii tiene dos limitaciones en la iteración actual:

  • No es posible cargar un sitio web con más de 1000 archivos, aunque este límite se incrementará a aproximadamente 5000 archivos en versiones posteriores. Este límite es lo suficientemente alto para la gran mayoría de los sitios web, pero es bueno tenerlo en cuenta en caso de que esté ejecutando un proyecto de sitio web muy grande a través de Publii.
  • La API de Github está limitada a 5000 solicitudes por hora; Publii te informará si tu límite de solicitudes es demasiado bajo para completar la implementación o sincronización de tu sitio web. Este límite también se aplica si una sincronización tiene más de 5000 cambios a la vez; en este caso, debes sincronizar tu sitio web con regularidad para evitar acumular demasiados cambios.

Algunos consejos y trucos útiles

¿Quieres tener un poco más de control sobre tu sitio? Aquí tienes algunos trucos útiles que te ayudarán a que tu sitio quede exactamente como quieres:

Simplifique la URL de su sitio web a yourusername.github.io

De forma predeterminada, la URL de su página de Github será username.github.io/repository-name , pero podemos simplificarlo creando un repositorio para nuestro sitio web llamado yourusername.github.io, por ejemplo, si mi nombre de usuario es TestName, crearía un repositorio llamado TestName.github.io .

Luego, en lugar de duplicar la URL como TestName.github.io/TestName, Github simplificará la URL a TestName.github.io únicamente.

Utilice un dominio personalizado

Si prefieres usar tu propio nombre de dominio en lugar del subdominio predeterminado github.io, Publii creará automáticamente el archivo CNAME con tu nombre de dominio personalizado que buscan las páginas de Github.

Antes de hacer esto, deberá configurar su dominio utilizando el tercer paso de este tutorial de dominio personalizado de Github ; si necesita más ayuda, los consejos incluidos en este artículo de configuración de dominio le ayudarán.

¿Está SSL disponible para su dominio personalizado?

Todos los subdominios de github.io tienen SSL habilitado de forma predeterminada, también el HTTPS es compatible con las páginas de Github que tienen dominios personalizados.

Utilice diferentes ramas en su repositorio

En nuestro tutorial, usamos específicamente la rama maestra de nuestro repositorio, pero usted es libre de usar otras ramas; por ejemplo, podría crear un sitio web de documentación para su repositorio existente usando una rama de documentación. Simplemente cree una rama adicional y configure esta nueva rama como su fuente de páginas de Github en su configuración de Github.

¡IMPORTANTE! Si utiliza una rama diferente de la rama maestra para su sitio web de Github Page, asegúrese de cambiar el nombre de la rama en la configuración de Publii. Si la deja como "maestra" y luego sincroniza su sitio web, Publii eliminará todos los archivos existentes de su rama maestra.

arriba