comunidades

Personalizar gidget "Entradas Populares"


Hola, hola!
Bonito y bendecido inicio de semana tengan todos ustedes la entrada de esta semana es cortita, cortita pero muy practica y es en respuesta a todas las solicitudes (En realidad fueron 5), que me hicieron para que les contara como personalizar el gidget "entradas populares".



En mi caso cada miniatura se vuelve opaca.
Como ya te habrás dado cuenta cada miniatura esta redondeada y con efecto hover (El efecto hover es básicamente lo siguiente, cuando pasamos el puntero sobre dicho elemento gráfico, el aspecto de este cambia, ya sea en color o forma según sea el caso). He de confesar que esta modificación me costo trabajo ya que soy medio burris con el HTML, obtuve varios códigos, seguí las instrucciones al pie de la letra y no mas nada, el cambio no me funcionaba. Pero por fin lo he logrado y es muy sencillo simplemente tenia que cambiar de lugar el código, ya que donde me indicaban lo hiciera no me funcionaba y me las tuve que arreglar solita... te voy a proporcionar dos códigos para conseguir dos resultados diferentes. Así que demos paso al tutorial...
Primero que nada es importante te descargues los códigos que hemos preparado en un documento en Word y que dejamos AQUÍ.
En el Ejemplo #1 tenemos:

Color de fondo, así como forma y color del borde el cual cambia al pasar el puntero sobre el.

En el ejemplo #2:

Color y forma del borde, así como tamaño y tipo de letra del titulo de cada entrada, en mi ejemplo instalamos directamente a la plantilla la fuente Homemade Apple desde Google fonts.

Nos dirigimos a Diseño antes de trastear algún aspecto del editor HTML, modificamos las preferencias del gidget de "Entradas populares"

Guardamos disposición y nos vamos a:
Plantilla
Opciones avanzadas
Agregar CSS
y en la cajita pegamos alguno de los dos códigos, la ventaja aquí es que podemos ir visualizando cada cambio que se le haga, pero no en todos los casos funciona.

Si por alguna extrañisima razón, no te funciona el código, nos regresamos a:
Plantilla
Editar HTML
y buscamos b:skin

Se nos desplegaran un titipuchal de codigos justo aqui presionamos Ctrl+f, y en el buscador pegamos:
Widgets
Antes de Posts o despues de una } llavecita como esta damos un par de intros y pegamos el código que deseamos, haciendo las modificaciones correspondientes para adaptarlos a nuestro diseño.

Yo se que puede estar un poco confuso pero si nos guiamos con las imágenes no hay pierde...
Cada linea de código tiene una pequeña descripción, para saber que acción realiza, según los aspectos que cambiemos.
Recuerda que los códigos te los dejo AQUÍ, cualquier cosa ya sabes me dejas un comentario y lo resolvemos juntos.Un besito grande y nos leemos luego...


Fuente: este post proviene de Imagina y crea tu mismo, donde puedes consultar el contenido original.
¿Vulnera este post tus derechos? Pincha aquí.
Creado:
¿Qué te ha parecido esta idea?

Esta idea proviene de:

Y estas son sus últimas ideas publicadas:

¡Muy buenas a todos!, hoy estoy muy ilusionada con este post ya que marca el regreso de los artículos semanales al blog, que durante tres meses se mantuvo pausado debido a diversos contratiempos que s ...

Hola, hola Hace ya un tiempo que no me paso por aquí, pero aunque una quiera es imposible entre la escuela y que esto y que lo otro, no se puede abarcar todo verdad, pero no podía dejar pasar una fech ...

Recomendamos

Relacionado

recursos blog tutoriales

Hola! hola!!! Hoy vengo a enseñarte un tutorial para personalizar tu blog, se trata del código html para poner el boton "pin it" pero personalizado. Si tu ya lo tenias puesto en el blog te habrás dado cuenta que desde hace tiempo ya no funciona, ya no te aparece la imagen que tenias puesta y no te deja pinear las fotos :( y eso se debe a que el javascript dejo de funcionar. Por lo visto ...

CSS: Nivel B1

Tener una lista de suscripción es muy importante para captar seguidores más fieles que los que captaríamos en cualquier red social como Twitter o Facebook, sin embargo muchos piensan que una vez hecha la lista vale con pegar el código que nos da nuestro proveedor de e-mail marketing y ya nos lloverán los suscriptores, por lo que nos encontramos páginas con campos de formulario que se presentan con ...

internet redes sociales ➳ personalización de blogs

Hola a todas! ◠‿◠ Os traigo un nuevo tutorial 1. Lo primero es ir a Pinterest y entrar en nuestro perfil. 2. Nos llevará al perfil de nuestra cuenta, seleccionamos el tablero que deseamos incluir. 3. En la parte superior seleccionamos "Crear Wigdet" 4. Seleccionaremos "Tablero" y más abajo nos dará el código que debemos copiar para nuestra entrada. Nos vamos a nuestra entr ...

Tutorial

Tener una lista de suscripción es muy importante en el camino de convertirse en un Blogger de éxito, sin embargo muchos piensan que una vez hecha la lista vale todo el resto, por lo que nos encontramos páginas con campos de formulario que se presentan con el aspecto predeterminado que les da el navegador, evitar esta catástrofe en WordPress es sencillo, ya que contamos con plugins que nos facilita ...

El fundador y director de la compañía estadounidense Coinbase, Brian Armstrong , reveló a través de un entrevista con TechCrunch que se agregarán más criptomonedas al servicio porque han ido surgiendo muchas entidades descentralizadas cada una con su token. "Tiene sentido que muchas compañías creen sus propios tokens. Cada proyecto de código abierto, cada organización benéfica, cada fondo, o ...

Tutoriales numero oculto

Una de las consecuencias de vivir en el mundo actual es que la información se extiende rápidamente alrededor del mundo por lo que cada vez más cuidadosos con nuestra información personal. Existen muchas razones para querer llamar con número oculto, pero la principal es usualmente mantener nuestra anonimidad y evitar compartir nuestro número personal con cualquier persona a la que llamemos e impedi ...