{"section":"tracks","requestedLocale":"es","requestedSlug":"cms-portal-legado","locale":"es","slug":"cms-portal-legado","path":"docs/es/tracks/módulos-vtex-primeros-pasos/cms/cms-portal-legado.md","branch":"main","content":"## Layout\n\nLa sección [Layout](/es/docs/tracks/cms-vtex-io#layout) te permite crear tu storefront con HTML y CSS. Se organiza en carpetas y archivos con fines específicos:\n\n![CMS - Layout ES](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tracks/módulos-vtex-primeros-pasos/cms/cms-portal-legado_1.png)\n\n- **HTML Templates:** construye el código HTML y los archivos JavaScript y CSS de referencia que se utilizarán en las páginas del sitio web.\n\n- **Shelves Templates:** gestiona las plantillas de estantes, es decir, los componentes responsables de renderizar un grupo de productos en el storefront.\n\n- **Custom Elements:** crea las condiciones necesarias para implementar componentes reutilizables, como los pies de página, en otras partes de la tienda.\n\n- **URL Builder:** redirige las URLs existentes a otras de interés. Esto evitará errores de indexación y ayudará a mantener el posicionamiento SEO.\n\n- **Files Manager:** sube archivos de imagen para el sitio web de tu tienda. Almacena los archivos JavaScript, CSS y de imagen del sitio web. Si deseas utilizar alguno de estos archivos en tu tienda, debes hacer referencia a ellos dentro de la sección **HTML Templates**.\n\n- **Product Cluster (Collections):** crea grupos de productos. Puede utilizarlos para crear páginas de destino de campañas o colecciones de productos que carguen grupos de productos específicos.\n\n- **Sites and Channels:** configura [el binding de tu tienda](/es/docs/tutorials/que-es-binding) y otros ajustes del License Manager. Para obtener más información, consulta el artículo [Estructura de la carpeta CMS](/es/docs/tutorials/estructura-de-carpetas-del-cms).\n\n## Configuración\n\nLa sección [Configuración](/es/subcategory/configuracion-de-cms--6kovkwzMRyeOOc2iEC4suM) te permite configurar los ajustes relacionados con el sitio web de tu tienda, como sus metadatos, las etiquetas SEO, los tipos de archivo, etc. \n\n![CMS - Settings ES](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tracks/módulos-vtex-primeros-pasos/cms/cms-portal-legado_2.png)\n\nLa sección **Configuración** está estructurada de la siguiente manera:\n\n- **General:** configuraciones generales relacionadas con los metadatos de la tienda y las opciones de compra, como el título de la página de inicio y la cantidad máxima de SKU en el carrito.\n- **SEO:** opciones para personalizar las palabras clave y las meta etiquetas de SEO.\n- **Textos de la tienda:** base de datos de variables de texto reutilizables que se muestran en el storefront.\n- **Tipos de archivos:** configuraciones relacionadas con los archivos de recursos, como las dimensiones y el tamaño de las imágenes. \n- **Regiones geográficas:** base de datos de las regiones geográficas donde están disponibles los productos de la tienda.\n\n## Estructura de carpetas del CMS Portal (Legado) \n\nEn VTEX, toda nueva cuenta ya tiene carpetas preinstaladas en su CMS. Sin embargo, algunas de estas son __obligatorias__. \n\nEs decir, si su tienda no tiene estas carpetas - __con los nombres exactamente iguales__ a los que indicamos en este artículo - tendrá problemas de navegación e indexación.\n\nLas otras carpetas son apenas __sugerencias__ por ser útiles para la mayoría de las tiendas. Pero su ausencia no afecta en absoluto a una cuenta.\n\nEn este artículo, hablaremos de todas estas carpetas.\n\n### Carpetas obligatorias\n\nToda tienda debe tener, sin excepción, las siguientes carpetas en el CMS para asegurar el correcto funcionamiento de la navegación e indexación:\n- Búsqueda \n- Categoría\n- Departamento\n- Login \n- Producto\n\nVea abajo estas carpetas básicas en el CMS:\n\n![2 1](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tracks/módulos-vtex-primeros-pasos/cms/cms-portal-legado_3.png)\n\nEstas carpetas vienen de forma predeterminada en el ambiente de todas las tiendas VTEX.\n\n> ⚠️ Atención: los nombres de las carpetas obligatorias **no** deben ser alterados.\n\nComo las carpetas se refieren a páginas dinámicas, sus nombres no aparecen en la navegación del cliente. \n\nEsto significa que el hecho de que la edición de los nombres sea vetada no afecta al texto final de sus URLs ni, por lo tanto, a la internacionalización de su sitio web.\n\nDe esta manera, los nombres de los layouts pueden editarse sin ningún problema.\n\n### Carpetas importantes\n\nAlgunas carpetas del CMS no son obligatorias, pero son útiles. Por lo tanto, recomendamos que no las excluya.\n\nEstas son:\n- `/account`: cuenta del cliente\n- `/account/orders`: pedidos del cliente\n\nPara estas dos carpetas, lo que importa es el control o placeholder que lee su contenido. Sus nombres pueden ser editados libremente.\n\n> ℹ️ Tanto `/account` como `/account/orders`  son carpetas privadas. Por lo tanto, ambas requieren autenticación. Vea en el artículo [Exigir autenticación en páginas de la tienda](/es/tutorial/exigir-autenticacion-en-paginas-de-la-tienda) cómo asegurarse de que están configuradas para solicitar la autenticación del usuario.\n\n### Carpetas útiles\n\nHay carpetas que, aunque no son tan importantes como las anteriores, suelen ser útiles para la mayoría de las tiendas. \n\nEstas son:\n- `/sistema/buscavazia`: carpeta donde el usuario es dirigido si la búsqueda no encuentra resultados.\n- `/sistema/{codigoHTTP}`: carpeta que renderiza páginas de errores de acuerdo con los códigos de status HTTP, tales como 404 (página no encontrada), 401 (no autorizado) y 500 (error de servidor).\n- `/marcas`: carpeta que contiene layouts de páginas de marca, que pueden ser personalizadas con un layout exclusivo. Si no hay layout específico para marcas, estas páginas se renderizarán de la misma manera que la carpeta de búsqueda. Para entender cómo funcionan las páginas de marca, consulte el artículo [Cómo funciona la búsqueda de VTEX](/es/docs/tutorials/como-funciona-la-busqueda-de-vtex).\n\n## Controles nativos de VTEX\n\nControles son fragmentos de código que puede utilizar en los templates de su sitio web para realizar acciones específicas.\n\nEn VTEX, encontrará una serie de controles nativos para renderizar diversas funcionalidades. \n\nPor ejemplo, utilizando el control `<vtex.cmc:productName/>` en una página de producto, el sistema proporcionará el nombre del producto que se mostrará en la pantalla.\n\nPara agregar un control, basta con pegarlo en el código. El resultado será renderizado en la posición del código donde se agregue.\n\n### Lista de controles nativos de VTEX\n\nPuede consultar todos los controles nativos disponibles y sus respectivos usos en el artículo [Lista de controles para templates](https://developers.vtex.com/docs/guides/list-of-controls-for-templates).\n\n## Referencias\n- [Layout](/es/subcategory/layout--2g6LxtasS4iSeGEqeYUuGW)\n- [Configuración](/es/subcategory/configuracion-de-cms--6kovkwzMRyeOOc2iEC4suM)\n- [Estructura de las carpetas del Layout](/es/docs/tutorials/estructura-de-carpetas-del-cms)\n- [Lista de controles para plantillas](https://developers.vtex.com/docs/guides/list-of-controls-for-templates)\n- [¿Qué son las plantillas?](/es/docs/tutorials/que-son-templates)\n- [¿Qué es un sitio web?](/es/docs/tutorials/que-es-un-web-site)\n- [¿Qué son los controles?](https://developers.vtex.com/docs/guides/list-of-controls-for-templates)\n- [¿Qué son los layouts?](/es/docs/tutorials/que-es-cms-layout)\n- [¿Qué son los estantes?](/es/docs/tutorials/que-son-estantes)\n- [¿Qué es binding?](/es/docs/tutorials/que-es-binding)\n\n## Guías\n- **[Crear o editar una plantilla de página](/es/docs/tutorials/como-crear-un-template-de-pagina):** Aprende a crear plantillas de página. La plantilla de página es un modelo creado para definir una estructura HTML para presentar el contenido de las páginas.\n\n- **[Asociar una plantilla a un layout](/es/docs/tutorials/asociar-un-template-con-un-layout):** Asocia una plantilla a un layout utilizando la carpeta Sites and Channels.\n\n- **[Gestión de placeholders](/es/docs/tutorials/gestion-de-placeholders):** Un placeholder es un fragmento de código configurable que atiende a las condiciones establecidas por la tienda. Inserta y configura un placeholder, por ejemplo un banner en tu tienda.\n\n- **[Uso de controles nativos de VTEX](/es/docs/tracks/cms-portal-legado):** Los controles son fragmentos de código que puedes utilizar en las plantillas de tu sitio web para realizar acciones específicas, por ejemplo, un control en una página de producto para mostrar el nombre del producto en la pantalla.\n\n- **[¿Para qué sirve el Control Personalizado?](/es/docs/tutorials/para-que-serve-o-controle-customizado):** Además de los controles nativos de VTEX, puedes crear tus propios controles.\n\n## Controles\n- [Lista de controles para templates](https://developers.vtex.com/docs/guides/list-of-controls-for-templates)\n- [Control de búsqueda - fulltextSearchBox](/es/tutorial/controle-de-busca-fulltextsearchbox--tutorials_549)\n- [Control de destaque de la colección](/es/docs/tutorials/control-de-destaque-de-coleccion)\n- [Control de breadcrumbs](/es/docs/tutorials/control-de-breadcrumb)\n- [Controles de la plantilla de estante](/es/tutorial/controles-do-template-de-prateleira--tutorials_550)"}