# Cómo crear una tienda en línea

Vaya a la sección de sitios y haga clic en el **"Crear"** botón:

<figure><img src="/files/507afc3b9adda19e6ca3f25c0712b1301a255ad5" alt=""><figcaption></figcaption></figure>

Al hacer clic en el botón "Crear", se abre un menú desplegable con tipos de sitio web. Desde allí, seleccione "Tienda en línea"

<figure><img src="/files/75813de300a275e325df9f5507be88b782ee70a1" alt=""><figcaption></figcaption></figure>

Después de hacer clic en el botón "Tienda en línea", irá a la configuración del sitio, donde debe abrir la pestaña "Productos":

<figure><img src="/files/724c689a3df4731f72916cba89b4340252b6ec47" alt=""><figcaption></figcaption></figure>

### Categoría de producto

Después de ir a la sección "Productos", verá plantillas de tarjetas de producto:

<figure><img src="/files/e82ae0a66205e1e545fa72d1a1b1243f7369cf18" alt=""><figcaption></figcaption></figure>

Puede ir directamente a la configuración de los productos, pero si desea categorizarlos para que sus clientes puedan encontrar fácilmente lo que necesitan por categoría en el sitio, le recomendamos crear primero las categorías.

Para ello, haga clic en el icono de engranaje:

<figure><img src="/files/6a2d948f8a45f6bff6fc192fe71d44690f19d9b0" alt=""><figcaption></figcaption></figure>

Después de eso, se abre el menú de la derecha con la configuración de categorías:

<figure><img src="/files/9c771e13dddaae5645d41b9a21ac32b2653a8b92" alt=""><figcaption></figcaption></figure>

Haga clic en el botón "Crear categoría":

<figure><img src="/files/0b5869187a8140487dc87a87c96e792de0b46ef6" alt=""><figcaption></figcaption></figure>

En la ventana que se abre, introduzca el nombre de la categoría y seleccione el color (se mostrará en la tabla de productos).

También puede cambiar la visualización de columnas en la configuración de la categoría:

<figure><img src="/files/2c32ed513952d5eddb7636b60905da9d32b44d20" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Después de configurar la categoría, puede ir a la configuración de la tarjeta de producto.
{% endhint %}

### Cómo importar productos desde otra plataforma

Por ejemplo, subimos una tabla con productos que creamos manualmente en la [**Tablas** ](/doc/es/websites/sitios/blocks/sheets.md)sección de Mavibot.

Si necesita transferir una tienda en línea de un sitio u otro servicio a Mabibot, use las pestañas para descargar productos en la configuración de categorías:

<figure><img src="/files/6a2d948f8a45f6bff6fc192fe71d44690f19d9b0" alt=""><figcaption></figcaption></figure>

Hay una pestaña **Importar** en la configuración de categorías. Haga clic en el botón del mismo nombre para descargar la tabla con las tarjetas de producto:

<figure><img src="/files/121726d6ce61ef95cdc75cf9a8d3deeea18d1f6c" alt=""><figcaption></figcaption></figure>

Después de cargar el archivo que contiene sus tarjetas de producto (exportadas desde otra plataforma), deberá asignar las columnas.

Una vez que se carga la tabla de productos, verá una interfaz de asignación con dos columnas clave:

1. **La primera columna de la tabla:** muestra los nombres de sus columnas de la tabla cargada. Las columnas corresponden a los nombres de columna de la tabla.
2. **La segunda columna de la tabla:** muestra un ejemplo de valores tomados de la segunda fila, justo después de los encabezados de columna.
3. **Columna de producto:** ayuda a comparar (o omitir, si una columna no es necesaria) los valores de las columnas de la tabla cargada con las columnas del producto.

A continuación, haz clic en **"Cargar productos"**.

{% hint style="success" %}
¡Listo!&#x20;

Así puede cargar rápidamente productos en MaviBot y lanzar su tienda en línea.
{% endhint %}

Si es necesario, puede editar una tarjeta de producto haciendo clic en el icono de la lupa en la fila del producto.

### **Cómo exportar tarjetas de producto**

Para exportar las tarjetas de producto creadas de un sitio a otro, use la pestaña de exportación en la configuración de categorías.

<figure><img src="/files/6a2d948f8a45f6bff6fc192fe71d44690f19d9b0" alt=""><figcaption></figcaption></figure>

Hay una pestaña **"Exportar productos"** pestaña en la configuración de categorías.

**Exportar productos:** aquí puede configurar qué columnas de la tabla de tarjetas de producto desea exportar (descargar a su dispositivo) y transferir a otro proyecto.

<figure><img src="/files/2f314dec098fa6d673b2e1bab31481a2f6226b8a" alt=""><figcaption></figcaption></figure>

Para eliminar columnas innecesarias, basta con quitar la marca de verificación en la fila con el nombre de la columna.

A continuación, haga clic en "Exportar productos" — entonces las tarjetas de producto se descargarán a su dispositivo en formato de tabla:

