Tema DeliverNext para Grav CMS

Fork del tema original Deliver

El tema DeliverNext es una adaptación del tema Grav Deliver creado por el Equipo de Grav. Ya seas un creativo que busca mostrar su portafolio o una empresa que desea promocionar su negocio, este tema es para ti.

Características

  • Totalmente responsive
  • Menús de navegación automáticos y personalizados incluidos
  • Sección de presentación con un módulo de slideshow animado impresionante
  • Cuadrícula de servicios con iconos personalizados de FontAwesome
  • Cuadrícula de portafolio con ventanas modales de vista previa para detalles de los elementos del portafolio. Se incluyen versiones para la página de inicio (mínima) y completa
  • Sección de pie de página con menús personalizados, información de contacto y más
  • Diseño "Acerca de" con módulo de iconos sociales y estilos personalizados
  • Diseño de servicios con iconos de FontAwesome 4.7 y tablas de precios
  • Diseño de archivo con lista de entradas de blog archivadas
  • Blog completo con soporte para autores personalizados y fechas de publicación a través de los plugins translate-date y twig-extensions
  • Diseño "Contáctanos" con soporte para el plugin Simple Form
  • Opciones de optimización SEO (meta tags, datos de Open Graph)
  • Soporte para múltiples idiomas (traducciones en inglés y español incluidas)
  • Alertas personalizables, tipos/colores de botones y estilos de títulos de página
  • Botón de volver arriba y configuración flexible de imágenes de página
  • Carga automática de archivos custom.css y custom.js
  • Archivos SCSS incluidos para opciones de personalización más avanzadas

Instalación

La instalación del tema DeliverNext se puede realizar de dos maneras. Nuestro método de instalación GPM (Grav Package Manager) te permite instalar el tema rápida y fácilmente con un simple comando en la terminal, mientras que el método manual te permite hacerlo a través de un archivo zip.

El tema por sí solo es útil, pero puede que te resulte más fácil comenzar instalando un esqueleto. El Esqueleto de Sitio DeliverNext es un repositorio autocontenido para un sitio completo que incluye: contenido de ejemplo, configuración, tema y plugins.

Instalación mediante GPM (Preferido)

La forma más sencilla de instalar este tema es a través del Grav Package Manager (GPM) utilizando la terminal de tu sistema (también llamada línea de comandos). Desde la raíz de tu instalación de Grav, escribe:

bin/gpm install delivernext

Esto instalará el tema DeliverNext en tu directorio /user/themes dentro de Grav. Sus archivos se encontrarán en /tu/sitio/grav/user/themes/delivernext.

Instalación Manual

Para instalar este tema, simplemente descarga la versión zip de este repositorio y descomprímela en /tu/sitio/grav/user/themes. Luego, renombra la carpeta a delivernext. Puedes encontrar estos archivos en GitHub o a través de GetGrav.org.

Ahora deberías tener todos los archivos del tema en:

/tu/sitio/grav/user/themes/delivernext

NOTA: Este tema requiere los plugins Grav, Error, Problems, Translate Date, y Twig Extensions.

Actualización

A medida que continúa el desarrollo del tema DeliverNext, pueden estar disponibles nuevas versiones que añadan características y funcionalidades adicionales, mejoren la compatibilidad con versiones más recientes de Grav y, en general, ofrezcan una mejor experiencia de usuario. Actualizar DeliverNext es fácil y se puede hacer a través del sistema GPM de Grav, así como manualmente.

Actualización mediante GPM (Preferido)

La forma más sencilla de actualizar este tema es a través del Grav Package Manager (GPM). Puedes hacer esto navegando al directorio raíz de tu instalación de Grav usando la terminal de tu sistema (también llamada línea de comandos) y escribiendo lo siguiente:

bin/gpm update delivernext

Este comando verificará si tu tema DeliverNext necesita una actualización. Si se encuentra una versión más reciente, se te preguntará si deseas actualizar. Para continuar, escribe y y presiona enter. El tema se actualizará automáticamente y se limpiará la caché de Grav.

Actualización Manual

Actualizar manualmente DeliverNext es bastante sencillo. Esto es lo que necesitarás hacer:

  • Elimina el directorio tu/sitio/user/themes/delivernext.
  • Descarga la nueva versión del tema DeliverNext desde GitHub o GetGrav.org.
  • Descomprime el archivo zip en tu/sitio/user/themes y renombra la carpeta resultante a delivernext.
  • Limpia la caché de Grav. La forma más sencilla de hacer esto es yendo al directorio raíz de Grav en la terminal y escribiendo bin/grav clear-cache.

