WordPress.org

1. urkekg
   Member
   Posted 9 months ago #

   Default code for header image in TwentyTen is
   <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />

   Now I wish to get header image description and use it for ALT tag.

   The question is: How to get header image description? In functions.php I added this:
   

   'footonsand' => array(
   			'url' => '%s/images/headers/sand_and_foot.jpg',
   			'thumbnail_url' => '%s/images/headers/sand_and_foot-thumbnail.jpg',
   			'description' => __( 'Sand and Foot by Aleksandar Urošević', 'twentyten' )
   		),

   and I wish to get this description Sand and Foot by Aleksandar Urošević to some string, for example to $alt, and then echo $alt to page.

   TIA

2. alchymyth
   The Sweeper
   Posted 9 months ago #

   do you mean:

   get_bloginfo('description')

   http://codex.wordpress.org/Function_Reference/get_bloginfo

3. urkekg
   Member
   Posted 9 months ago #

   No, get_bloginfo('description') returns blog tagline. I need description defined in functions.php file for selected header image. Same text that is displayed as tooltip when we hover some header image thumbnail on Headers admin page.

4. urkekg
   Member
   Posted 9 months ago #

   OK, I take a look on wp-admin/custom-header.php and wp-includes/header-image.php, and got this dirty workaround:

   function get_header_image_desc() {
   	global $_wp_default_headers;
   	$header_description = get_bloginfo('description');
   	$header_image = str_replace( get_template_directory_uri(), "", get_theme_mod('header_image') );
   	foreach ( $_wp_default_headers as $header_key => $header ) {
   		if ( str_replace("%s", "", $header['url']) == $header_image ) {
   			$header_description = $header['description'];
   		}
   	}
   	return $header_description;
   }
   
   function header_image_desc() {
   	echo get_header_image_desc();
   }

   Now in place where I wish to put header image description just insert header_image_desc() and homework is done.

   Now this get_image_desc() function need to be enhanced to get description from attachment image, if needed.

5. Si Kord
   Member
   Posted 7 months ago #

   Hi urkekg,

   thanks for this, works for static header images for me. But it does not for random headers (like the random ones, wp offers, so no uploaded ones but hardcoded in functions.php)

   Do you have a way how that could work? I always just get the get_bloginfo('name') . ": " . get_bloginfo('description'); part but no description is used.

   I tried to go through that but I'm still confused by the different variables...

   Thanks!

6. urkekg
   Member
   Posted 7 months ago #

   Sorry but right now, when random header image is active, we can't get which image is chosen outside header_image() call (part of theme.php core file), so we can't get description from header images array.

7. Si Kord
   Member
   Posted 7 months ago #

   Hi, thanks for your reply.

   I mean we get the image url as return from the header_image(). Couldn't it work somehow to cross-check that url matching one of the array entries and get this description then?

   Sorry for not proposing any code - the result of a combination of being short in time and being a php noob...

8. urkekg
   Member
   Posted 7 months ago #

   Well, header_image() echoes image URL, but I think that we can set URL to variable with get_header_image(), and then echo that URL for src attrib, and call modified get_header_image_desc() with that URL as param.

   I'll post code latter from laptop, now I'm on my phone.

9. Si Kord
   Member
   Posted 7 months ago #

   Cool, thank you!

   looking forward to try that out.

10. Si Kord
    Member
    Posted 7 months ago #

    Hi urkekg,

    do you have that code for me? Did it work that way?

11. urkekg
    Member
    Posted 7 months ago #

    OK, here is dirty workaround (please first make backup of your function.php and header.php files from theme directory, if something goes wrong) :)

    In functions.php add new function:
    

    function my_get_random_header_image() {
    	global $_wp_default_headers;
    
    	$header_image_mod = get_theme_mod( 'header_image', '' );
    	$headers = array();
    
    	if ( 'random-uploaded-image' == $header_image_mod )
    		$headers = get_uploaded_header_images();
    	elseif ( ! empty( $_wp_default_headers ) ) {
    		if ( 'random-default-image' == $header_image_mod ) {
    			$headers = $_wp_default_headers;
    		} else {
    			$is_random = get_theme_support( 'custom-header' );
    			if ( isset( $is_random[ 0 ] ) && !empty( $is_random[ 0 ][ 'random-default' ] ) )
    				$headers = $_wp_default_headers;
    		}
    	}
    
    	if ( empty( $headers ) )
    		return '';
    
    	$random_image = array_rand( $headers );
    	$header_url = sprintf( $headers[$random_image]['url'], get_template_directory_uri(), get_stylesheet_directory_uri() );
    
    	define( 'HEADER_IMAGE_DESC', $headers[$random_image]['description'] );
    
    	return $header_url;
    }

    Then in header.php replace line
    <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="<?php header_image_desc(); ?>" title="<?php header_image_desc(); ?>" />
    with this code:
    

    if ( is_random_header_image() ) { ?>
    <img src="<?php echo my_get_random_header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="<?php echo HEADER_IMAGE_DESC; ?>" title="<?php echo HEADER_IMAGE_DESC; ?>" />
    <?php } else { ?>
    <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="<?php header_image_desc(); ?>" title="<?php header_image_desc(); ?>" />
    <?php } ?>

    I hope this will help you.

