> ## Documentation Index
> Fetch the complete documentation index at: https://docs.josbert.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Añadir Carrocería a Home

> Guía para agregar carrocerías a la página de inicio usando Elementor

# Cómo Añadir una Carrocería a la Página de Inicio

Esta guía te mostrará cómo agregar carrocerías a la página de inicio (Home) de FurgoVan utilizando el editor Elementor de WordPress.

***

## Paso 1: Acceder al Editor de la Página de Inicio

1. Inicia sesión en el panel de administración de WordPress en `https://furgovan.cl/wp-admin`
2. En el menú lateral izquierdo, ve a **Páginas** → **Todas las páginas**
3. Busca la página de **"Inicio"** o **"Home"**
4. Pasa el cursor sobre el título de la página
5. Haz clic en **"Editar con Elementor"**

<img src="https://mintcdn.com/postline/ZYY6mIOHQEarUTUo/images/elemento-editar.png?fit=max&auto=format&n=ZYY6mIOHQEarUTUo&q=85&s=925bcdbd29f454174bbf6f22920b837b" alt="Editar con Elementos" width="1899" height="424" data-path="images/elemento-editar.png" />

<Tip>
  El botón "Editar con Elementor" aparecerá solo si el plugin Elementor está instalado y activado.
</Tip>

***

## Paso 2: Ubicar la Sección de Carrocerías

<img src="https://mintcdn.com/postline/ZYY6mIOHQEarUTUo/images/editar-carroceria.png?fit=max&auto=format&n=ZYY6mIOHQEarUTUo&q=85&s=e6d1f889618cac831649fb9a1c93cad2" alt="Editar con Elementos" width="1498" height="834" data-path="images/editar-carroceria.png" />

Una vez en el editor de Elementor:

1. Desplázate por la página hasta encontrar la sección donde se muestran las carrocerías
2. Las carrocerías suelen estar en una sección de productos o destacados
3. Haz clic en el widget o sección que contiene las carrocerías

<Note>
  Elementor muestra un panel azul a la izquierda con todos los widgets disponibles y a la derecha la vista previa en vivo de la página.
</Note>

***

## Paso 3: Agregar o Editar el Widget de Carrocerías

### Si usas un widget de productos personalizado:

1. Haz clic en el widget de carrocerías existente
2. En el panel izquierdo verás las opciones del widget
3. Busca la opción para agregar nuevos productos o carrocerías
4. Selecciona las carrocerías que deseas mostrar

<img src="https://mintcdn.com/postline/ZYY6mIOHQEarUTUo/images/panel.png?fit=max&auto=format&n=ZYY6mIOHQEarUTUo&q=85&s=c703e096b3baa53aca8d272103637fcd" alt="Editar con Elementos" width="341" height="868" data-path="images/panel.png" />

5. Añadir elemento para crear una nueva carroceria existente

***

## Paso 4: Configurar el Diseño

En las opciones del widget puedes ajustar:

* **Número de columnas**: 2, 3 o 4 carrocerías por fila
* **Espaciado**: Distancia entre las tarjetas
* **Orden**: Por fecha, alfabético, aleatorio
* **Filtros**: Mostrar categorías, marcas específicas
* **Paginación**: Mostrar más carrocerías con paginación

***

## Paso 5: Personalizar el Estilo

En la pestaña **"Estilo"** del widget:

1. Ajusta colores de fondo y texto
2. Configura bordes y sombras
3. Modifica tipografías y tamaños de fuente
4. Ajusta el espaciado interno (padding)
5. Personaliza los botones de acción

<Tip>
  Mantén consistencia con el diseño general del sitio para una mejor experiencia de usuario.
</Tip>

***

## Paso 6: Vista Previa y Publicación

### Vista Previa

1. Haz clic en el ícono de **ojo** (👁️) en la parte inferior del panel de Elementor
2. Revisa cómo se ve en escritorio
3. Usa las opciones de responsive para ver en tablet y móvil
4. Verifica que todas las carrocerías se muestren correctamente

### Guardar y Publicar

1. Si todo se ve bien, haz clic en el botón verde **"Actualizar"** en la parte inferior izquierda
2. Espera la confirmación de que los cambios se guardaron
3. Sal del editor de Elementor

<Check>
  ¡Listo! Las carrocerías están ahora visibles en la página de inicio.
</Check>

***

## Opciones Avanzadas

### Usar Query Dinámico

Para mostrar automáticamente las carrocerías más recientes:

1. En el widget, busca **"Query"**
2. Activa **"Query Dinámica"**
3. Configura:
   * **Post Type**: Carrocería
   * **Order By**: Date (más recientes primero)
   * **Posts Per Page**: Número deseado

### Agregar Filtros Interactivos

Si quieres que los usuarios filtren por categoría o marca:

1. Agrega el widget **"Filtros"** o **"Taxonomy Filters"**
2. Vincula el filtro con el grid de carrocerías
3. Configura las taxonomías (Categorías, Marcas, Modelos)
4. Personaliza el estilo de los filtros

***

## Mejores Prácticas

* **Límite de carrocerías**: No muestres más de 12 carrocerías en home para no saturar
* **Destacar novedades**: Usa una sección especial para carrocerías nuevas
* **Llamados a la acción**: Incluye botones claros como "Ver más" o "Contactar"
* **Imágenes optimizadas**: Asegúrate que las imágenes carguen rápido
* **Mobile first**: Verifica siempre que se vea bien en móvil

***

## Solución de Problemas

### Las carrocerías no aparecen

**Solución**: Verifica que las carrocerías estén publicadas y no en borrador. Revisa también los filtros del query.

### El diseño se ve desajustado en móvil

**Solución**: Usa las opciones responsive de Elementor para ajustar columnas y espaciado para cada dispositivo.

### Los cambios no se ven en el sitio público

**Solución**: Limpia la caché del sitio y del navegador. Si usas plugins de caché como WP Rocket, actualízalos.

***

<Card title="Tutorial Relacionado" icon="book" href="/furgovan/como-subir-carrocerias">
  Aprende cómo crear y subir nuevas carrocerías al sistema
</Card>