• Resolved LClark52

    (@lclark52)


    Hi,

    I’d like to wrap custom headers/featured images in a div; however, I don’t want a div if there’s no image in it. Does anybody know how to go about it.

    Here is my site:
    https://www.unfairvantage.byethost5.com/?p=1

    As you can see, there’s gap between the logo and the title which is created by <div id=”banner-container”> I added to the header.php. How can I code it, so when there’s no image, the div is prevented from showing.

    Here’s my code:

    <div id="banner-container"><!-- #banner-container div was added -->
    			    <?php
    					// Compatibility with versions of WordPress prior to 3.4.
    					if ( function_exists( 'get_custom_header' ) ) {
    						// We need to figure out what the minimum width should be for our featured image.
    						// This result would be the suggested width if the theme were to implement flexible widths.
    						$header_image_width = get_theme_support( 'custom-header', 'width' );
    					} else {
    						$header_image_width = HEADER_IMAGE_WIDTH;
    					}
    
    					// Check if this is a post or page, if it has a thumbnail, and if it's a big one
    					if ( is_singular() && current_theme_supports( 'post-thumbnails' ) &&
    							has_post_thumbnail( $post->ID ) &&
    							( /* $src, $width, $height */ $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'post-thumbnail' ) ) &&
    							$image[1] >= $header_image_width ) :
    						// Houston, we have a new header image!
    						echo get_the_post_thumbnail( $post->ID );
    					elseif ( get_header_image() ) :
    						// Compatibility with versions of WordPress prior to 3.4.
    						if ( function_exists( 'get_custom_header' ) ) {
    							$header_image_width  = get_custom_header()->width;
    							$header_image_height = get_custom_header()->height;
    						} else {
    							$header_image_width  = HEADER_IMAGE_WIDTH;
    							$header_image_height = HEADER_IMAGE_HEIGHT;
    						}
    				    ?>
    
    					    <img src="<?php header_image(); ?>" width="<?php echo $header_image_width; ?>" height="<?php echo $header_image_height; ?>" alt="" />
    					</div><!-- #banner-container -->

    Many thanks for your help in advance.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Looks as if you should check for a header image to begin with and only process all that markup and stuff if you have one. You may have just edited this check out by mistake.

    <?php
    // Check to see if the header image has been removed
        $header_image = get_header_image();
    
        if ( $header_image ) :
    ?>
    
    {...} ALL THE CODE YOU POSTED PUT IN BETWEEN THIS CHECK
    
    <?php endif; // end check for removed header image ?>
    <?php
    	// Compatibility with versions of WordPress prior to 3.4.
    	if ( function_exists( 'get_custom_header' ) ) {
    		// We need to figure out what the minimum width should be for our featured image.
    		// This result would be the suggested width if the theme were to implement flexible widths.
    		$header_image_width = get_theme_support( 'custom-header', 'width' );
    	} else {
    		$header_image_width = HEADER_IMAGE_WIDTH;
    	}
    
    	// Check if this is a post or page, if it has a thumbnail, and if it's a big one
    	if ( is_singular() && current_theme_supports( 'post-thumbnails' ) && has_post_thumbnail( $post->ID ) &&
    	( /* $src, $width, $height */ $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'post-thumbnail' ) ) &&
    	$image[1] >= $header_image_width ) {
    		// Houston, we have a new header image!
    ?>
    		<!-- #banner-container div was added -->
    		<div id="banner-container">
    			<?php echo get_the_post_thumbnail( $post->ID );?>
    		</div>
    		<!-- #banner-container -->
    	<?php
    
    	} elseif ( get_header_image() ) {
    		// Compatibility with versions of WordPress prior to 3.4.
    		if ( function_exists( 'get_custom_header' ) ) {
    			$header_image_width  = get_custom_header()->width;
    			$header_image_height = get_custom_header()->height;
    		} else {
    			$header_image_width  = HEADER_IMAGE_WIDTH;
    			$header_image_height = HEADER_IMAGE_HEIGHT;
    		}
    	?>
    <!-- #banner-container div was added -->
    <div id="banner-container">
    	<img src="<?php header_image(); ?>" width="<?php echo $header_image_width; ?>" height="<?php echo $header_image_height; ?>" alt="" />
    </div>
    <!-- #banner-container -->
    <?php	}//End of elseif header image check ?>

    Actually after looking at what you where wanting to do closer. This may give you what you are looking for.

    Thread Starter LClark52

    (@lclark52)

    Ricoh,

    I don’t know how to appreciate your help. I spent the whole day yesterday trying to figure that out. Your code worked like a charm.

    Thank you so very much for your help, time and kindness.

    Have a wonderful day.

    Thanks again.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Remove image DIV if there's no image’ is closed to new replies.