i'm using the Casper theme on Wordpress. It displays a header image across the whole site, however i'd like it to display the featured image when viewing a post.
I've found the code below in header.php
<header id="masthead" role="banner" class="site-head site-header" <?php if(get_header_image() ) : ?>style="background-image: url(<?php header_image(); ?>);"<?php endif ?>>
Any help would be much appreciated.
Thanks
you can try something like this
<?php
if ( is_singular() && has_post_thumbnail( $post->ID ) && ($image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'post-thumbnail' ) ) && $image[1] >= HEADER_IMAGE_WIDTH ) :
echo get_the_post_thumbnail( $post->ID );
elseif ( get_header_image() ) : ?>
<img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />
<?php endif; ?>
Related
I'm trying to use WordPress' new custom logo feature to accomplish the following:
Display a default/fallback logo.
If WordPress version supports custom logo, allow user to replace the default/fallback logo with a custom logo in the Customizer.
If WordPress version doesn't support custom logo or no custom logo is set (or it is removed), display default/fallback logo.
So far, this is best code I have to work with:
<?php if ( function_exists( 'the_custom_logo' ) ) : ?>
<?php if ( has_custom_logo() ) : ?>
<?php the_custom_logo(); ?>
<?php else : ?>
<h1 class="site-title"><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png" alt="<?php bloginfo( 'name' ); ?>" width="100" height="50" /></h1>
<?php endif; ?>
<?php else : ?>
<h1 class="site-title"><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png" alt="<?php bloginfo( 'name' ); ?>" width="100" height="50" /></h1>
<?php endif; ?>
Is there a cleaner or more efficient way of doing this without repeating the code for the fallback image twice?
Thanks but I think I found a better solution:
<?php if ( function_exists( 'the_custom_logo' ) && has_custom_logo() ) : ?>
<?php the_custom_logo(); ?>
<?php else : ?>
<h1 class="site-title"><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png" alt="<?php bloginfo( 'name' ); ?>" width="100" height="50" /></h1>
<?php endif; ?>
You can test both function_exist() and has_custom_logo() in same if condition for getting a single else condition.
$logo = ( ( function_exists( 'the_custom_logo' ) ) && ( has_custom_logo() ) ) ? the_custom_logo() : null;
if ($logo) {
echo $logo;
} else {
echo '<h1 class="site-title"><img src="' . get_stylesheet_directory_uri() . '/images/logo.png" alt="' . bloginfo( 'name' ) . '" width="100" height="50" /></h1>';
}
I don't understand how I get an default image from theme folder when Option Tree logo is not selected.
<div id="logo-section">
<?php if ( function_exists( 'ot_get_option' ) ) : ?>
<?php $logo = ot_get_option( 'pp_logo_upload' ); ?>
<a href="<?php bloginfo('url'); ?>">
<img src="<?php echo $logo; ?>" class="logo" />
</a>
<?php endif; ?>
Option Tree accepts a second parameter for ot_get_option that is the default in case no option is saved.
<?php if ( function_exists( 'ot_get_option' ) && ( $logo = ot_get_option( 'pp_logo_upload', 'some-image.png' ) ) != '' ){ ?>
<div id="logo-section">
<img src="<?php echo esc_attr( $logo ); ?>" class="logo" />
</div>
<?php } ?>
I trying to display a different logo for a page in a wordpress site.
I have the default Logo theme, and i want to insert a different logo for a page.
here is the code that manage the logo display in the theme file:
<a href="<?php echo home_url() ?>/" title="<?php bloginfo( 'name' ) ?>" class="logo <?php if ( empty( $logo ) || $logo_type === 'site-title' ) echo 'text-logo' //xss ok ?>" style="min-width:<?php echo $logo_size['width'] / 2 // xss ok ?>px"><?php
if ( $logo && $logo_type === 'image' ):
?>
<img src="<?php echo esc_url( $logo ) ?> " alt="<?php bloginfo( 'name' )?>" class="normal-logo" height="<?php if ( ! empty( $logo_size['height'] ) ) echo $logo_size['height']/2 // xss ok ?>" style="<?php echo esc_attr( $logo_style ) ?>"/>
<?php
else:
bloginfo( 'name' );
endif;
?
I want to insert a condtional tags function after the img src= like this:
else if(is_page('Name-Page')){
echo '<img src="images/logo-for-page.png" />';
}
I try to insert the funcion directly after the img src but t doesn't work.
Any idea? thank you
<img src="<?php echo ( is_page('Name-Page') ? "images/logo-for-page.png" : esc_url( $logo ) ) ?>" ....
I'm editing the twentytwelve theme of wordpress. I want to have a different header image dependant on category archive page, by the slug name. That isn't really an issue, I lack php knowledge and there is something wrong with my markup, either missing some brackets or a closing php tag, I would be grateful to see what the problem is!
This is the code below, what I'm trying to get it do is when football page is viewed it will have a different image to that page, same with baseball. Every other page will just use the header image that is used in the backend of of the twentytwelve theme options.
<?php $header_image = get_header_image();
if( is_category( 'basball' ) ) :
<img src="banner1.jpg" alt="baseball"/>
elseif( is_category( 'football' ) ) :
<img src="banner2.jpg" alt="football"/>
else ( ! empty( $header_image ) ) : ?>
<img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" />
<?php endif; ?>
Error msg:
Parse error: syntax error, unexpected '<' in /home/topteamf/public_html/wp-content/themes/twentytwelve/header.php on line 60
Thanks all!
You're not closing your PHP tags. You have to separate your HTML and PHP. Like this:
<?php $header_image = get_header_image();
if( is_category( 'basball' ) ) : ?>
<img src="banner1.jpg" alt="baseball"/>
<?php elseif( is_category( 'football' ) ) : ?>
<img src="banner2.jpg" alt="football"/>
<?php elseif( ! empty( $header_image ) ) : ?>
<img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" />
<?php endif; ?>
Okay so here's my issue. I want to be able to toggle between a custom header using get_header_image and Nivo Slider. At one point I had this working, having merged the code into a If...Elseif...Else statement. Now I can't replicate it. The current code display both the header image and the slider beneath it. Any help would be greatly appreciated.
<?php
// 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() ) :
?>
<img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />
<?php
endif;
?>
<div id="slider">
<?php
$tmp = $wp_query;
$wp_query = new WP_Query( array ('post_type'=>'page','post__in'=>array(1814)));
if(have_posts()) :
while(have_posts()) :
the_post();
?>
<?php the_post_thumbnail('nivothumb'); ?>
<?php
endwhile;
endif;
$wp_query = $tmp;
?>
</div><!-- close #slider -->
<?php
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 )
{
echo get_the_post_thumbnail( $post->ID );
}
elseif ( get_header_image() )
{ ?>
<img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height=" <?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />
<?php } ?>