Nota: Cualquier cambio que hayas hecho en los archivos listados bajo este directorio también se eliminará y será reemplazado por el nuevo conjunto. Cualquier archivo ubicado en otro lugar (por ejemplo, un archivo de configuración YAML colocado en user/config/themes) permanecerá intacto.

Configuración

Si deseas establecer DeliverNext como el tema predeterminado, puedes hacerlo siguiendo estos pasos:

  • Navega a /tu/sitio/grav/user/config.
  • Abre el archivo system.yaml.
  • Cambia la configuración theme: a theme: delivernext.
  • Guarda los cambios.
  • Limpia la caché de Grav. La forma más sencilla de hacer esto es yendo al directorio raíz de Grav en la terminal y escribiendo bin/grav clear-cache.

Una vez hecho esto, deberías poder ver el nuevo tema en el frontend. Ten en cuenta que cualquier personalización realizada en el tema anterior no se reflejará, ya que toda la información del tema y las plantillas ahora se obtienen de la carpeta delivernext.

Opciones Predeterminadas

DeliverNext viene con una variedad de opciones de configuración que se pueden establecer en todo el sitio. Estas opciones están organizadas en secciones para facilitar su gestión:

enabled:                      # Activar o desactivar el tema.
dropdown.enabled:             # Activar o desactivar el menú desplegable.
sticky_menu.enabled:          # Activar o desactivar el menú fijo.
production-mode:              # Activar el modo de producción para usar CSS minificado.
custom_css:                   # Activar/desactivar CSS personalizado (carga automáticamente `custom.css` si está presente).
custom_js:                    # Activar/desactivar JavaScript personalizado (carga automáticamente `custom.js` si está presente).
social_enabled:               # Activar o desactivar los iconos de redes sociales.
social:                       # Añadir iconos de redes sociales con nombre, URL, objetivo y opciones de icono.
page_title_type:              # Elegir el estilo del título de la página (por ejemplo, "hero", "minimal").
featured_image:               # Configurar la visualización de la imagen principal de la página.
footer.copyright_text:        # Texto de copyright personalizado en el pie de página.
footer.contact_section_label: # Etiqueta para la sección "Contacto".
footer.quick_links_label:     # Etiqueta para la sección "Enlaces rápidos".
footer.about.description:     # Descripción para la sección "Acerca de".
footer.gps:                   # Coordenadas GPS para la sección de contacto.
footer.address:               # Líneas de dirección para la sección de contacto.
footer.quick_links_items:     # Enlaces rápidos con texto, URL y objetivo.
footer.other_menu:            # Elementos adicionales del menú.
custommenus.enabled:          # Activar/desactivar menús personalizados.
custommenu:                   # Elementos del menú personalizado con texto, icono, URL y objetivo.
theme_logo_enabled:           # Activar/desactivar el logotipo personalizado.
type_logo_header:             # Tipo de encabezado del logotipo: "imagen", "texto" o "ambos".
theme_logo:                   # Logotipo personalizado para escritorio (admite .png, .jpg, .svg).
theme_logo_mobile:            # Logotipo personalizado para móviles.
favicon:                      # Favicon personalizado (admite .png, .ico).
back_to_top_button.enabled:   # Activar el botón de volver arriba.
seo_options:                  # Configuración SEO (meta descripciones, datos de Open Graph).
alert_boxes:                  # Configurar estilos de cajas de alerta coloreadas.
button_types:                 # Definir tipos de botones personalizados y colores.

Para realizar modificaciones, puedes copiar el archivo user/themes/delivernext/delivernext.yaml a la carpeta user/config/themes/ y modificarlo, o puedes usar el plugin de administración.

NOTA: No modifiques el archivo user/themes/delivernext/delivernext.yaml directamente o tus cambios se perderán con cualquier actualización.

Recursos Personalizados y Branding

Logotipos
Coloca los archivos de logotipo en user/themes/delivernext/images/logo (admite .png, .jpg, .svg). Configura a través de YAML o el panel de administración:

custom_logo:
    - name: 'mi-logo.png'
custom_logo_mobile:
    - name: 'logo-movil.png'    

Favicon
Sube un archivo .png o .ico a través de las opciones del tema o colócalo en user/themes/delivernext/images y refiérelo en tu YAML.

CSS/JS Personalizados
Crea archivos custom.css o custom.js en user/themes/delivernext/css o .../js respectivamente. Se cargarán automáticamente cuando estén activados en las opciones del tema.

Página de demostración

https://delivernext.pmdesign.dev/