Elementor Academy

Introducción a CSS personalizado de Elementor

> Pestaña Avanzado

Para poder ver este Contenido Premium (Videotutoriales, descargas, herramientas, recursos, ...) tienes que estar suscrito al menos a una licencia de Elementor Pro, JetPlugins o Dynamic ooo. Si ya estás suscrito Inicia la sesión.

Código CSS
Enlaces de interés

En este ejemplo voy a transformar los estilos del widget de Categorías de WordPress usando la sección CSS personalizado de la pestaña Avanzado con Elementor. Si eres suscriptor de una de las licencias solo tienes que iniciar la sesión para ver al detalle paso a paso como se hace.

Introducción a CSS personalizado de Elementor

Insertamos el widget Categorías a nuestro documento
Clic en la pestaña Avanzado
Clic en la sección CSS personalizado y pegamos el código CSS

Código CSS

Haz clic en el botón COPIAR CÓDIGO para copiar el código usado en este video tutorial al portapapeles.

selector h5 {
    display: none;
}

selector li {
    list-style: none;
    display: inline-block;
    margin-bottom: 20px;
}

selector li a {
    border: 2px solid blue;
    padding: 7px 15px;
    margin: 5px;
    border-radius: 50px;
    color: blue;
    text-transform: uppercase;
}

selector li a:hover {
    color: white;
    background-color: blue;
}

selector ul {
    margin: 0;
    padding: 0;
    text-align: center;
}