Dynamic Headliner/Footliner

You know what’s cool? Something that isn’t boring. No one likes boring.

Don’t let your Headliner/Footliner bore people to death. Make them dynamic. Deliver messages that are tailored to each individual page on your site.

It’s pretty easy.

How to make your Headliner or Footliner content change on each page

First things first, you need to be using a child theme to do this. Do not edit the core Volatyl files.

Open up your child theme’s functions.php file and add the following code just before the closing ?> tag (or at the end of the file if there is no closing PHP tag):

// Dynamic Headliner
function dynamic_headliner() {
    if ( is_home() || is_front_page() ) { ?>
        <p>This is either the blog home or the front page of your site.</p>
    <?php 
    } elseif ( is_page() ) { ?>
        <p>This is a Page.</p>
    <?php 
    } elseif ( is_single() ) { ?>
        <p>This is a Post.</p>
    <?php 
    } elseif ( is_archive() ) { ?>
        <p>This is an archives page.</p>
    <?php 
    } else {  ?>
        <p>This is anything that has not been specified.</p>
    <?php 
    }
}
add_action( 'vol_headliner', 'dynamic_headliner' );

What we’re doing here is using an else/if statement to say, “If this is the homepage, display this […]. If this is a WordPress page, display this […]. If this is a single post, display this […]. If this is an archives page, like categories or tags, display this […]. Lastly, if this is anything that has not be specified previous, display this […].

Simple, right?

That’s a pretty basic else/if statement. You can go in more depth by targeting specific categories, pages, and even certain posts by using the WordPress Conditional Tags.

If you have the time to dedicate to it, and you don’t mind super long functions files, you could even have a different message on every single page of your website.

How to target a single Post or Page

Here’s an example of how you could use the WordPress Conditional Tags to add a Footliner to a specific page on your website:

// Contact Page Footliner
function contact_footliner() {
	if ( is_page( 'contact' ) ) { ?>
		<p>This is only shows on a Page with a slug of "contact"</p>
	<?php }
}
add_action( 'vol_footliner', 'contact_footliner' );

You can also target a single post or page with with its Post ID. Here’s how.

Create your Page, give it a title, and publish the page.

When the Page saves, you will be given a URL (permalink) to your Page just below the title field. To get the “Post ID” of this page, you will need to hover over the “Edit” button located right next to your permalink. When you do so, somewhere on your modern browser will display the URL destination of the link you are hovering over.

It will look something like this:

http://example.com/wp-admin/post.php?post=165&action=edit&mes…

The red number is what you will need. Then, using the WordPress Conditional Tags format, you can target the Page like this:

// Contact Page Footliner
function contact_footliner() {
	if ( is_page( '165' ) ) { ?>
		<p>This is only shows on a Page with a slug of "contact"</p>
	<?php }
}
add_action( 'vol_footliner', 'contact_footliner' );

The same works for single posts is_single().

How about multiple pages and posts… but not all?

That’s easy too. All you have to do is use an array to list the slugs, Post IDs, or whatever you want to target with. Check it out:

// Random Page, Contact Page, and About Page Footliner
function multiple_footliners() {
	if ( is_page( array( '120', 'contact', 'about' ) ) ) { ?>
		<p>This is only shows on a Page with a Post ID of 120, or a slug of "contact," or "about."</p>
	<?php }
}
add_action( 'vol_footliner', 'multiple_footliners' );

Folks, this works with any hook. Actually, you can do this with any kind of PHP you’re writing. WordPress Conditional Tags can target any page on your website if you use the conditionals creatively.

Happy coding! 🙂

Return to docs