Cómo Hacer Una Página

Hacer una Web Profesional con Wordpress

  • Suscribirse (10€/mes)
  • Mi Cuenta
  • Contacto
Estás aquí: Inicio / Listable / Añadir estilo al buscador creado con FacetWP en Listable con CSS

Añadir estilo al buscador creado con FacetWP en Listable con CSS

abril 23, 2018 Por Oscar martin Dejar un comentario

En el tutorial anterior vimos como añadir un buscador personalizado en cualquier página de Listable

Este buscador es igual de potente del que viene en la cabecera de la home en Listable pero viene sin diseño.

En este tutorial veremos como podemos añadir diseño por medio de CSS.

Vamos a darle un estilo parecido al buscador que está en la Home.

Recordar que en la Zona Premium tenemos un curso de CSS de Guerrilla para WordPress

Apoyándonos en el inspector de elementos de Google iremos copiando el CSS del buscador principal.

Para ver el curso tienes que ser Miembro Premium. Si no estás suscrito a la Zona Premium te puedes dar de alta por 10€/mes aquí

43 Añadir estilo al buscador creado con CSS en Listable

css buscador listable

Pasaremos de un buscador sin diseño:
buscador sin formato listable

A un buscador con diseño:
buscador con formato listable

Cómo veis con muy poco CSS podemos hacer que nuestro buscador se vea mucho más bonito.
El truco está en aprovechar las clases ya creadas en la plantilla.

Nos faltaría de añadir el botón rojo de buscar, lo veremos en el próximo vídeo.

Hasta el siguiente tutorial 😉

Archivado en:Listable

Acerca de Oscar martin

Me llamo Óscar y me dedico al Marketing Online. Me gano la vida gracias a internet y a herramientas como Wordpress. ¿Te puedo ayudar? Contáctame

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Carrito

Categorías

Contenido Premium

¿Quieres Aprender WordPress y Ganar dinero? Cópiame

¿Necesitas Ayuda?

  • Contacto
  • Blog

Más Información

  • Condiciones de Uso
  • Condiciones generales de venta
  • Aviso Legal
  • Pólitica de Privacidad
  • Política de cookies

Buscador

Funciono con el Theme Genesis · Iniciar sesión

Este sitio web instalará en tu navegador cookies analíticas y publicitarias propias y de terceros si continúas navegando.
Encontrará más información en nuestra Política de Cookies...Configuración de CookiesAceptar
Privacy & Cookies Policy

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necesarias
Siempre activado

Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.
Básicamente el blog no funcionará bien si no están activas.
Estas cookies son:
- Comprobación de inicio de sesión.
- Cookies de seguridad imprescindibles.
- Saber si ya has aprobado/rechazado las cookies.

No necesarias

Esta web utiliza las siguientes cookies adicionales:
- Mautic: Recordar si ya estás suscrito al boletín de noticias.
- Google Analytics: un servicio de analítica web desarrollada por Google, que permite la medición y análisis de la navegación en las páginas web.