12. Si Kord
    Member
    Posted 7 months ago #

    Cool, thanks! That works perfectly for me!

13. photocurio
    Member
    Posted 4 months ago #

    hm.. can't get this to work. no descriptions show up.

    site is here: http://maureenwhitingco.org/

14. urkekg
    Member
    Posted 4 months ago #

    As I noticed in my initial post, HID takes description from functions.php hardcoded descriptions and nothing to do with image description from media library. So, you need to set description like this:

    'footonsand' => array(
'url' => '%s/images/headers/sand_and_foot.jpg',
'thumbnail_url' => '%s/images/headers/sand_and_foot-thumbnail.jpg',
'description' => __( 'Sand and Foot by Aleksandar Urošević', 'twentyten' )
),

    For post image header descriptions WP already work w/o HID.

15. photocurio
    Member
    Posted 4 months ago #

    hey thanks, urkeg. I think I get it now. but my code editor doesn't like the footonsand array.

    Is that really the whole code snippet, starting with the single quote and ending with the comma?

16. urkekg
    Member
    Posted 4 months ago #

    Well, that is only a middle part for one image of full array for all header images. Comma on the end isays that after that image we have another one. Here is shortened full syntax for image header array in functions.php:

    // Default custom headers packaged with the theme. %s is a placeholder for the theme template directory URI.
    	register_default_headers( array(
    		'gnu' => array(
    			'url' => '%s/images/headers/bluewildebeestakagnubyjonmountjoy.jpg',
    			'thumbnail_url' => '%s/images/headers/bluewildebeestakagnubyjonmountjoy-thumbnail.jpg',
    			/* translators: header image description */
    			'description' => __( 'Blue Wildebeest aka Gnu by Jon Mountjoy', 'twentyten' )
    		),
    		'berries' => array(
    			'url' => '%s/images/headers/berries.jpg',
    			'thumbnail_url' => '%s/images/headers/berries-thumbnail.jpg',
    			/* translators: header image description */
    			'description' => __( 'Berries', 'twentyten' )
    		),
    		'footonsand' => array(
    			'url' => '%s/images/headers/sand_and_foot.jpg',
    			'thumbnail_url' => '%s/images/headers/sand_and_foot-thumbnail.jpg',
    			/* translators: header image description */
    			'description' => __( 'Sand and Foot by Aleksandar Urošević', 'twentyten' )
    		),
    		'mercado_navideno' => array(
    			'url' => '%s/images/headers/mercado_navideno.jpg',
    			'thumbnail_url' => '%s/images/headers/mercado_navideno-thumbnail.jpg',
    			/* translators: header image description */
    			'description' => __( 'Mercado navideño by José Luis Ruiz', 'twentyten' )
    		)
    	) );

17. photocurio
    Member
    Posted 4 months ago #

    urkekg, you did say this is a quick and dirty solution, but nontheless I think this is a poor way to solve the problem. If the Header Images can't supply the description, then its better not to use header images. Putting content into the functions.php file just seems wrong, and I certainly can't expect a client to go adding arrays to the functions file.

    I solved my issue in a different way: I removed the header image code from my header.php file and replaced it with a gallery shortcode. This does everything I need.

    The header file still looks for a Featured Image first, and its easy to load the description from a featured image if its there.

    If there is no featured image, then the hearder runs the gallery shortcode. I can tell it to load just a single image (using the Gallery Extended plugin) and I can specify orderby = random. Image size is full.

    The gallery puts the description in the title tag, and I also styled the caption to show (I'm using this as a photo credit). The only problem I still have here is that it insists on linking the image. You can see this method working in the Maureen Whiting site:
    http://maureenwhitingco.org/

    No header image, just a random one-image gallery!

18. urkekg
    Member
    Posted 4 months ago #

    U don't need to blame me, I'm not WP core developer, just common user :)

    Actualy, if U don't want to hack funtions.php then simply set post thumbnail for every post and page, and U'll get description from media library, and header image will not be used at all. U can even hack header.php to use thumbnail from latest post on index page for header image.

Reply

You must log in to post.