15 JUN

¿Cómo Introducir o modificar un banner en mi tienda online Mabisy? HTML o de IMÁGENES

Si te gusta puedes compartirlo aquí:

**********************************************************************************

ATENCION: Antes de hacer este proceso debes tener activado el modo desarrollador en el gestor de contenidos:

/blog-ayuda/activardesactivar-el-gestor-de-contenidos-avanzado-en-una-tienda-mabisy-permite-editar-los-contenidos-Activar-Desactivar-modo-...

**********************************************************************************

La opción mas sencilla es "AÑADIR UN MODULO HTML"

Aquí tienes un vídeo explicativo:

 

 

Para introducir o modificar un banner en tu tienda Mabisy sigue los siguientes pasos:

  1. Accede al gestor de contenidos de tu tienda, para acceder usa el botón editar texto de la parte superior del panel de control de tu tienda.Ashampoo_Snap_2013.08.23_18h06m50s_043_.png
  2.  Selecciona la zona de la web en la que quieres que aparezca el banner y añade un módulo. El modulo tiene que ser del tipo banner. Si no sabes como añadir un módulo lo puedes  ver aquí.
  3. Haz click sobre el icono Ashampoo_Snap_2013.08.23_17h31m46s_038_.png del módulo que acabas de crear. Al hacer click te llevará al panel de control.Ashampoo_Snap_2013.08.23_18h12m10s_044_.png
  4. Pulsa el botón boton-nuevo.png.
  5. Rellena los datos necesarios, verás que el formulario te permite subir la imagen de tres maneras diferentes ( HTML,Producto,imagen).
    • En "Módulo" selecciona el módulo que acabas de crear.
 

EJEMPLOS DE CODIGO HTML QUE PUEDES INSERTAR EN TU BANNER MUY CHULOS 

Estos códigos puedes ponerlos en tu baner de tipo HTML y hacer cosas muy chulas, pero tendrás que editar el HTML

 

1. IMAGEN SOLA SIN LINK SIN TEXTO
<div style="background: url('/server/Portal_0006447/img/galeria/banner01_1681_14599.jpg') center center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; min-height: 585px;"></div>
 
2. IMAGEN CON TEXTO 
<div style="background: url('/server/Portal_0006447/img/galeria/banner01-a_1684_14600.jpg') center center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; min-height: 585px; position: relative;">
<div style="position: absolute; bottom: 20px; left: 0; right: 0; text-align: center; display: block;">
<p><span style="font-family: tahoma,arial,helvetica,sans-serif; font-size: 48px; color: #ffffff;"><strong>Fusi&oacute;n sin confusi&oacute;n</strong></span></p>
<p style="text-align: center;"><sub><span style="font-family: tahoma,arial,helvetica,sans-serif; font-size: 48px; color: #ffffff;"><span style="font-size: 18px;">A commerical for a famous brand. Experimental</span></span></sub></p>
</div>
</div>
3. VIDEO CON FONDO NEGRO
<div style="background: #000; min-height: 585px;">
<div style="max-width: 840px; margin: 0 auto;">
<div class="embed-responsive embed-responsive-4by3"><iframe width="425" height="350" src="//www.youtube.com/embed/LO6ESz-_DvU" frameborder="0" allowfullscreen=""></iframe></div>
</div>
</div>
4. IMAGEN CON ENLACE A UNA CAPA CON UN VIDEO
<p><link rel="stylesheet" type="text/css" href="http://www.mabisy.com/js/remodal/jquery.remodal.css" /></p>
<script src="http://www.mabisy.com/js/remodal/jquery.remodal.min.js" type="text/javascript"></script>
<script type="text/javascript">// <![CDATA[
function lanzarModal() {
var instancia = $.remodal.lookup[$('[data-remodal-id=modal-capa]').data('remodal')];
// open a modal
instancia.open();
}
// ]]></script>
<p><a href="#" onclick="lanzarModal(); return false;"><img class="img-responsive" src="/server/Portal_0006447/img/galeria/banner01-a_1684_14600.jpg" width="2000" height="759" /></a></p>
<div class="remodal" data-remodal-id="modal-capa">
<div class="embed-responsive embed-responsive-4by3"><iframe width="320" height="240" src="//www.youtube.com/embed/PCnnwGls7Ns" frameborder="0" allowfullscreen=""></iframe></div>
</div>

¿Quieres proponer alguna mejora para las 100 mejoras anuales sin coste en Mabisy? Hazlo aquí ahora
 
¡Suerte con tu tienda online!

¿Te ha gustado? Si quieres puedes compartirlo aquí:


Centro de ayuda de Mabisy

4 comentarios

Juan Castillo

13 [ene NF], 2015 14:45:52

¿hay algun tipo de banner que no sea dinámico? que sea solo una imagen y ya esta?

www.lindavita.com

Comentario Original 19 de septiembre de 2012 12:48

Juan Castillo

13 [ene NF], 2015 14:51:01

si seguis este videotutorial es muy facil, pero el modulo que debeis añadir no es el modulo "banner" sino el módulo "contenido estatico html" y es muy fácil

Video Mabisy--> http://www.youtube.com/watch?v=W2o7T71rFYA

Comentario Original 20 de septiembre de 2012 19:53

Mabisy

13 [ene NF], 2015 14:51:37

Juan tal como comentas, para añadir una única imagen, lo ideal sería utilizar el modulo de tipo HTML. Pero en Mabisy para que tengáis la posibilidad de elegir os damos la opción de añadir un módulo de tipo banner para todos aquellos que deseen añadir un banner dinámico.



¡Suerte con tu tienda online!

Comentario Original 21 de septiembre de 2012 18:15

Mabisy

13 [ene NF], 2015 14:52:11

Puedes añadirlo como un modulo nuevo HTML e insertarle una imagen

http://soporte.mabisy.com/entries/21564042-como-anadir-un-modulo-en-mi-tienda-online-mabisy

Comentario Original 28 de octubre de 2014 15:52

Deja un comentario


( * ) Campos obligatorios

Sigue a Mabisy en Google + o Visíta nuestra página en Google+



Sobre el blog

Noticias, novedades, Actualidad y muchos trucos para hacer que tu tienda online sea un éxito.

Síguenos en...

 8.231