Cómo configurar un blog personal en github
¿Por qué debería establecer un blog en GitHub? Esta pregunta se puede dividir en dos pasos:
Primero, ¿por qué debería establecer? ¿Un blog en GitHub?
GitHub es un servicio de alojamiento de versiones basado en git con programadores de casi todo el mundo y una gran cantidad de increíbles proyectos de código abierto. Una vez que un proyecto crece, es posible que un nombre y una descripción simples no satisfagan las necesidades de los autores y lectores. GitHub Pages se creó para permitir a los usuarios reemplazar listados de código fuente con páginas personalizadas más descriptivas. También se pueden utilizar como página de inicio personal u organizacional, alojando páginas estáticas.
Entonces, cuando hay una gran cantidad de sistemas de blogs de código abierto (como WordPress), ¿por qué elegir alojar su blog en GitHub?
El proceso de desarrollo y publicación de blogs basado en Git es muy fácil de usar para los programadores y se ve y se siente genial.
Aprende a publicar de forma súper sencilla en 5 minutos.
Las páginas estáticas son fáciles de construir y casi no tienen riesgos de seguridad. Por supuesto, esta también es una de las desventajas, porque las páginas estáticas no permiten demasiada complejidad en el diseño de interacción y la estructura del sitio web. Sin embargo, como blog personal simple, es poco probable que sea necesario
Gratis y confiable
Para obtener más detalles, consulte la tarea aquí: Pros y contras de Jekyll + GitHub Pages
Sin más preámbulos, probémoslo ahora.
Paso dos: crea un prototipo de blog en 10 minutos
Primero, asegúrate de:
Tener una cuenta de GitHub
Git está instalado (en Windows, recomiendo instalar GitExtensions, que tiene una interfaz china e integra git + putty + kDiff, lo que puede ahorrarte algunos problemas)
1. Crear un proyecto
Primero, cree un proyecto en GitHub, asígnele cualquier nombre e intente usar letras minúsculas para evitar conflictos de URL que se encontrarán más adelante
Ejecute Git localmente, seleccione un directorio y cree un proyecto con el nombre que acaba de crear. Selecciona un directorio y clona el proyecto que acabas de crear
cd /d/
git clone /narcotics726/blogdemo.git
cd blogdemo
2. Cree el archivo de configuración _config.yml
Nota : Todos los archivos creados después de esto deben guardarse en codificación libre de BOM UTF-8
Cree un nuevo archivo _config.yml en el directorio raíz del proyecto, complete la URL base:/blogdemo, blogdemo es el nombre del proyecto. , el contenido de esta línea especifica la ruta raíz de todo el sitio web.
3. Crear una página de inicio
Crear un nuevo índice de archivos en el directorio raíz. html, el contenido es el siguiente:
---
título: Hola, mi blog
---
{{ page.title }}
No se apresure a preguntarse por qué aparecen etiquetas como "{}" en los archivos html.
En Liquid Template Language, {{ page.title }} significa "el título de esta página". Lo discutiremos en detalle más adelante. Quizás quieras entenderlo de esta manera:
#--- comienzo del encabezado de la página
título = "Hola, mi blog"
#--- fin del encabezado de la página
print(page.title)
Bien, ¡el diseño de la página de inicio del blog está completo! (Dejen de discutir... les prometí terminarlo en 10 minutos... primero haré una casa en bruto y hablaré de ello después)
4. Publicar en GitHub
Vuelva a git bash, verifique el estado de git, asegúrese de que _config.yml sea correcto, agregue, clasifique y luego agregue el página a index.html. Luego agregue y envíe, mantenga el buen hábito de usar Git, recuerde agregar instrucciones de envío
y luego envíelo a GitHub. Lo que se debe tener en cuenta aquí es que debido a que estamos usando la página del proyecto en GitHub Pages, GitHub. Solo se generará automáticamente el contenido de la rama gh-pages, por lo que la rama maestra local debe enviarse a GitHub. Por lo tanto, la rama maestra local debe enviarse a la rama remota de gh-pages
git push origin master:gh-pages
Espere un momento, hasta 10 minutos (generalmente no tanto), y luego visite su nombre. github.com/blogdemo
, (donde tu nombre
es el nombre de tu cuenta de GitHub y blogdemo es el nombre de tu proyecto), verás la página de inicio de tu blog (muy fea... ...), no parece un blog en absoluto. Pero no te preocupes, es más fácil tomarte tu tiempo
Más rápido~)
Además, si lamentablemente descubres que la página china está confusa, no te preocupes, sigue siendo la misma. Maldito problema de UTF-8. Lo resolveremos por completo más adelante, así que por ahora es sólo cuestión de ajustar manualmente la codificación del navegador.
5. Escribe artículos en _posts y agrega una lista de artículos en la página de inicio.
Al mismo tiempo, sigamos agregando ladrillos y mosaicos a su blog para que tenga la función de lectura de artículos más básica. Además de continuar con F5 en la página, también puede seguir la dirección de correo electrónico que utilizó al registrarse en GitHub. Si presionó anteriormente, se produce un error y le avisará por correo electrónico que la compilación falló.
Vuelva al directorio raíz del proyecto, mkdir _posts, y cree un nuevo directorio para todas las publicaciones.
Vaya al directorio _posts y cree una nueva publicación. Tenga en cuenta que el formato de nombre de archivo predeterminado es año-mes-día-título de la publicación. Por ejemplo, 2013-03-23-my_first_article.md, intente evitar espacios u otros caracteres desordenados; este nombre de archivo se utilizará como base para generar la URL. El formato del nombre del archivo se puede cambiar modificando el atributo de enlace permanente en _config.yml. El valor predeterminado es una fecha y así es como se verá el archivo que acabamos de crear; las reglas exactas se pueden ver aquí y las discutiremos más adelante.
Si notas que el archivo que acabo de crear tiene una extensión .md, entonces los usuarios que estén familiarizados con GitHub o StackOverFlow conocerán el formato Markdown, y esta es una de las razones por las que se recomienda GitHub para hosting. blogs, para que pueda evitar el molesto HTML en la mayoría de los casos y utilizar una sintaxis de Markdown más intuitiva.
Si eres nuevo en esto, aquí tienes una explicación de la sintaxis de Markdown, es muy fácil de aprender y muy sencillo de usar una vez que estés familiarizado con ella.
Vuelve al tema, abre el archivo que acabas de crear y escribe lo siguiente:
--
título: Mi primer artículo
---
# {{ página .title }}
### Tabla de contenidos
+ [Parte I](#partI)
+ [Parte II](# partII)
+ [parteIII](#parteIII)
-------------------------- --- ---
### Parte I
Aquí está el contenido de la primera parte
- ---------------------------------
##Parte 2
Aquí está el contenido de la segunda parte
-------------------- - - ------------
## Parte III
Aquí está el Contenido de la tercera parte
{{ page.date|date_to_string }}
Este párrafo utiliza la sintaxis de Markdown más utilizada, como #, ## para representar
< en HTML /h1>, < h2>. Utilice [texto](enlace) para crear un hipervínculo, utilice un "-" continuo para crear una línea horizontal (nota: esto no incluye la línea horizontal utilizada para rodear el encabezado superior, que representa el "atributo de encabezado" de la página ), etc. Se puede encontrar una sintaxis más detallada en la página mencionada anteriormente, por lo que no entraré en detalles aquí. En resumen, esta es una sintaxis más cercana a la escritura real y te recomiendo que la pruebes.
Por cierto, el {{ page.date|date_too_string }} al final se refiere a mostrar el atributo de fecha de la página y convertirlo en una cadena legible. Asimismo, sintaxis líquida.
Bien, se escribe el primer artículo y luego se envía el último repositorio a github. Espera un momento... Espera, olvidé agregar el enlace del portal del artículo.
Lo sentimos, vuelva a abrir nuestro archivo index.html y agregue contenido, se ve así:
--
título: Mi blog
---
{{ página.título }}
{% para publicación en site.posts %}
{{ post.date|date _to_string }} {{ post.title }}
{% endfor %}
Bueno... se trata de líquidos.
Para explicarlo brevemente, hay dos tipos principales de etiquetas Liquid, una es para generar contenido variable directamente, como se muestra a continuación:
{{ page.title }}
La otra es Salida en forma de comandos lógicos, de la siguiente manera:
{% for x in y %}
...... {% endfor %}
El contenido que se acaba de escribir en la página de inicio consiste en recorrer todos los archivos de publicaciones y mostrarlos uno por uno en la página. Una cosa a tener en cuenta aquí es que al crear un hipervínculo a un artículo, además de post.url, también debes prestar atención a agregar site.url delante de él.
Por las razones mencionadas anteriormente, que creamos Es un sitio de tipo página de proyecto
y su URL raíz es en última instancia: nombre de usuario.github.com/projectname, mientras que el hipervínculo generado por post.url
simplemente finaliza automáticamente. con nombre de usuario.github com/ como prefijo.
Ahora revisa todo lo que se ha cambiado para asegurarte de no cometer errores tontos como escribir "." en lugar de "." o escribir mal palabras, ¡luego confirma y presiona!
¡Maldita sea! Si todo va bien, verá aparecer su página de inicio y su lista de publicaciones.
6. Agregar plantilla suite_layouts
El artículo está en progreso, tal vez como se prometió. al principio 10 minutos es mucho más que eso... Perdón por bromear, pero al menos vamos bastante rápido ~ A continuación, si todavía estás interesado, agreguemos algo de uniformidad al estilo del sitio.
Regrese al directorio raíz del proyecto y cree una nueva carpeta _layouts, que, como su nombre indica, es "layout". Cree un nuevo archivo de diseño básico en _layouts y asígnele el nombre default.html:
| `-- 2009-04-26 -barcamp-boston-4-roundup.textile
|-- _site
`-- índice .html
Esta imagen proviene de: Yes We Jekyll, perdona mi pereza, realmente no soy bueno escribiendo...