+41789553005

Actualmente existen muchos modos de darle un toque único y diferente a ciertas secciones de tu página web; es por ello que te enseñaremos a aplicar esta idea para las tarjetas de anuncio, utilizando el módulo de anuncio para mantener la tarjeta, el icono y el módulo de botón en un solo enlace.

 

Puedes descargar el siguiente archivo zip que contiene el diseño y el CSS de forma sencilla y práctica.Este archivo es cortesía de yatesdesign

Si Deseas importar este archivo de diseño puedes ingresar a la publicación de elegant Themes

Esta idea proporciona una forma sencilla de modificar y personalizar la funcionalidad de las tarjetas de anuncio, sin dejar de cumplir su objetivo; si estás interesado en el diseño de sitios web, o posees un tema hijo divi, esto te ayudará a entender y estilizar más tu espacio web.

 

A continuación los pasos que debes seguir para aplicar este modo:

 

Paso 1

-Crea una sección estándar y en los ajustes coloca de fondo: #f5f5f5

Paso 2

Añade una fila con 2, 3 o 4 columnas y ajusta lo siguiente:
-Activar “Hacer que esta fila tenga anchura completa: ”
-Habilitar  “El Uso Personalizado De Canalón De Ancho: ” : Colocar el Espacio entre columnas en: 2
-En la pestaña Custom CSS, establecer la clase CSS para “blurb-card


Paso 3

Añade un módulo de anuncio a cada columna y ajusta lo siguiente:
-Añade un título y URL
-Selecciona SI para el uso del icono
-Establece el color del icono a blanco
-Selecciona SI para activar icono circular
-Ajusta el color del circulo a: # 0f2c41
-Establece la orientación de texto a centrado
-Añade una descripción en la sección de contenido


Paso 4

Añade un módulo de botón a cada columna y añade un URL y título a cada uno de ellos (el título debe estar oculto pero debe tener contenido en él para que funcione)


Paso 5

Añade el siguiente código a tu pagina CSS personalizada. En Divi puedes agregar CSS personalizado a las páginas individuales haciendo click en la parte superior del constructor divi, en el icono de ajustes (3 líneas una sobre otra).


Y así es como funciona el método!.


Sin embargo puedes encontrar más información sobre otros temas de tu interés acá en TantoMarketing


Subscribete ahora totalmente gratis para Tutoriales de DIVI, Ofertas y Mas!

TantoMarketing

En TantoMarketing somos especialistas en Temas hijo Divi, además de Plugins para mejorar el Diseño de la tienda online de Divi. Dentro de nuestros más notables artículos tenemos TantoShop, Divi Shop Extended 2.0, TantoPortfolios, entre otros
SIGUENOS EN:

Copyright © 2018. TantoMarketing . All rights Reserved

 

Pin It on Pinterest

Share This