OpenCart Marketing Tools Banners

Dentro de una tienda web de OpenCart, los banners se pueden mostrar de muchas formas. Se pueden mostrar como una imagen estática, un carrusel o una presentación de diapositivas. Cada banner puede incluir una o más imágenes y estos grupos de imágenes pueden asignarse a diferentes módulos, según el tamaño y la función que trabajen.. 

Cuando desee colocar un banner en su sitio web, primero cargue imágenes a los banners y luego asigne estos banners con módulos de visualización..

Subiendo Imágenes para Banners

En el panel de control de OpenCart, navegue hasta Sistema> Diseño> Banners. Insertemos nuestro primer banner, añádale un nombre y establezcamos su estado. Ahora acabamos de crear un grupo para las imágenes que subiremos.. 

Vamos a empezar a agregar imágenes haciendo clic en el Añadir Banner botón. Como puede ver, aquí podemos agregar un título para cada idioma de la tienda web, copiar o escribir su enlace y navegar o cargar el archivo de imagen (JPG, PNG o GIF). Podemos asignar tantas imágenes de banner como queramos, pero todas las imágenes deben tener el mismo tamaño o al menos la proporción, ya que estas imágenes cambiarán o se deslizarán dentro de un módulo de soporte de banner. (La convención de nomenclatura de los banners puede ser confusa ya que el sistema usa el término bandera para conjunto de imágenes de banner y usos bandera Para el imagen a sí mismo, también.)

Carga de imágenes para banners en OpenCart (Admin> Sistema> Diseño> Banners)

Asignando Banners a los Módulos

Como aprendimos anteriormente, los banners se muestran con módulos en OpenCart. Hay tres módulos comúnmente utilizados para mostrar banners: Módulo de banner, Carrusel y Diapositivas. Todas tienen funciones similares: animan imágenes del mismo tamaño y permiten al usuario hacer clic en ellas.

Agregar un módulo de banner

UNA Módulo de banner muestra banners por desvanecimiento imágenes de banner en un lugar cada uno después de cada uno. Para asignar un banner a un módulo de marcador de posición de banner, navegue a Extensiones> Módulos> Banner> Editar. 

Hacer clic Agregar módulo y esto nos permite invocar banners en un diseño. Tienes que elegir qué banner mostrar, definir el Dimensión, elige un Diseño dónde mostrar, un Posición de la columna, selecciona el Estado y el Orden del modulo. El tamaño del módulo debe ser para que encaje en el columna será colocado. El sistema redimensiona las imágenes subidas de acuerdo a esta dimensión.. Diseños Están predefinidos y su nombre es descriptivo.. Posición se puede configurar izquierda, derecha, arriba o abajo (consulte los detalles sobre las posiciones de diseño aquí). Orden define el conjunto de apariencia visual de más módulos dentro de una columna.

Un banner solo se puede asignar a un módulo una vez que el banner ya está creado.

Agregando Banners a los Módulos de Presentación

los Módulo de presentación de diapositivas muestra imágenes de banner como una animación de diapositivas en movimiento. Este módulo generalmente se muestra en la página de inicio con imágenes más grandes del paisaje. Los principales parámetros de este módulo, como el tipo de animación, la velocidad o su apariencia, están definidos en su archivo de tema, que no necesitamos modificar, ya que usamos el módulo de preajuste.. 

Podemos asignar un banner ya establecido y cargado a una presentación de diapositivas yendo a Extensiones> Módulos> Presentación de diapositivas> Editar. Al agregar un módulo, debemos realizar una configuración similar a la que hicimos en el módulo de banner anterior. Elige un banner mostrar, agrega su tamaño, elige un diseño y posición, selecciona el estado y el orden. Vea la siguiente ilustración.

Para obtener la mejor experiencia visual, el tamaño de las imágenes de banner cargadas previamente debe ser del mismo tamaño que el módulo que se va a utilizar..

Agregando Banners al Módulo Carrusel

los módulo de carrusel le permite mostrar un conjunto de imágenes de banner más pequeñas una junto a la otra y animarlas, mostrarlas y ocultarlas paso a paso mientras se mueve horizontalmente. 

