Como lograr su correcta instalación y uso
INSTALACION DE HUGO
Primero deben crearse una cuenta en GitHub. Si ya tiene una cuenta, asegurarse de que aún tiene acceso. Luego descargar los siguientes archivos en su computador (Hugo + Visual Studio)
SÍMBOLO DEL SISTEMA (para crear carpeta y pagina web)
• C:>Hugo help (para pedir ayuda a Hugo)
• C:>cls (para limpiar la pantalla de la consola)
• C:>dir (para pedir listado de elementos del directorio)
• C:\Users>cd .. (Primero que nada como instale HUGO en mi disco C es el porque me aparece inicialmente C:, si lo hubieras instalado en el U te aparecería U:, en caso de no ser así cámbialo. C:\Users> significa que estas en el disco c en carpeta usuario, cd .. significa retroceder a carpeta anterior)
• C:>cd ..
• C:>cd Hugo (aquí le estas diciendo con CD HUGO que en el disco C: vaya a la carpeta Hugo. Si deseas cambiarlo C:>cd .. -> C:>D: -> D:>)
• C:\Hugo>hugo new site website (Esto significa que le estas pidiendo crear una carpeta “WEBSITE” para poder crear más adelante tu página web “WEBSITE”)
Congratulations! Your new Hugo site is created in C:\Hugo\website.
Just a few more steps and you're ready to go:
1. Download a theme into the same-named folder.
Choose a theme from https://themes.gohugo.io/ or
create your own with the "hugo new theme <THEMENAME>" command.
2. Perhaps you want to add some content. You can add single files
with "hugo new <SECTIONNAME>\<FILENAME>.<FORMAT>".
3. Start the built-in live server via "hugo server".
Visit https://gohugo.io/ for quickstart guide and full documentation.
(Todo lo que este con este tono de gris representa los posibles mensajes que te aparecerán, en este caso este te confirma que realizaste todo de forma correcta)
• C:\Hugo>cd website (aquí le esta diciendo que vayas a la carpeta que recién hicimos) • C:\Hugo\website>hugo server (http://localhost:1313/ es tu página web recién creada, pero desde los archivos de tu computador, es decir no esta en internet aun por lo que no puedes compartir este link)
Building sites …
| EN
------------------------+-----
Pages | 24
Paginator pages | 0
Non-page files | 0
Static files | 41
Processed images | 0
Aliases | 0
Sitemaps | 1
Cleaned | 0
Built in 109 ms
Watching for changes in C:\Hugo\website\{archetypes,content,data,layouts,static,themes}
Watching for config changes in C:\Hugo\website\config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
• C:\Hugo\website>hugo (Aqui se hace los archivos listos para poner en la carpeta de documentos de github para llegar y subir)
ORDEN DE CARPETAS (descarga y orden de archivos del tema)
• Escoger y descargar un tema https://themes.gohugo.io/
• Descomprimirlo y borrar del nombre -master
• Copiar y pegar la carpeta del TEMA en la carpeta THEMES que esta al interior de la carpeta WEBSITE (esta esta al interior de la carpeta HUGO)
• Luego de la carpeta TEMA (la que está al interior de THEMES) entrar a su carpeta EXAMPLESITE y corta y perga todos sus archivos al interior de la carpeta del WEBSITE (si lo has hecho bien te preguntara si deseas remplazar los archivos preexistentes, pon que si deseas reemplazarlos)
TIPS Y VIDEOS
• Subir un archivo pdf u otro para que el publico lo descargue
Poner el archivo en una carpeta “files” hecha manualmente al interior de la carpeta public
[nombre](https://“nombre de tu pagina”.github.io/files/ “NOMBRE ARCHIVO”) - Descargar
Puede ver un ejemplo en el post 8 - Fusion360 ferula
• Galeria de fotos que se deslisan
https://github.com/tbiering/hugo-slider-shortcode
• Instagran { {< instagram número único >} }
• Twitter { {< twitter_simple número único >} }
Hugo 0.24 Released: Big archetype update + @Netlify _redirects etc. file supporthttps://t.co/X94FmYDEZJ #gohugo #golang @spf13 @bepsays
— GoHugo.io (@GoHugoIO) June 21, 2017
• Vimeo { {< vimeo_simple número único >} }
• Youtube { {< youtube número único >} }
• Una tabla
| Variable | Default | Description |
|---|---|---|
dir |
none |
Path to image-folder (mandatory) |
width |
500px |
Width of the slider area |
height |
300px |
Height of the slider area |
arrow-left |
fa-chevron-left |
Defines the left icon (See info below) |
arrow-right |
fa-chevron-right |
Defines the right icon |
no-fa |
false |
Toggles dependency inclusion for FontAwesome |
no-jquery |
false |
Toggles dependency inclusion for JQuery |
auto-slide |
0 |
Set automatic sliding duration in ms |
| Variable | Default | Description |
| -------------- | ------- | ----------- |
| `dir` | *`none`* | Path to image-folder *(mandatory)* |
| `width` | `500px` | Width of the slider area |
| `height` | `300px` | Height of the slider area |
| `arrow-left` | `fa-chevron-left` | Defines the left icon (See info below) |
| `arrow-right` | `fa-chevron-right` | Defines the right icon |
| `no-fa` | `false` | Toggles dependency inclusion for FontAwesome |
| `no-jquery` | `false` | Toggles dependency inclusion for JQuery |
| `auto-slide` | `0` | Set automatic sliding duration in ms |
MÁS TIPS
https://learn.netlify.com/en/cont/markdown/
https://gohugo.io/content-management/shortcodes/#example-instagram-display