<figure><img src="/files/a0e06b570138f55936cdd2f6e7b662bfc3b05c8f" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Puede exportar tarjetas de producto en formato cvs desde cualquier plataforma, para que pueda configurar y lanzar rápidamente una tienda en línea.
{% endhint %}

### Tarjeta de producto

Para crear una nueva tarjeta, haga clic en el botón redondo "+".

<figure><img src="/files/80ce92f17db1dac63d85e5ae508098f018a998b3" alt="" width="563"><figcaption></figcaption></figure>

Se abrirá la ventana de configuración del producto.

<figure><img src="/files/288c8be9afbc69f127f7bbd901991f2bc743e9fc" alt=""><figcaption></figcaption></figure>

Para editar una tarjeta de producto existente, haga clic en la lupa de la línea del producto.

<figure><img src="/files/eba805f67d0212ffda3ba89d35ad94238e00ba6a" alt=""><figcaption></figcaption></figure>

Aquí debe añadir el título, subir una imagen (una o varias) y añadir una descripción.

<figure><img src="/files/9176a95cf267d4145e75f0992a255fddbd840edd" alt="" width="344"><figcaption></figcaption></figure>

A continuación, especifique el precio del producto y otros detalles:

a) Categoría de producto\
b) Precio (por ejemplo, precio actual y precio anterior — útil para mostrar descuentos)\
c) Artículo (número)\
d) Cantidad (puede especificar cuántas unidades hay disponibles en su tienda)\
e) Breve descripción

<figure><img src="/files/b4cbc0cc228940e96401d1b3659d965afff28e78" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
¡Atención!&#x20;

Primero, cree al menos un producto antes de añadir categorías de productos
{% endhint %}

Luego, si es necesario, añada las características del producto y haga clic en "Guardar".

<figure><img src="/files/901805d85ddec69e41ad39feda042254f84c89d1" alt=""><figcaption></figcaption></figure>

Después de eso, la tarjeta de producto aparecerá en la tabla de la pestaña "Productos".

Para añadir más productos, haga clic en el botón redondo "+":

<figure><img src="/files/19f724a4ef420b456c47f49a02cdde9d5e0abb2a" alt=""><figcaption></figcaption></figure>

## Configuración del sitio

Después de crear las categorías necesarias y completar las tarjetas de producto, continúe con la configuración del sitio. Para ello, haga clic en el nombre de su sitio web en la barra de navegación superior.

<figure><img src="/files/4b391c3a47da1c7eb4880bc86ef0feac1be8e8aa" alt=""><figcaption></figcaption></figure>

Luego volverá a la configuración del sitio, donde debe hacer clic en la página para ir a la configuración de la sección.

<figure><img src="/files/7f5b8d752f55f1fc90789d852fd1d1060d8551eb" alt=""><figcaption></figcaption></figure>

Pasará al modo de edición de la página al hacer clic en el botón "+":

<figure><img src="/files/a4ac59b3f456345448a3b25c9fc61cb9084dfa37" alt=""><figcaption></figcaption></figure>

En el menú de la derecha, seleccione la sección "Catálogo de productos":

<figure><img src="/files/48e8a5644ac0fbfb5af7167286205fd9f8e5e032" alt=""><figcaption></figcaption></figure>

Las tarjetas de producto de la pestaña "Productos", incluidos todos los detalles, precios e imágenes, aparecerán automáticamente en la configuración de la sección:

<figure><img src="/files/e183d09de408a3d1aa6003ecab09143ff32cfe8c" alt=""><figcaption></figcaption></figure>

Está a solo unos pasos:

1. Ahora, seleccione qué categorías de productos desea mostrar en la sección:

<figure><img src="/files/7c3dec0eaf214cedaa92266e4dec2f729bea0bd9" alt="" width="375"><figcaption></figcaption></figure>

2. A continuación, seleccione el número de columnas:

<figure><img src="/files/02cc5bd9da89e5386102be13a09bd7b2862930a4" alt="" width="375"><figcaption></figcaption></figure>

3. Especifique cuántos productos mostrar al principio (antes de hacer clic en el botón "Mostrar más")

<figure><img src="/files/330cfc8176929291d008e880bd3fe8c95f780581" alt=""><figcaption></figcaption></figure>

4. A continuación, active los interruptores si desea que sus clientes ordenen los productos por categorías y filtros, y que se muestre una breve descripción del producto:

<figure><img src="/files/569828300c73aabed7c1ea2106c6f2494e0d7e30" alt="" width="375"><figcaption></figcaption></figure>

Ahora haga clic en "Guardar".

<figure><img src="/files/0d8d88195de55c421b07b111376f52b3c4f0234a" alt="" width="375"><figcaption></figcaption></figure>

Ahora pase el cursor sobre la sección y haga clic en "Configuración" para personalizarla.

Ahora, pase el cursor sobre la sección y haga clic en el **"Configuración"** icono para personalizarla.

Dentro de la configuración de la sección, puede:

