Hoy estamos regalando otro diseño de categoría gratuito para Extra . Este diseño de categoría está destinado a ser utilizado como página de inicio para un blog de comida. El concepto detrás de este diseño no es mostrar el blog completo (que en nuestra demostración hemos puesto en una página separada), sino resaltar tipos/categorías de contenido populares para los visitantes del sitio.
Al igual que con nuestro último sorteo de diseño de categoría, el proceso de usarlo es más complicado que simplemente importar el diseño y cargarlo en una página. Debido a que los diseños de categoría necesitan contenido para completarlos antes de que pueda obtener el mismo aspecto que en nuestro ejemplo, hemos incluido contenido e imágenes de demostración en nuestro paquete de diseño (así como algunos otros elementos) para ayudarlo a lograr el efecto completo que ve en las imágenes de abajo.
¡Entremos en ello!
El archivo de descarga food-blog-layout-pack.zip incluye los siguientes archivos:
- 0-header-settings.json : este archivo contiene la configuración del encabezado de Elegant Food. Se importa a través del Personalizador de temas .
- 1-all-food-blog-layout-pack.json : este archivo contiene todas las secciones y el diseño completo de la categoría del blog de alimentos en una sola importación.
- 2-food-blog-layout-all-sections.json : este archivo contiene todas las secciones en una sola importación.
- 3-food-blog-layout.json : este archivo contiene solo el diseño completo en una importación
- carpeta css personalizada : esta carpeta contiene un archivo de texto sin formato del css personalizado que deberá agregar a la configuración de la página de diseño de su categoría (así como una imagen de referencia).
- carpeta de contenido de demostración : esta carpeta contiene todo el contenido de demostración que necesitará para duplicar el contenido que se encuentra en nuestra demostración.
- Carpeta de secciones individuales del blog de alimentos : esta carpeta contiene todas las secciones de diseño de categorías individuales como archivos json únicos en caso de que desee importar solo una o algunas.
Descarga del paquete de diseño de comida elegante
Para obtener acceso a la descarga, deberá suscribirse a nuestro boletín utilizando el formulario a continuación. Esto le dará acceso al paquete de diseño de categorías del blog de alimentos y le brindará una fuente continua de nuevos (y gratuitos) recursos, consejos, trucos y noticias de Divi .
Si ya está en la lista, simplemente ingrese su dirección de correo electrónico a continuación y haga clic en descargar. No se suscribirá dos veces.
Descárgalo gratis
Únase al boletín informativo de Divi y le enviaremos por correo electrónico una copia del último paquete de diseño de página de destino de Divi, además de muchos otros recursos, consejos y trucos increíbles y gratuitos de Divi. Síguenos y serás un maestro Divi en poco tiempo. Si ya está suscrito, simplemente escriba su dirección de correo electrónico a continuación y haga clic en descargar para acceder al paquete de diseño.
You have successfully subscribed. Please check your email address to confirm your subscription and get access to free weekly Divi layout packs!
Paso 1: Descomprima su nueva descarga
El primer paso para poner en marcha su nuevo diseño de categoría en Extra es ubicar el archivo comprimido que acaba de descargar en su carpeta de descargas y descomprimirlo. Una vez que se haya descomprimido, verá todos los archivos y carpetas que analizamos anteriormente. Ahora podemos comenzar a agregarlos a su instalación de WordPress ejecutando Extra. Para obtener los mejores resultados, recomiendo seguir el orden que he descrito a continuación.
Paso 2: agregue el logotipo e importe la configuración del personalizador
A continuación, agreguemos el logotipo que hemos incluido en la carpeta de contenido de demostración de la descarga llamada elegant-food-logo.png . Para agregarlo, navegue en su administrador de WordPress a Extra> Opciones de tema y haga clic en el botón de carga junto al logotipo.
Una vez que haya agregado su logotipo, guarde los cambios y navegue hasta Extra > Personalizador de temas . Haga clic en el icono de importación en la parte superior del menú de la barra lateral del personalizador.
Cuando aparezca el modal de portabilidad, vaya a la pestaña de importación. Marque la casilla de verificación que dice «Descargar copia de seguridad antes de importar» para que, en caso de que tenga la capacidad de volver a su configuración actual. Luego, elija el archivo 0-header-settings.json de la carpeta de descarga del blog de alimentos.
Haga clic en el botón azul «Importar configuración adicional del personalizador». Cuando se complete la importación, su encabezado debería verse como el encabezado en la captura de pantalla de Elegant Food a continuación.
Paso 3: Importe el contenido de demostración
Ok, ahora que nuestra configuración del personalizador de temas está fuera del camino, podemos pasar al trabajo pesado. Importando nuestro contenido.
Navegue en su administrador de WordPress a Importar»>Herramientas > Importar . Si nunca ha usado esta función antes, querrá hacer clic en «Instalar ahora» en la opción de WordPress. Una vez que el importador de WordPress esté instalado, haga clic en el enlace «Ejecutar importador».
A continuación, haga clic en el botón «Elegir archivo» y seleccione el archivo de su carpeta de descargas llamado elegant-food-demo-content.xml . Haga clic en el botón azul «Cargar archivo e importar».
Tendrá la opción de configurar un nuevo autor, así como elegir descargar e importar los archivos adjuntos. Como mínimo, recomendaría marcar la opción de descargar e importar archivos adjuntos para que cualquier publicación con imágenes en su interior conserve esas imágenes.
Cuando se complete la importación, vaya a Publicaciones > Todas las publicaciones . Debería tener más de 40 piezas nuevas de contenido de demostración.
Paso 4: configura tus imágenes destacadas
Ahora para la parte que consume tiempo. Deberá abrir cada nueva publicación y agregar manualmente la imagen destacada correspondiente. He intentado que esto sea lo más fácil posible al incluir una carpeta comprimida de todas las imágenes, organizadas por categoría.
Recomendaría hacer lo siguiente:
En la carpeta de contenido de demostración, verá una subcarpeta llamada imágenes destacadas . Las imágenes del interior están organizadas por categorías correspondientes a las categorías de contenido importado de su nuevo contenido de demostración.
En Publicaciones > Todas, use la función de filtro para seleccionar cada categoría individualmente.
Haga clic en el enlace «editar» debajo de cada título de la publicación y agregue la imagen destacada correspondiente. El cuadro meta de la imagen destacada se encuentra en la columna de la derecha de la pantalla del editor de publicaciones.
Esto tomará un poco de tiempo para cada una de estas publicaciones. Sin embargo, seguirá siendo mucho más rápido que crear todo el contenido de demostración desde cero.
Paso 5: importe el diseño de la categoría del blog de alimentos a su biblioteca Divi
Cuando haya terminado de agregar las imágenes destacadas, será el momento de importar el nuevo diseño de categoría de su blog de alimentos. En su administrador de WordPress, vaya a Extra > Biblioteca Divi . Haga clic en el botón «Importar y exportar» en la parte superior de la página.
Seleccione la pestaña de importación y haga clic en el botón «elegir archivo». Seleccione el archivo 1-all-food-blog-layout-pack.json de su carpeta de descargas. Haga clic en el botón azul «Importar diseños de Divi Builder».
Cuando finalice la importación, debería ver el diseño de la categoría del blog de alimentos (y todas sus secciones individuales) en su biblioteca.
Paso 6: configure su página de inicio con el diseño de categoría del blog de alimentos
Finalmente, navegue en su administrador de WordPress a Extra > Creador de categorías . Haga clic en el botón «editar» debajo del diseño del blog de alimentos.
En la columna de la derecha de la página, verá un meta cuadro llamado «Uso de diseño». Asegúrese de que la casilla de verificación junto a «Usar este diseño como diseño de inicio» esté marcada y haga clic en «Actualizar».
Si ahora navega a su página de inicio, debería verse como la captura de pantalla de ejemplo a continuación.
El elegante diseño de categoría de comida para blogs de comida
Este diseño de categoría de blog de comida para Extra es perfecto para presentar publicaciones y categorías populares para blogs de comida con muchas categorías diferentes. Esto no pretende mostrar todas las categorías del blog, solo las que desea resaltar y atraer más tráfico.
Diseño completo de la categoría del blog de alimentos
Terminando
Espero que disfrutes de este diseño de categoría gratuito para Extra. Mi objetivo al diseñarlo fue brindarle a nuestra comunidad otro recurso útil que puedan usar al crear sitios web para ellos mismos o para sus clientes. También puede usarlo para mostrar a los clientes lo que es posible con Extra configurando su propio sitio de demostración usando estos archivos.
¡Avíseme en los comentarios a continuación si tiene alguna pregunta o solicitud de más obsequios!
¡Asegúrate de suscribirte a nuestro boletín de correo electrónico y canal de YouTube para que nunca te pierdas un gran anuncio, un consejo útil o un obsequio de Divi!