Popular Articles

  1. Barra de anuncio

    En el siguiente tutorial, vamos a agregar la barra que se ubica por encima del head de la tienda. Contiene un área de texto con la posibilidad de asignarle un link.  HTML 1.  Para comenzar vamos a crear un nuevo snipplet llamado header-adverti...
  2. ¿Cómo mostrar fotos en la página de producto?

    Si querés que se muestra una sola foto dentro de la página de producto, deberás agregar el siguiente código:  {% if product.featured_image %} {{ product.featured_image | product_image_url('medium') | img_tag }} {% endif %} En...
  3. Otras plantillas nativas de Tiendanube

    En Tiendanube además de la plantilla Base tenemos 19 plantillas nativas más a las cuales damos soporte.  En este artículo vamos a ver cuáles son y qué diferencias técnicas existen entre sí. Para ver las diferencias en términos del diseño, t...
  4. ¿Cómo muestro los logos de los medios de pago y envío?

    Para mostrar los logos en todas las páginas deberás agregar en el archivo layout.tpl debes utilizar las variables settings.payments y settings.shipping . {% for payment in settings.payments %} {{ payment | payment_logo | im...
  5. ¿Cómo crear un banner configurable por el usuario?

    1. Añadí el siguien código en settings.txt : Homepage     meta         icon = picture-o         advanced = true     title         title = Imagen de la homepage     image         title = Imagen de la homepage         original = imag...
  6. Store

    Este objeto representa a la tienda y es generalmente usado en combinación con otros objetos. Podés usarlo de dos formas: sólo para mostrar la información o para preguntar algo. store.name: Es el nombre de la tienda. store.url: Es la URL...
  7. ¿Cómo muestro el listado de productos?

    1. Agregar el siguiente código en home.tpl  ara crear el listado de productos: {% for product in products %} {{ product.featured_image | product_image_url("medium") | img_tag(product.name) | a_tag(product.url) }} {{ pr...
  8. Segunda imagen en rollover

    En este tutorial vamos a implementar el comportamiento para que en los listados de productos, al pasar por un producto, muestre la segunda imagen del mismo. HTML 1. Lo primero que vamos a hacer, es reemplazar la imagen por el componente priva...
  9. Lazy load

    En algunos tutoriales incluimos la técnica de lazy load, para la cual usamos el plugin  Lazysizes .  Básicamente lo que hace es evitar cargar imágenes que no están dentro del campo visual en la pantalla del dispositivo donde se muestra el sitio.  ...
  10. Category

    Este objeto representa a una categoría de la tienda. id: Id de la categoría. name: Nombre de la categoría. description: Descripción de la categoría. url: URL de la categoría. parent: Objeto Category correspondiente a la categoría padre. subca...