* **Personalizar la tipografía:** Seleccione la fuente y ajuste su tamaño para la sección.
* **Estilizar el fondo:** Cargue una imagen o elija un color sólido o un degradado.
* **Configurar el diseño:** Ajuste el ancho, la visibilidad, el tamaño general y la alineación.

{% hint style="success" %}
Puede obtener más información sobre la configuración global de la sección [aquí](/doc/es/websites/sitios/blocks/settings.md).
{% endhint %}

Ahora vaya a la vista previa.

Aquí puede previsualizar cómo el sitio web muestra los productos, probar cómo funcionan los filtros y la búsqueda por categoría, y ver el carrito y el proceso de pago.

{% hint style="success" %}
Puede añadir cualquier número de secciones para su tienda en línea; por ejemplo, para mostrar categorías de productos específicas en cada sección o colocar secciones en diferentes páginas del sitio web.

Todo lo que necesita hacer es completar las tarjetas de producto, mientras que la configuración de la sección es mínima para un lanzamiento rápido.
{% endhint %}

### Cómo cambiar la dirección de un sitio

Para darle a su sitio una dirección limpia y concisa en lugar de una URL generada automáticamente (como la que se muestra abajo), puede personalizar el enlace de la página. Vaya a la configuración del sitio para hacer este cambio.

<figure><img src="/files/fc81fb68fbb09656d3d3fd528c0b211bd7ec6543" alt=""><figcaption></figcaption></figure>

A continuación, en la configuración principal, actualice los campos como se muestra en la imagen de abajo.

<figure><img src="/files/ec1b2cecf269e252694b16c13666716c4e389005" alt="" width="375"><figcaption></figcaption></figure>

1. **Nombre del sitio**. Este es el nombre que se muestra en la **Sitios** sección. Cambiarlo le ayuda a identificar y encontrar el sitio más fácilmente en su lista más adelante.

<figure><img src="/files/031ea2c0fd8b2179f860cb9df6e16c3d0112d456" alt="" width="375"><figcaption></figcaption></figure>

2. **Título de la pestaña del navegador.** El título que se muestra en la pestaña del navegador y en la barra de direcciones.
3. **URL.** La dirección del sitio.

{% hint style="success" %}
¡Su tienda en línea completamente funcional está lista!
{% endhint %}

## Cómo compartir un enlace en un chatbot

Puede compartir un enlace a su tienda en línea en un chatbot. Por ejemplo, puede enviar un enlace directo (compatible con la mayoría de los mensajeros) o usar el **Web App** botón en Telegram.

### Web app de Telegram&#x20;

Puede compartir su tienda en línea en un chatbot mediante un botón de Telegram Web App o como un enlace estándar (para otros mensajeros).

{% hint style="info" %}
**Método 1: botón de Telegram Web App**

Este método abre su tienda dentro de la interfaz nativa de Telegram.

**Paso 1. Copie la dirección de su tienda**

Copie la URL de la barra de direcciones de su navegador o de la tarjeta de la tienda en la **sección “Sitios”** sección.

**Paso 2. Cree o edite un bloque**

Cree un nuevo bloque en el constructor o incruste esto en un flujo de bot existente.

**Paso 3. Configure el botón de Telegram Web App**

1. En su bloque, vaya a **Botones** en la configuración y haga clic en **"Añadir botón."**
2. En la ventana modal, seleccione la **"Aplicación web de Telegram"** función.
3. Pegue la URL de su tienda en el campo del enlace.
4. Nombre el botón (por ejemplo, **"Ir al sitio"**) y haga clic en **"Añadir."**
5. Establezca el tipo de botón en **"En línea"** o **"Teclado"** según sea necesario, y luego guarde la configuración del bloque.

**Paso 4. Pruebe el bot**

Active el bloque (por ejemplo, enviando la palabra **"Tienda"**). El bot responderá con un mensaje que contiene el botón. Al hacer clic en él, se abrirá su tienda como una Telegram Web App.
{% endhint %}

{% hint style="info" %}

#### **Método 2: botón de enlace estándar (para otros mensajeros)**

Este método crea un botón estándar que abre la tienda en un navegador web.

**Paso 1. Copie la dirección de su tienda**

Copie la URL de la barra de direcciones de su navegador o de la tarjeta de la tienda en la **sección “Sitios”** sección.

**Paso 2. Cree o edite un bloque**

Cree un nuevo bloque en el constructor o incruste esto en un flujo de bot existente.

**Paso 3. Configure el botón de enlace**

1. En su bloque, vaya a **Botones** en la configuración y haga clic en **"Añadir botón."**
2. En la ventana modal, deje la función como la predeterminada (normalmente **"Abrir URL"**).
3. Pegue la URL de su tienda en el campo del enlace y nombre el botón.
4. Establezca el tipo de botón en **"En línea"** o **"Teclado"** y guarde la configuración del bloque.
   {% endhint %}

{% hint style="success" %}
**¡Listo!**\
Ha configurado correctamente su chatbot para compartir su tienda en línea mediante un enlace directo o una Telegram Web App nativa.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.mavibot.ai/doc/es/websites/online-store/settings.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.