Podemos configurar este módulo de la misma manera que agregamos un banner a una presentación de diapositivas, aunque un módulo de carrusel acepta dos cosas más:

  1. El valor de Límite le dice al carrusel cuántas imágenes debe mostrar al mismo tiempo
  2. los Voluta Establece el número de imágenes que el carrusel para saltar entre dos pasos..

Cómo rastrear los clics de banner

Estos módulos de banner son muy útiles y no hay muchas soluciones de comercio electrónico que los tengan como parte del núcleo, aunque tienen capacidades limitadas, por ejemplo. No puedes ver el número de clics en los banners. Si queremos medir los clics, podemos usar Google Analytics para eso (Dado que ya has instalado el código de seguimiento). 

Hacer clic en un banner que redirige a una página en el mismo sitio es una evento en el término de Google Analytics. Por eso usamos el seguimiento de eventos Característica de Google Analytics para medir los clics de banner en el sitio en OpenCart. Aquí hay un ejemplo de HTML para implementar el seguimiento de eventos:

Titulo de banner

Un evento ocurre cuando un usuario hace clic en algo. El evento es seguido por el _evento de pista() Método que contiene la siguiente información: categoría - grupo de objetos que queremos rastrear (por ejemplo, presentación de diapositivas), acción - el tipo de interacción del usuario (por ejemplo, clic de banner), etiqueta - una cadena opcional para datos adicionales, valor - Datos numéricos opcionales para la acción. Como puede ver, una línea simple de modificación de HTML ayudará a rastrear nuestros clics de banner.

Cambiar sus archivos de plantilla de módulo para rastrear los clics de banner

Los módulos de banner, presentación de diapositivas y carrusel tienen sus propias plantillas dentro del directorio del tema utilizado. Solo necesitamos cambiar algunas líneas en los archivos de plantilla de módulo. Esto es lo que necesitamos agregar a la Etiquetas dentro de los archivos de plantilla: onClick = "_ gaq.push (['_ trackEvent', 'banner type', 'Clicked', '']); "

Para banners, Encuentra este o similar pedazo de código en tu tema su carpeta de tema \ template \ module \ banner.tpl expediente:

"><?php echo $banner['title']; ?>

y reemplazar con esto:

"onClick =" _ gaq.push (['_ trackEvent', 'Banners', 'Clicked', '']); "><?php echo $banner['title']; ?>

Como puedes ver, añadimos Banners como el categoría componente, Hecho clic como el acción, y el sin desbarbar versión de la título del banner como etiqueta. No tuvimos que elegir un valor, ya que el valor predeterminado es uno y, en nuestro caso, eso es lo que necesitamos.

La plantilla de diapositivas, que se puede encontrar en su carpeta de tema \ template \ module \ slideshow.tpldebe ser cambiado de esto:

"><?php echo $banner['title']; ?>

a esto:

"onClick =" _ gaq.push (['_ trackEvent', 'Slideshow', 'Clicked', '']); "><?php echo $banner['title']; ?>

La plantilla del carrusel se encuentra en su carpeta de tema \ template \ module \ carousel.tply estas líneas necesitan ser cambiadas de esto:

  • "><?php echo $banner['title']; ?>
  • a esto:

  • "onClick =" _ gaq.push (['_ trackEvent', 'Carousel', 'Clicked', '']); "><?php echo $banner['title']; ?>
  • Los resultados de los clics se pueden ver si va a Google Analytics y a la Comportamiento seccion> Eventos visión general. Allí veremos la categoría (en nuestro caso, el tipo de banner), el número de clics y el nombre del banner..

    Conocimientos generales de cómo hacer pancartas.

    Conclusión

    Nos enteramos de que primero tenemos que cargar las imágenes de banner en los banners (grupo), para luego asignarlos a un módulo de visualización, como banner, presentación de diapositivas o carrusel. Más tarde, cambiamos los archivos de plantilla del módulo para rastrear los eventos de clics con Google Analytics.

    Si tiene preguntas, pregúnteles en el área de discusión a continuación.