Como cambiar las imagenes del slider – banner – en OpenCart

El slider o banner principal que viene por ‘default’ en una instalación de OpenCart tiene un tamaño de 980px por 280px. Este slider se llama ‘Samsung Tab’.

Este slider esta controlado por JavaScript y el nombre del script que OpenCart esta usando es: Nivoslider. Puedes encontrar más información en este enlace con respecto a ese script acá: http://nivo.dev7studios.com/ Ya hablaré en otra entrada de como personalizar este script.

Cómo añadir imágenes en el banner de OpenCart?
Para añadir imágenes, obviamente debemos de crear imágenes de 980px por 280px, y añadirlas a OpenCart de la siguiente manera:

  1. En el panel de administración abrimos: ‘>System ->  Design -> Banners’, acá encontraremos los 3 banners que vienen por ‘default’ con OpenCart, (HP Products, Manufacturers, Samsung Tab). El banner principal es: Samsung Tab.
  2. Selecciona: ‘>Samsung Tab’ y has clic en ‘Edit’. Y deberás tener una ventana parecida a la que aquí ponemos.Modificar Banner OpenCart
    En esta ventana podemos editar varias cosas del Banner:

    1. Nombre del banner.
    2. Status: Habilitarlo o Deshabilitarlo.
    3. El título, el enlace (si alguien hace clic en la imágen lo llevara a ese enlace) y las imágenes del banner.
    4. Por último, la adición de mas imágenes al banner. (Add Banner) Recuerda, las imágenes deben de ser del mismo tamaño.
  3. Haz clic en el botón ‘Add Banner’, una nueva fila va a aparecer inmediatamente debajo de la última imágen con todos los campos vacíos. Ponle un título a tu nueva imágen, si quieres que el visitante sea redireccionado ponle un enlace, y añade la imágen haciendo clic en ‘Browse Files’.
  4. Una vez termines de adicionar las imágenes que vas a usar en tu banner, vas a guardar los cambios haciendo clic en el botón que se encuentra arriba a la derecha, ‘save’.

Esta fue una explicación para modificar la manera básica del slider de OpenCart.

En la próxima entrada les explicaré como cambiar los tamaños de los sliders o banners y como añadirlo en distintos sitios en tu web.

Preguntas?

Add Comment