Show Title from Header-Picture on MouseOver

  • maurizio

    #2696

    Hi,

    is it possible to show the Title or Alt-Tag or Description of a Picture on MouseOver in the article-picture. I’ld like to show the copyright information of used pictures.

    Anonymous

    #21539

    Title of the image will show upon you hover on image. So you can use it to show copyright info.

    kladtiator

    #21540

    Thats right, but i think i’ve described my problem in a wrong way. I’m talking about the Picture in the header.

    I think in the header.php it is referenced in $header_img the page-source is generated with <div id=”header” style=”background-image:url(<?php echo $header_img; ?>);”>

    The result is <div id=”header” style=”background-image:url(http://blog.kladt.net/wp-content/uploads/2011/12/suchlupe-960×198.jpg);”>

    I think, this should be <div id=”header” style=”background-image:url(http://blog.kladt.net/wp-content/uploads/2011/12/suchlupe-960×198.jpg alt=TEXT1″ title=”TEXT2″);”> to display something on MouseOver. I think, TEXT1 should be something like <?php echo $header_alt; ?> and TEXT2 <?php echo $header_title; ?>

    BUT I’M NOT SURE. I don’t have experiences in programming PHP and scripting CSS or HTML.

    Furthermore i’ld like to link the header-background images to a special copyright-page, not to the homepage.

    Anonymous

    #21541

    You’re on the right track. I don’t think there is an easy way to add a title attribute to the header image without hard-coding. Which means you will need to manually make the adjustment everytime a new graphene version is released.

    I keep a log of any changes I make to core files. So, when it’s time to update, I know what I have to go back and change. I don’t reccomend this for the average user… but for the more advanced, this is the workaround I have used.

    Question… are you using only one header image? If you are rotating header images, it’s going to be difficult coding each one to show a different hover text.

    kladtiator

    #21542

    I try to use a unique header for every post. It should have something to do with the posts content.

    I also think it is hard coding. And i think there will be only two lines to include. As i understand, the problem is, that the banner is a background-image and not a normal image with special size. Normal images will show their title, but with background images, this behaviour normaly don’t make sense and isn’t implemented.

    At last there are 3 questions:

    1 – how to get the background-image title

    2 – how to get background-image alt-tag

    3 – how to show the title in MouseOver-Window. That seems to be not a regular option for background-images. As workarround i have the idea to show a normal blank, transparent image in the same area. Then MouseOver will show the tag belonging to it and the background-image.

    Mod

    Kenneth John Odle

    #21543

    How are you using a unique header for each post? Is it through the “use featured image as header image” function?

    Mod

    Kenneth John Odle

    #21544

    You might want to look at this plugin:

    http://wordpress.org/extend/plugins/header-image-description/

    Not sure if it will work for you, but it’s a start.

    kladtiator

    #21545

    I have a german version. But yes, i use featured picture oder first picture in post as header-image.

    Mod

    Kenneth John Odle

    #21546

    Okay, that’s good, because you can easily add a title attribute to a featured image.

    $header_img is a PHP variable. If you look at Graphene’s functions.php file, it’s defined on lines 1862-1866:

    $header_img = get_the_post_thumbnail( $post_id, 'post-thumbnail' );
    $header_img = explode( '" class="', $header_img);
    $header_img = $header_img[0];
    $header_img = explode( 'src="', $header_img);
    $header_img = $header_img[1]; // only the url

    So the question may be how to redefine this function in a child theme to include the title attribute.

    kladtiator

    #21547

    Sounds good – but, as i said, i am not an experienced programmer. My last code is from 1993 – c++, c 😉

Viewing 10 posts - 1 through 10 (of 14 total)

You must be logged in to reply to this topic.

Do NOT follow this link or you will be banned from the site!