Cómo hacer botones interactivos en WordPress

ramonjosegn · 21 Ene 2011

Recién me dí cuenta que me preguntan dónde están los botones en mi sitio blog en WP, están bien grandes, pero no son interactivos... supongo que eso confunde a los usuarios...

existe alguna forma de darles interactividad? o sea que al pasar el mouse por encima cambien de color, se muevan, griten o algo que dé a entender que están vivos y sirven para algo?

Caymans · 21 Ene 2011

ramonjosegn dijo:
Recién me dí cuenta que me preguntan dónde están los botones en mi sitio blog en WP, están bien grandes, pero no son interactivos... supongo que eso confunde a los usuarios...

existe alguna forma de darles interactividad? o sea que al pasar el mouse por encima cambien de color, se muevan, griten o algo que dé a entender que están vivos y sirven para algo?

No sabria explicarte bien porque no manejo del todo bien CSS, pero dandole un nombre a otro div y poniendo a hover (creo que es asi), le das el nuevo estilo y listo, por ejemplo que se agrande un poquito...

ramonjosegn · 21 Ene 2011

buf, meterme con CSS en wordpress me parece una locura, no habrá un plugin o alguna aplicación online que entregue el código?

Caymans · 21 Ene 2011

ramonjosegn dijo:
buf, meterme con CSS en wordpress me parece una locura, no habrá un plugin o alguna aplicación online que entregue el código?

Te recomendaria no instalar un plugin entero para solo eso... Yo creo que 4 lineas serian faciles de hacer y harian que no debas ponerle un plugin, por lo que el sitio cargaria mas lento y todo lo que implica...

Mario · 22 Ene 2011

ahorita estoy en el cel asi que no puedo ver tu sitio. Pero lo que me parece una locura es preferir usar plugins a simple css...

Como dije no puedo ver tu sitio ahora, mañana lo reviso y edito, pero creo que lo único que necesitas es la pseudo clase hover.

EDIT----

Revise los sitios de tu firma pero no se cuales botones dices ¿que sitio y que botones son?

ramonjosegn · 25 Feb 2011

Efecto Rollover en Imágenes en Wordpress (Images rollover effect)

Finalmente encontré una solución, un híbrido entre CSS y un plugin, se instala el plugin pero el código es manual de todas formas, toca pelear un poco con el código, acá dejo una muestra y la dirección del plugin, por si alguien necesita el dichoso efecto en su sitio wordpress

Insertar CODE, HTML o PHP:

<p style="text-align: center;"><span style="color: #888888;"><a href="http://prueba.html" target="_blank"><img class="aligncenter size-full wp-image-2170 mouseover" title="registrate001" src="http://tudineroefectivo.com/wp-content/uploads/2010/05/registrate001.png" oversrc="http://tudineroefectivo.com/wp-content/uploads/2010/05/registrate002.png" alt="" width="319" height="82" /></a>

WordPress › IMG Mouseover « WordPress Plugins

Canopix · 25 Feb 2011

No carga tu pagina mecacho.. no carga nada.. esta todo en blanco asegurate de corregirlo.. puede ser fatal.

ramonjosegn · 26 Feb 2011

Canopix dijo:
No carga tu pagina mecacho.. no carga nada.. esta todo en blanco asegurate de corregirlo.. puede ser fatal.

Perdona, de qué estamos hablando? mi página web está en flash, tienes los últimos plugins, quizás estás baneado por el servidor (accesos excesivos provocan baneos de IP)? asegúrate de que tu software funcione correctamente y de que usas navegadores populares (que ya he visto personas por acá con problemas por navegar con experimentos como el Chrome)

Mecacho es un proyecto que quiero retomar, pero ha estado abandonado durante todo el 2010, espero poder volver sacarlo a flote con un nuevo enfoque, jamás ha estado offline, está en servidores especiales...

De todas formas no era el tema que estamos tratando...

Candev · 27 Feb 2011

hola gente, puedo ayudar, hacer un efecto hover con css es algo simple y facil, indicame la url de tu blog si queres que te ayude
saludos!

ramonjosegn · 27 Feb 2011

Candev dijo:
hola gente, puedo ayudar, hacer un efecto hover con css es algo simple y facil, indicame la url de tu blog si queres que te ayude
saludos!

gracias por el ofrecimiento, pero necesito el efecto para imágenes, para textos encontré algunos códigos incrustados online

Fabián Rodríguez · 27 Feb 2011

Yo encontré una especie de "framework" para estilizar botones con CSS Enlace eliminado

ramonjosegn · 28 Feb 2011

Está buena la idea, aunque creo que tendrá sus limitaciones por lo que comentan de que sólo son compatibles con WebKIT

dfgonzalez · 28 Feb 2011

No le tengas miedo a CSS que es una pavada!

Suponiendo que todos tus botones son elementos a y son de color rojo:

a { color: red; }

Para que cambien en hover solo haces:

a:hover { font-weight: bold; }

Suerte!

ramonjosegn · 1 Mar 2011

lo que me da miedo no es el css, además como ya dije son imágenes, lo que me da miedo es el php,jajajaja...

Nachitox · 2 Mar 2011

Para hacer el efecto rollover no se necesita para nada modificar PHP, es sólo CSS. Se hace lo que hizo dfgonzalez. En el atributo a puedes ponerle una imagen y en el a:hover cambiar la imagen por otra. O también se le puede añadir opacidad.

ramonjosegn · 4 Mar 2011

Nachitox dijo:
Para hacer el efecto rollover no se necesita para nada modificar PHP, es sólo CSS. Se hace lo que hizo dfgonzalez. En el atributo a puedes ponerle una imagen y en el a:hover cambiar la imagen por otra. O también se le puede añadir opacidad.

precisamente esto es lo que hace el plugin que instalé, con la ventaja de que lo tengo disponible en cualquier parte del sitio web...

Cómo hacer botones interactivos en WordPress

ramonjosegn

Caymans

ramonjosegn

Caymans

Mario

ramonjosegn

Canopix

ramonjosegn

Candev

ramonjosegn

Fabián Rodríguez

ramonjosegn

dfgonzalez

ramonjosegn

Nachitox

ramonjosegn

Temas similares