I have an image banner in the header of my custom WP theme, on pages only (not posts). I need this banner to be different on the home page. I've created a front-page template and have this:
<?php if (is_front_page()){ ?>
<div class="banner">
<?php if ( get_header_image() ) : ?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
<img src="<?php header_image(); ?>" width="<?php echo esc_attr( get_custom_header()->width ); ?>" height="<?php echo esc_attr( get_custom_header()->height ); ?>" alt="">
</a>
</div><!-- #banner -->
<?php else { ?>
<div class="banner">
<?php if ( get_header_image() ) : ?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
<img src="<?php header_image(); ?>" width="<?php echo esc_attr( get_custom_header()->width ); ?>" height="<?php echo esc_attr( get_custom_header()->height ); ?>" alt="">
</a>
<?php endif; // End header image check. ?>
</div><!-- #banner -->
I'm using the same image twice here just to test, but get a heap of errors. My php isn't great. Can anyone help?
Not much to say here, just replace you're code with this:
<?php if (is_front_page()){ ?>
<div class="banner">
<?php if ( get_header_image() ) : ?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
<img src="<?php header_image(); ?>" width="<?php echo esc_attr( get_custom_header()->width ); ?>" height="<?php echo esc_attr( get_custom_header()->height ); ?>" alt="">
</a>
<?php endif; ?>
</div><!-- #banner -->
<?php } else { ?>
<div class="banner">
<?php if ( get_header_image() ) : ?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
<img src="<?php header_image(); ?>" width="<?php echo esc_attr( get_custom_header()->width ); ?>" height="<?php echo esc_attr( get_custom_header()->height ); ?>" alt="">
</a>
<?php endif; // End header image check. ?>
</div><!-- #banner -->
<?php } ?>
To enlighten a bit:
You forgot a closing } before else {
You were missing an endif; before </div><!-- #banner -->
Related
<div id="page" class="hfeed site">
<?php if ( has_post_thumbnail() && ! post_password_required() ) : ?>
<?php the_post_thumbnail('full');
else: ?>
<div id="headimg"><img class="ImageResize560" src="<?php header_image(); ?>"></div>
I need to use this code, so that I can link the image, same time
<?php if ( has_post_thumbnail() ) : ?>
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail(); ?>
</a>
<?php endif; ?>
Basically I need to link the post thumbnail to homepage... I tried but I get error.. somewhere wrong with "else: ?>"
Here is the code
<div id="page" class="hfeed site">
<?php if ( has_post_thumbnail() && ! post_password_required() ) : ?>
<?php $image_url = home_url( ); ?>
<a href="<?php echo $image_url; ?>">
<?php the_post_thumbnail('full'); ?>
</a>
<?php else : ?>
<div id="headimg"><img class="ImageResize560" src="<?php header_image(); ?>"></div>
I am currently creating a child theme and the logo is not clickable back to the home page where the code is there.
When I click view source it looks as though as it should be
<div class="tb-logo"> <a href="http://localhost:8080/wordpress-child" class="logo">
<img src="http://localhost:8080/wordpress-child/wp-content/uploads/2015/12/trim-logo.png" alt="name of image"></a></div>. This is the header.php page
<header class="top-bar">
<div class="tb-logo">
<?php
/**
* Check if there is a uploaded logo
*/
$kouki_logo = of_get_option( 'kouki_logo' );
if( $kouki_logo ) : ?>
<a href="<?php echo esc_url(home_url()); ?>" class="logo">
<img src="<?php echo esc_url( $kouki_logo ); ?>" alt="<?php bloginfo( 'name' ); ?>">
</a>
<?php else : ?>
<h1><?php bloginfo( 'name' ); ?></h1>
<?php endif; ?>
</div>
<nav id="menu-child" class="t-lightweight" role="navigation">
<span class="menu-detail"></span>
<ul>
<?php wp_nav_menu( array( 'container' => '', 'items_wrap' => '%3$s' ) ); ?>
</ul>
</nav>
</header>
So I'm not quite sure why it's not making the link clickable. I even tried hard coding it as <img src="image"> but with no luck.
It only works when I don't load the child theme. The original looks like this
<header class="top-bar">
<div class="tb-logo">
<?php
/**
* Check if there is a uploaded logo
*/
$kouki_logo = of_get_option( 'kouki_logo' );
if( $kouki_logo ) : ?>
<a href="<?php echo esc_url(home_url()); ?>" class="logo">
<img src="<?php echo esc_url( $kouki_logo ); ?>" alt="<?php bloginfo( 'name' ); ?>">
</a>
<?php else : ?>
<h1><?php bloginfo( 'name' ); ?></h1>
<?php endif; ?>
</div>
<div class="navigation-toggle-wrapper">
<a class="primary-nav-trigger" href="javascript:void(0)">
<span class="menu-icon"></span>
</a>
<nav id="menu" class="t-lightweight" role="navigation">
<span class="menu-detail"></span>
<ul>
<?php wp_nav_menu( array( 'container' => '', 'items_wrap' => '%3$s' ) ); ?>
</ul>
</nav>
</div>
</header>
So it's something to do with the menu classes but I don't know why?
You didn't pass a parameter in the path to home url. Try this:
<a href="<?php echo esc_url(home_url('/')); ?>" class="logo">
<img src="<?php echo esc_url( $kouki_logo ); ?>" alt="<?php bloginfo( 'name' ); ?>">
</a>
Also, since the home page will forever be the (/) path, unless you wanted the logo to lead to a different page that will be dynamic, you can simple hard code it this way:
<a href="/" class="logo">
<img src="<?php echo esc_url( $kouki_logo ); ?>" alt="<?php bloginfo( 'name' ); ?>">
</a>
I would like to know what do i need to add in css to make the logo move in the left position before site-title in WordPress?
// Display Site Title
add_action( 'smartline_site_title', 'smartline_display_site_title' );
function smartline_display_site_title() { ?>
<img src="<?php bloginfo('template_directory');?>/images/AA.gif">
<a href="<?php echo esc_url(home_url('/')); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
<h1 class="site-title"><?php bloginfo('name'); ?></h1>
</a>
<?php
}
This should do it :
Add #logo img{float:left;} code to your CSS and then check.
EDITED
#logo img{float:left;margin-top:-3%;}
#logo .site-title{margin-top:2%;}
<!--logo-floater-->
<div id="logo-floater">
<?php if ($logo): ?>
<a href="<?php print check_url($front_page); ?>" title="<?php print t('Home'); ?>">
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
</a>
<?php endif; ?>
<?php if ($site_name || $site_slogan): ?>
<div class="clearfix">
<?php if ($site_name): ?>
<span id="site-name"><?php print $site_name; ?></span>
<?php endif; ?>
<?php if ($site_slogan): ?>
<span id="slogan"><?php print $site_slogan; ?></span>
<?php endif; ?>
</div>
<?php endif; ?>
</div> <!--EOF:logo-floater-->
This displays the logo first, to switch them try,
<!--logo-floater-->
<div id="logo-floater">
<?php if ($site_name || $site_slogan): ?>
<div class="clearfix">
<?php if ($site_name): ?>
<span id="site-name"><?php print $site_name; ?></span>
<?php endif; ?>
<?php if ($site_slogan): ?>
<span id="slogan"><?php print $site_slogan; ?></span>
<?php endif; ?>
</div>
<?php endif; ?>
<?php if ($logo): ?>
<a href="<?php print check_url($front_page); ?>" title="<?php print t('Home'); ?>">
<img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
</a>
<?php endif; ?>
</div> <!--EOF:logo-floater-->
Alright, so I have this block of code in my current theme:
<div class="content_block">
<?php the_content(); ?>
<div class="<?php echo $left_block; ?>">
<?php $project_photos = get_post_meta( get_the_ID(), 'project_photo_photo' );
if ( $project_photos ) : ?>
<div class="grid_gallery clearfix">
<?php foreach( $project_photos as $project_photo ) { ?>
<figure class="gallery_item featured-thumbnail thumbnail single-gallery-item">
<a href="/brv2/wp-content/files_mf/<?php echo $project_photo; ?>" class="image-wrap" rel="prettyPhoto[gallery]">
<img class="project_photo_photo" width="260" src="/brv2/wp-content/files_mf/<?php echo $project_photo; ?>" alt="<?php the_title(); ?>" />
<span class="zoom-icon"></span>
</a>
</figure>
<?php } ?>
<!--END .slider -->
</div>
<?php endif; ?>
What I need to do is to add a DIV wrap around "the_content" if and only if the $project_photos selector is active, not being a PHP developer this is what I've come up with but it doesn't work:
<div class="content_block">
<?php if ( $project_photos() ) {
echo '<div class="project_description">';
the_content();
echo '</div>';
} else {
the_content();
} ?>
<div class="<?php echo $left_block; ?>">
<?php $project_photos = get_post_meta( get_the_ID(), 'project_photo_photo' );
if ( $project_photos ) : ?>
<div class="grid_gallery clearfix">
<?php foreach( $project_photos as $project_photo ) { ?>
<figure class="gallery_item featured-thumbnail thumbnail single-gallery-item">
<a href="/brv2/wp-content/files_mf/<?php echo $project_photo; ?>" class="image-wrap" rel="prettyPhoto[gallery]">
<img class="project_photo_photo" width="260" src="/brv2/wp-content/files_mf/<?php echo $project_photo; ?>" alt="<?php the_title(); ?>" />
<span class="zoom-icon"></span>
</a>
</figure>
<?php } ?>
<!--END .slider -->
</div>
<?php endif; ?>
If anyone could provide some guidance on how I might accomplish this I would be very grateful.
Thanks in advance.
Can you give this a try?
<div class="content_block">
<?php
$project_photos = get_post_meta( get_the_ID(), 'project_photo_photo' );
if ( $project_photos ) {
echo '<div class="project_description">';
the_content();
echo '</div>';
} else {
the_content();
} ?>
<div class="<?php echo $left_block; ?>">
<?php
if ( $project_photos ) : ?>
<div class="grid_gallery clearfix">
<?php foreach( $project_photos as $project_photo ) { ?>
<figure class="gallery_item featured-thumbnail thumbnail single-gallery-item">
<a href="/brv2/wp-content/files_mf/<?php echo $project_photo; ?>" class="image-wrap" rel="prettyPhoto[gallery]">
<img class="project_photo_photo" width="260" src="/brv2/wp-content/files_mf/<?php echo $project_photo; ?>" alt="<?php the_title(); ?>" />
<span class="zoom-icon"></span>
</a>
</figure>
<?php } ?>
<!--END .slider -->
</div>
<?php endif; ?>
I am running in to an issue with making my own search loop in Wordpress. What I am trying to achieve is that certain circumstances display only certain information:
<?php while ( have_posts() ) : the_post(); echo '<div>'; ?>
<?php if ( in_category('property') ) { ?>
<h3><?php the_title(); ?></h3>
<?php the_field('main-image-description'); ?>
<span class="launch">
<a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'boilerplate' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
<span class="link">click to launch</span>
<span class="launch-icon"></span>
</a>
</span>
<?php } ?>
<?php if ( in_category('all-developments') ) { ?>
<h3><?php the_title(); ?></h3>
<?php the_field('property-description'); ?>
<span class="launch-brochure">
<a href="<?php the_field('pdf-download-all-developments'); ?>" target="_blank">
<span class="link">Download Brochure</span>
<span class="launch-icon"></span>
</a>
</span>
<?php } ?>
<?php if ( is_page() ) { ?>
<h3><?php the_title(); ?></h3>
<?php the_content(); ?>
<span class="launch">
<a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'boilerplate' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
<span class="link">click to launch</span>
<span class="launch-icon"></span>
</a>
</span>
<?php } ?>
<?php echo '</div>'; endwhile; ?>
The issue that arises, is that is will always render one or two empty tags at the top and this ruins the style of it, as each div has a dotted border. Is there a way of telling Wordpress that if not of these conditions are met, then don't display the <div>?
Thanks in advance for any help!
JP
Rearrange your code so you compute the conditions before you output the content like so:
<?php
while ( have_posts() ) : the_post();
$propertyCategory = in_category('property');
$allDevelopmentsCategory = in_category('all-developments');
$isPage = is_page();
$output = ($propertyCategory || $allDevelopmentsCategory || $isPage);
if($output){
echo '<div>';
}
?>
<?php if ( $propertyCategory ) { ?>
<h3><?php the_title(); ?></h3>
<?php the_field('main-image-description'); ?>
<span class="launch">
<a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'boilerplate' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
<span class="link">click to launch</span>
<span class="launch-icon"></span>
</a>
</span>
<?php } ?>
<?php if ( $allDevelopmentsCategory ) { ?>
<h3><?php the_title(); ?></h3>
<?php the_field('property-description'); ?>
<span class="launch-brochure">
<a href="<?php the_field('pdf-download-all-developments'); ?>" target="_blank">
<span class="link">Download Brochure</span>
<span class="launch-icon"></span>
</a>
</span>
<?php } ?>
<?php if ( $isPage ) { ?>
<h3><?php the_title(); ?></h3>
<?php the_content(); ?>
<span class="launch">
<a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'boilerplate' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
<span class="link">click to launch</span>
<span class="launch-icon"></span>
</a>
</span>
<?php } ?>
<?php
if($output){
echo '</div>';
}
endwhile;
?>
This allows you to detect if anything will be output and then uses a div where appropriate.
Can you just move the <div> inside the conditional statements? Like so:
<?php while ( have_posts() ) : the_post(); ?>
<?php if ( in_category('property') ) { ?>
<div> <!-- Open div here !-->
<h3><?php the_title(); ?></h3>
<?php the_field('main-image-description'); ?>
<span class="launch">
<a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'boilerplate' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
<span class="link">click to launch</span>
<span class="launch-icon"></span>
</a>
</span>
</div> <!-- Close div here !-->
<?php } ?>
<?php if ( in_category('all-developments') ) { ?>
<div> <!-- Open div here !-->
<h3><?php the_title(); ?></h3>
<?php the_field('property-description'); ?>
<span class="launch-brochure">
<a href="<?php the_field('pdf-download-all-developments'); ?>" target="_blank">
<span class="link">Download Brochure</span>
<span class="launch-icon"></span>
</a>
</span>
</div> <!-- Close div here !-->
<?php } ?>
<?php if ( is_page() ) { ?>
<div> <!-- Open div here !-->
<h3><?php the_title(); ?></h3>
<?php the_content(); ?>
<span class="launch">
<a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'boilerplate' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
<span class="link">click to launch</span>
<span class="launch-icon"></span>
</a>
</span>
</div> <!-- Close div here !-->
<?php } ?>
<?php endwhile; ?>