jeudi 4 février 2016

Moving Page/Post Titles outside the Loop in WordPress

I have a client site running on WordPress. It uses WooThemes Canvas as its base theme (with a customized child theme), and utilizes the Time.ly All-in-one-Event Calendar. It can be viewed here.

The design I came up with required me to move the page/post titles outside the main content area. I followed the instructions on this WooThemes customization document, and made modifications based on the comments so that it would also work for posts and the Time.ly event postings. The entries in my functions.php file looked like this:

add_filter( 'the_title', 'woo_custom_hide_single_post_title', 10 );
function woo_custom_hide_single_post_title ( $title ) {
    if ( is_singular( array( 'post', 'ai1ec_event' ) ) && in_the_loop() ) { $title = ''; }

    return $title;
} // End woo_custom_hide_single_post_title()

add_filter( 'the_title', 'woo_custom_hide_single_page_title', 10 );

function woo_custom_hide_single_page_title ( $title ) {
    if ( is_page() && in_the_loop() ) { $title = ''; }

    return $title;
} // End woo_custom_hide_single_page_title()

// Add Titles above Content Area on all Posts & Pages

add_action( 'woo_content_before_singular-post', 'woo_custom_add_title', 10 ); 
add_action( 'woo_content_before_singular-ai1ec_event', 'woo_custom_add_title', 10 );
add_action( 'woo_content_before_singular-page', 'woo_custom_add_title', 10 ); 

function woo_custom_add_title () {
    if ( ! is_page_template(array('template-biz.php', 'template-brewpub.php')) ) {
        global $post;
        $title = '<h1 class="page-title">' . get_the_title( $post->ID ) . '</h1>' . "";
        echo '<div id="title_container"><header class="col-full">';
        echo $title;
        woo_post_meta();
        echo '</header></div>';
    }
} // End woo_custom_add_post_title()

This produced some undesirable results, which can be seen on the DEV site I setup for this post (dev.thebrewworks.com):

  1. Since the Time.ly event calendar also uses the_title to display it's events, in the three instances I used the calendar inside a page loop (the homepage and the two restaurant location pages), the event titles don't show up. This was confirmed by creating a Test Page (http://ift.tt/1K0r8JE), where you can see two instances of the calendar inside the loop, and one outside (in the sidebar). The two instances in the Loop have no titles, while the sidebar does.
  2. Supressing the_title in the Loop didn't suppress the Post Meta, which still shows up in the main content area, but reposting the_title to the new DIV I created outside the Loop shows it as well, so I was left with two instances of the Post Meta.

In order to get the site live I had to make some concessions in my functions.php file:

// Hide Titles on All Posts & Pages

add_filter( 'the_title', 'woo_custom_hide_single_post_title', 10 );
function woo_custom_hide_single_post_title ( $title ) {
    if ( is_singular( array( 'post', 'ai1ec_event' ) ) && in_the_loop() ) { $title = ''; }

    return $title;
} // End woo_custom_hide_single_post_title()

add_filter( 'the_title', 'woo_custom_hide_single_page_title', 10 );

function woo_custom_hide_single_page_title ( $title ) {
    if ( is_page() && in_the_loop() && is_page_template( array('page.php', 'template-contact.php' ) ) ) { $title = ''; }

    return $title;
} // End woo_custom_hide_single_page_title()

// Add Titles above Content Area on all Posts & Pages

add_action( 'woo_content_before_singular-post', 'woo_custom_add_title', 10 ); 
add_action( 'woo_content_before_singular-ai1ec_event', 'woo_custom_add_title', 10 );
add_action( 'woo_content_before_singular-page', 'woo_custom_add_title', 10 ); 

function woo_custom_add_title () {
    if ( ! is_page_template(array('template-biz.php', 'template-brewpub.php')) ) {
        global $post;
        $title = '<h1 class="page-title">' . get_the_title( $post->ID ) . '</h1>' . "";
        echo '<div id="title_container"><header class="col-full">';
        echo $title;
        woo_post_meta();
        echo '</header></div>';
    }
} // End woo_custom_add_post_title()

// Disable Post Meta
function woo_post_meta() {}
?>

Note the changes:

  1. I disabled the post_meta completely. Not exactly what I was looking for, but better than having it show up twice.
  2. I modified the function that disables the page title so that it only works on pages that use certain templates (the three instances I mentioned above use the Business Template in Canvas that already suppresses the page title). This would require me to go in and add each new page template that I want to suppress the title on, though...and on top of that, it's not working. Take a look at the live site. The page title is showing up twice on static pages. Once inside the white content area and once outside in the yellow header.

I'm no PHP-developer...I'm more of an Design/HTML/CSS person. I know enough to be dangerous...how to modify existing code, etc., but not necessarily how to write my own from scratch. I have no idea if the way I came up with things is even the best/most elegant way to go about it. Now that you have all the facts, here are my questions:

  1. In an ideal world, the Post Meta would ONLY show up on the blog entries (not on the calendar entries...no need for them there, really), and OUTSIDE the main content area underneath the page title that I moved. How can I achieve this? For the life of me I can't understand why it's showing up twice.
  2. How can I suppress the_title that shows up at the top of the content area on ALL static pages, regardless of template, but have it not affect instances of the_title that appear elsewhere in the loop (like the calendar syndication). In my head there has to be a way to indicate that you ONLY want to disable the_title if it's in a certain div/id, etc., but again...only enough to be dangerous, unless I see it done elsewhere, I can't come up with the solution on my own.

Thanks in advance for your input.



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire