El día de hoy te enseñaré a como crear la sección BANNER de tu sitio web. Para este ejemplo vamos a replicar el BANNER del sitio oficial de los OSCARS, el cual está compuesto por un carrusel de imágenes.
Paso 1
Ingresamos a nuestro panel de MGPanel damos clic en Desarrollador e ingresamos a Posiciones.
Paso 2
Estando allí editaremos la Posición #3 dando clic al botón de editar. La configuraremos de la siguiente manera:
- Título de la posición: Banner Principal
- Verificamos que esté marcada como ACTIVA
- Etiquetas Apertura:
<!-- Bloque de código eliminado por incompatibilidad -->- Etiquetas Cierre:
<!-- Bloque de código eliminado por incompatibilidad -->- Vista en página: Solo el HOME
Y damos clic a Guardar.
Paso 3
Damos clic en Desarrollador e ingresamos a Banners. Crearemos un nuevo banner de la siguiente manera:
- Título: Banner principal
- Verificamos que esté marcado como ACTIVO
Agregando los ítems que conformarán nuestro banner (las diferentes imágenes que lo componen):
- Imagen: Damos clic sobre el recuadro de cargar imagen y seleccionamos una de las imágenes para nuestro banner
- Contenido HTML: En este caso lo dejaremos vacío, ya que no colocaremos ningún elemento adicional en nuestro banner
- Orden: El orden que le quieren dar a esa imagen dentro del banner
- Verificamos que esté marcado como VISIBLE
* Repetimos este paso para cada una de las imágenes que queramos agregar a nuestro banner (Al dar clic sobre AGREGAR ÍTEM este creara una nueva fila de campos para el nuevo ítem de nuestro banner)
Luego de cargar todos nuestros ítems damos clic a Guardar.
Paso 4
Copiamos el código del banner que acabamos de crear.
Paso 5
Damos clic en Desarrollador e ingresamos a Módulos. Crearemos un nuevo módulo para el BANNER y este lo configuraremos de la siguiente manera:
- Título del módulo: Banner Principal
- Posición: Banner Principal
- Orden: 1
- Verificamos que esté marcado como ACTIVO
- En Código HTML vamos a colocar el código de nuestro banner:
<!-- Bloque de código eliminado por incompatibilidad -->Y damos clic a Guardar.
Ve a tu página web y verás que tu sitio web ya tendrá un BANNER como el del sitio oficial de los OSCARS.
De esta forma se verá tu BANNER en tu sitio web: Ver BANNER de los OSCARS en página web.
En próximos post te daremos otros consejos para que los apliques en este nuevo CMS para programadores, también iremos construyendo secciones de sitios web y otros trucos que queremos compartir contigo.
O si quieres especializarte en programación web dale un vistazo a nuestro Máster en programación web desde cero.
O también puedes visitar nuestro canal de YouTube, donde tenemos tutoriales y clases grabadas de como crear páginas web de forma rápida y sencilla.
Nos vemos en un próximo post,
Wilmer Silva