Descarga hugoplate - Descarga del código fuente hugoplate

hugoplate

Otras categorias

1.0.0

Descargar

Hugo + Tailwind CSS inicial y estándar

Hugoplate es una plantilla inicial gratuita creada con Hugo y TailwindCSS, que proporciona todo lo que necesita para impulsar su proyecto Hugo y ahorrar un tiempo valioso.

Hecho con ♥ por Zeon Studio

Si encuentra útil este proyecto, por favor dele un para mostrar su apoyo.

Demostración | Velocidad de página (95+)

Qué está incluido

Hemos incluido casi todo lo que necesitas para comenzar tu proyecto Hugo. Veamos qué incluye esta plantilla:

Características clave

Autores múltiples
Sugerencia de publicaciones similares
Funcionalidad de búsqueda
Modo oscuro
Etiquetas y categorías
Configuración de Netlify preconfigurada
Formulario de contacto de soporte
Totalmente responsivo
Escribir y actualizar contenido en Markdown
Comentario de Disqus
Resaltado de sintaxis

Más de 15 páginas prediseñadas

Página principal
Acerca de
Contacto
Autores
Autor único
Blog
Blog único
404 personalizado
Elementos
política de privacidad
Etiquetas
Etiqueta única
Categorías
Categoría individual
Buscar

Pila de tecnología

hugo
CSS de viento de cola
PublicarCSS
PurgarCSS
Prefijador automático
Módulos Hugo de Gethugothemes
Reducción
mas bonita
Jshint
Netlificar
Vercel
Acciones de Github
Gitlab CI
AWS amplificar

Empezando

Primero necesitas clonar o descargar el repositorio de plantillas y luego comencemos con el siguiente proceso:

Requisitos previos

Para comenzar a utilizar esta plantilla, debe tener algunos requisitos previos instalados en su máquina.

Hugo extendido v0.124+
Nodo v20+
Ir v1.22+

Configuración del proyecto

Creamos este script personalizado para facilitar la configuración de su proyecto. Creará una nueva carpeta de temas de Hugo y clonará el tema de Hugoplate en ella. Luego mueva la carpeta exampleSite al directorio raíz. Para que pueda iniciar su servidor Hugo sin tener que ingresar a la carpeta exampleSite. Utilice el siguiente comando para configurar su proyecto.

 npm ejecuta la configuración del proyecto

Instalar dependencias

Instale todas las dependencias usando el siguiente comando.

 instalación npm

Comando de desarrollo

Inicie el servidor de desarrollo usando el siguiente comando.

 npm ejecutar desarrollador

¿Aún estás confundido? Ver un vídeo rápido

hugoplate-configuración-rápida.mp4

Personalización

Esta plantilla ha sido diseñada teniendo en cuenta muchas opciones de personalización. Puedes personalizar casi cualquier cosa que quieras, incluyendo:

Configuración del sitio

Puede cambiar el título del sitio, la URL base, el idioma, el tema, los complementos y más desde el archivo hugo.toml .

Parámetros del sitio

Puede personalizar todos los parámetros desde el archivo config/_default/params.toml . Esto incluye el logotipo, el favicon, la búsqueda, los metadatos de SEO y más.

Colores y fuentes

Puede cambiar los colores y fuentes desde el archivo data/theme.json . Esto incluye el color primario, el color secundario, la familia de fuentes y el tamaño de fuente.

Enlaces sociales

Puede cambiar los enlaces sociales desde el archivo data/social.json . Agregue sus enlaces sociales aquí y se mostrarán automáticamente en el sitio.

Uso avanzado

Hemos agregado algunos scripts personalizados para hacerle la vida más fácil. Puede utilizar estos scripts para ayudarle con su desarrollo.

Actualizar tema

Si desea actualizar el tema, puede utilizar el siguiente comando. Actualizará el tema a la última versión.

 npm ejecuta el tema de actualización

Nota: Este comando funcionará después de ejecutar el script project-setup .

Actualizar módulos

Hemos agregado muchos módulos a esta plantilla. Puede actualizar todos los módulos usando el siguiente comando.

 npm ejecuta módulos de actualización

Quitar el modo oscuro

Si desea eliminar el modo oscuro de su proyecto, puede usar el siguiente comando para eliminar el modo oscuro de su proyecto.

 npm ejecuta eliminar modo oscuro

Nota: Este comando funcionará antes de ejecutar el script project-setup . Si ya ejecutó el comando project-setup , primero debe ejecutar npm run theme-setup y luego podrá ejecutar este comando. luego, puede ejecutar npm run project-setup nuevamente.

Construir e implementar

Una vez que termine su desarrollo, puede construir o implementar su proyecto en casi todas partes. Veamos el proceso:

Comando de construcción

Para construir su proyecto localmente, puede usar el siguiente comando. Purgará todo el CSS no utilizado y minimizará todos los archivos.

 npm ejecutar compilación

Implementar sitio

Hemos proporcionado 5 configuraciones de plataforma de implementación diferentes con esta plantilla, para que pueda implementarla fácilmente.

Netlificar
Vercel
Acciones de Github
Gitlab CI
AWS amplificar

Y si desea alojar otras plataformas de alojamiento. luego podrá construir su proyecto y obtendrá una carpeta public . que puedes copiar y pegar en tu plataforma de hosting.

Nota: Debe cambiar la baseURL en el archivo hugo.toml . De lo contrario, su sitio no funcionará correctamente.

Guía para cumplir

Problemas de informes

Usamos GitHub Issues como rastreador de errores oficial para esta plantilla. Busque problemas existentes. Es posible que alguien ya haya informado del mismo problema. Si su problema o idea aún no se ha abordado, no dude en abrir una nueva edición.