Soporte » WordPress Avanzado » plugin hover con titulo detrás de la imagen

  • Hola!
    Estoy intentando implementar de alguna manera en mi web un código para que todas las fotos de mi web, al hacer hover, muestren detrás su titulo de manera dinámica, puesto que los plugins que he visto de momento no ofrecen la posibilidad de hacerlo automáticamente.

    Mis conocimientos de programación están un poco limitados pero creo que se lo suficiente para implementarlo.

    ¿Sabéis cual es la mejor manera de hacerlo?
    Mil gracias de antemano!!

    La página con la que necesito ayuda: [accede para ver el enlace]

Viendo 9 respuestas - de la 1 a la 9 (de un total de 9)
  • Hola @isabelgalvez , cuandó decís «titulo»¿Te referís al atributo titulo de la imagen?

    <img src="image.jpg" alt="Texto Alternativo" title="Titulo de la imagen» />
    Para hacerlo, debés agregar un título a la imagen en el editor de WordPress.

    ¿Tiene sentido?

    Hola @developress
    Si, me refiero al atributo título de la imagen.
    Quiero que al hacer hover sobre la imagen, aparezcan el título y el alt de la imagen.
    ¿Sabrías si hay alguna información sobre cómo hacerlo?
    Muchas gracias de antemano!

    Si, claro.

    Cuando subís la imagen a WordPress, se puede hacer todo desde la edición en el panel derecho del editor. Cargá los datos de alt y título. Te paso un screenshot.

    Ver screenshot: https://snipboard.io/PdOpyz.jpg

    Después automáticamente los va a mostrar cuando hagas hover con el mouse.

    También podés hacerlo para cada imagen desde la galeria multimedia de WordPress
    1) Ir a Multimedia
    2) Seleccionar la imagen
    3) Completar los datos

    Como cargarlo desde Multimedia: https://snipboard.io/dzkeuv.jpg

    Hola @developress ,
    muchas gracias por vuestro tiempo,
    a lo que me refiero es a que quiero programar un código para que quede algo así:
    http://commune.archi/

    Imaginé que podría crear otro div debajo de la imagen (todo esto en los archivos de wordpress via ftp) y extraer el alt y el titulo para que así, al hacer hover en cada imagen que se suba, se vea el titulo de la imagen y una descripción.

    Lo que pasa es que no encuentro mucha información en internet sobre esto y me preguntaba si vosotros podríais saber donde encontrar la información, o si es mejor directamente descargar un plugin que te lo haga.

    Gracias de nuevo!!

    Como poder, se puede, vas a tener que usar javascript para extraer esos datos. Plugins que lo hagan no conozco.

    Lo que podés hacer es poner esos datos en una capa overlay que aparezca cuando hacés hover como acá: https://www.andersnoren.se/teman/miyazaki-wordpress-theme/ o acá: http://imbalance.wpshower.com/

    Acá explican como hacerlo: https://www.w3schools.com/howto/howto_css_image_overlay_title.asp

    Moderador LGrusin

    (@lgrusin)

    @isabelgalvez el ejemplo que has puesto no tiene nada que ver con el title. Son dos cajas una encima de otra exactamente en la misma posición. La segunda es el enlace con un texto que al poner el ratón encima tapa a la imagen.

    hola @lgrusin !,
    quizás no me expliqué bien, mi objetivo final de todo esto es hacer esta tarea de forma automatizada , por eso imaginé que con el codex de wordpress habría que extraer de alguna manera el titulo de la imagen y utilizarlo como variable, para que así, cuando se suba una imagen nueva ya tenga los datos de titulo y descripción cuando haces hover en ella (que efectivamente este hover sería un div o una caja montada debajo o encima de la otra), de ahí que hablara del title.
    En cuanto a la frase de «La segunda es el enlace con un texto que al poner el ratón encima tapa a la imagen.» no entiendo muy bien lo que quieres decir. Si te refieres a la segunda caja o div, sería una caja con texto, sí, pero quiero meter variables en este texto.
    Mi intención de publicar el comentario en este foro es que alguien que sepa más que yo de programación me diga si lo que estoy pensando es una tontería o no, si es realizable, y si pudiera aportar alguna información pues encantada =)
    Gracias

    Hola @developress
    muchas gracias por tu información, esto es lo que quería.
    Ahora buscaré como extraer el título de la imagen para hacer esta tarea automatizada.
    Saludos!!

    Moderador LGrusin

    (@lgrusin)

    @isabelgalvez mi intención era explicarte cómo funciona la página de ejemplo que has puesto. Eso se consigue con HTML Y CSS, es la parte más fácil. Es parecido al que ha puesto @developress de W3Schools pero no es exactamente lo mismo.

    Lo otro que dices de poner el Title de la imagen ya es más complicado. Igual lo mejor es que en vez del Title o el ALT salga el título de la entrada, que es lo que hace la web que has puesto de ejemplo.

Viendo 9 respuestas - de la 1 a la 9 (de un total de 9)
  • Debes estar registrado para responder a este debate.