Diseñador
El diseñador permite personalizar la plantilla o el tema elegido. El diseñador ofrece muchas posibilidades de personalización y, por lo tanto, es menos fácil de usar que la gestión de la plantilla estándar. Esta página describe las características del diseñador.
Navegue hasta Configuración > Diseño y haga clic en la pestaña Diseñador. A continuación, haga clic en Iniciar. Se recomienda utilizar una pantalla grande (al menos 1920x900 píxeles) para trabajar de forma óptima con el diseñador.
El diseñador se compone de la vista previa en el fondo, una ventana con la vista móvil de su sitio web y la ventana de diseño.
Vista móvil
La mayoría de la gente visitará su sitio web con un smartphone. La vista móvil le da un ejemplo de cómo se verá su sitio web en una pantalla pequeña. Asegúrese de que el sitio web no se hace demasiado ancho para que no aparezca una barra de desplazamiento horizontal. Todas las plantillas son amigables con los móviles por defecto, pero el diseñador da mucha libertad para que esto pueda ser interrumpido.
Los iconos de la parte superior permiten ver en diferentes resoluciones.
El icono Refrescar permite refrescar los scripts de la web para ver la última versión.
Ventana de diseño
Diseños
El primer botón te da una visión general de tus diseños personalizados.
- Añadir diseño
- Con este botón puedes añadir un nuevo diseño o copiar un diseño de otra tienda web.
- Publicar
- Después de publicar, el diseño estará en vivo y visible para sus visitantes.
- Personalizar
- Esto le permitirá editar el nombre, los comentarios y los derechos de copia del diseño.
- Borrar
- Esta acción le permite eliminar el diseño. Esta acción no se puede deshacer.
Elementos
Los elementos forman la estructura HTML de su sitio web. Después de elegir un elemento, se le presentará un formulario web que le permitirá modificar las propiedades del elemento.
Hay muchos elementos y propiedades que se pueden personalizar con el formulario web. El elemento principal es la página web. Este formulario modificará automáticamente el selector CSS subyacente.
Las propiedades que ya han sido personalizadas se indican con un fondo verde en el campo del formulario. Si se deja el valor de una propiedad en blanco, se eliminará la propiedad.
Subelementos
Algunos elementos contienen subelementos. Al hacer clic en los enlaces aparecerá un nuevo formulario que puede utilizarse para modificar las propiedades del subelemento.
Medios
Es posible que las propiedades de los elementos sólo se apliquen para determinados tamaños de pantalla o en la versión impresa. Al hacer clic en los enlaces se ajustan las propiedades del elemento para un medio concreto.
Guardar
Utilice este icono para guardar el diseño. Esto no publicará el diseño.
Estructura
Permite modificar la estructura HTML del sitio web. Puedes añadir, mover y eliminar objetos.
Hay objetos visibles (función de búsqueda, carro de la compra, selección de idioma, navegación) y contenedores invisibles que se utilizan para estructurar el sitio web. Los contenedores se suelen utilizar para agrupar elementos o añadir fondos.
Puede realizar ajustes en la estructura arrastrando elementos o utilizando las flechas Arriba/Abajo. Puede añadir un nuevo elemento haciendo clic en Añadir en la parte inferior. Para eliminar un elemento, haga clic en el icono Borrar.
La estructura se ajusta automáticamente en los ejemplos de diseño. Si el ajuste no se produce automáticamente, haga clic en Guardar en la ventana de diseño y luego en Recargar en la vista móvil.
Personalización del CSS
Permite modificar los códigos de maquetación (Código CSS) de la web.CSS - Cascading Style Sheets no es un lenguaje de programación, sino un lenguaje de estilo que se puede utilizar para definir el formato de los elementos del sitio web.
Personalizar CSS, ¿es algo para un profano?
El CSS se puede aprender fácilmente. Recomendamos este método para los usuarios que quieran personalizar su propio sitio web e invertir tiempo en aprender sobre CSS.
Enlaces útiles con información sobre CSS:
- W3Schools - tutoriales para aprender CSS
- CSS-Tricks - nuestro favorito con mucha información sobre CSS
Ayuda en la personalización de CSS
Para las modificaciones del código CSS, nuestro servicio de ayuda no puede proporcionar soporte. Añadir soporte para CSS significaría hacer un diseño web a medida y eso haría que que.tienda fuera mucho más caro. Sin embargo, tenemos algunos buenos contactos con diseñadores web que pueden ayudar con la personalización de CSS por una tarifa.
No recomendamos dejar que los diseñadores web entren en su tienda web directamente o con una cuenta de administrador. Esto a veces lleva a discusiones sobre cambios que no eran deseados. ¡Sólo deje que las personas inicien sesión en su tienda que usted confía! En su lugar, el diseñador web puede crear una tienda web básica y diseñar el diseño en esta tienda web. A continuación, puede copiar el diseño a su tienda web con la función de copia.
Preferencias
Aquí puedes activar y desactivar el modo oscuro, la pantalla completa y el resaltado de sintaxis del código CSS. También hay una opción para que la ventana de diseño sea transparente. Las preferencias se refieren a la ventana de diseño; por lo tanto, no al sitio web.
¿Cómo puedo cambiar la propiedad X?
Cambiar el fondo
Elige el elemento que quieras, por ejemplo Página Web. En Imagen de fondo, haz clic en el icono Editar imagen. Elija una imagen de la lista o Cargue una nueva imagen.
También puede comprar una imagen utilizando la Galería. Si quieres utilizar la imagen en una página, te recomendamos el formato web. Para los fondos, recomendamos el formato Grande.
Haga clic en Insertar para establecer la imagen como fondo. Después de establecer la imagen de fondo, también aparece un icono Borrar imagen.
Cambiar botones
Elija el elemento Página web y el subelemento Botones. En el formulario se pueden ajustar propiedades como el color, el tamaño, el estilo del borde, etc.
El subelemento Botones mouse-over permite cambiar el estilo de los botones cuando se pasa el ratón por encima de ellos. Por ejemplo, se puede dar al botón un color más claro.
Personalizar los colores
La forma más fácil de cambiar los colores es en el código CSS. Los códigos de color se parecen a #ffffff o rgba(255, 255, 255, 0,5). Con esta última notación, el último parámetro (0,5 en el ejemplo) es la transparencia.
Enlaces útiles para componer colores:
- Diseñador de colores - genera fácilmente paletas de colores
- Combos de colores - montar combinaciones de colores
Personalización de fuentes
Puedes cambiar la fuente seleccionando un elemento y ajustando Font en el formulario.
Por defecto, todas nuestras plantillas tienen un tipo de letra establecido para el elemento principal Página Web. Es posible establecer diferentes fuentes para diferentes elementos. No recomendamos esto para mantener las cosas despejadas.
Posibles problemas
- Todavía veo la versión antigua de mi tienda online
- Normalmente esto se debe a que las imágenes antiguas están todavía cargadas en la caché de su navegador. Los navegadores web (Internet Explorer, Firefox, Google Chrome ...) guardan las páginas web y las imágenes en el disco duro para que en su próxima visita, estas páginas carguen más rápido. Si al visitar su tienda online ve la versión antigua es porque ha cargado la versión guardada esn su disco duro y no la versión en vivo de su tienda online.
Para resolver este problema: navegue hasta su tienda online y haga clic en Actualizar página o en Volver a cargar / Refrescar página.
También puede utilizar las siguientes combinaciones de teclas: F5 o CTRL + R (Command + R en Mac). - El favicon no se muestra
- Utilice un navegador reciente. En algunas versiones antiguas de Internet Explorer no se muestran los favicon.
También recomendamos conectar su tienda con un nombre de dominio. Algunos navegadores muestran el favicon de que.tienda si su tienda no esta conectada a un nombre de dominio propio.
Página siguiente: Edición de textos y páginas web (CMS)
- Introducción
- Gestión de Productos
- Configuración de la Tienda Online
- Configuración de la cuenta y de la tienda
- Métodos de pago y proveedores de servicios de pago
- Facturas. Términos y condiciones
- Configuración de envíos
- Configuración de descuentos y recargos
- Registro de nombres de dominio y trasferencias de dominio
- Tienda en múltiples idiomas
- Conexión con otras plataformas
- Direcciones web personalizadas
- Gestionar varias tiendas online (Multishop)
- Un diseño atractivo y creativo
- Gestión de pedidos
- Marketing / Mercadotecnia
- Módulos
- Copias de seguridad y exportación
- Correo electrónico y Webmail
- Cuentas de administrador
- Fotos en alta calidad
- Autenticación de doble factor
- Etiquetas
- Metaetiquetas - Verificación del sitio web
- Live Chat
- Presentación de diapositivas
- Estadísticas de visitantes - Google Analytics
- Filtros
- Terminal Punto de Venta (TPV)
- Personalizar formularios
- Productos descargables
- Sistema de reservaciones (Symcalia)
- Módulo: Libro de Visitas - Guestbook
- Contacto con el servicio de soporte técnico