Tutorial

How To: Create Custom Page Templates in WordPress Thesis

Using the Thesis Theme with WordPress we recently came across a situation where we needed to hide, or not show, the Multimedia Box and 1st sidebar on a certain page and only show the 2nd sidebar.

I thought we could easily achieve this Thesis design change by using a Thesis hook. We’ve used many hooks in the past so I was hoping a hook would exist for replacing the entire Multimedia Box and/or sidebars in the same manner.  While looking on the Thesis Hook Reference List page (http://diythemes.com/thesis/rtfm/hooks) it seems that currently the only hooks that deal with the items I am wanting to change are “thesis_hook_after_multimedia_box”, “thesis_hook_before_sidebar_1” and “thesis_hook_after_sidebar_1” . I didn’t find a “thesis_hook_multimedia_box” hook or a “thesis_hook_sidebar_1” hook like the “thesis_hook_footer” hook we used to directly replace the footer with what we wanted. Hopefully in the future Thesis will ever support such hooks…

function my_multimedia_box() {
echo “tt”, ‘test’, “n”;
}
remove_action(‘thesis_hook_multimedia_box’, ‘thesis_attribution’);
add_action(‘thesis_hook_multimedia_box’, ‘my_multimedia_box’);

After more Google searching i found that Chris Pearson from Thesis created a No Sidebars Page Template that comes packaged with Thesis which is similar to what we want to do. I figured I would create our own custom Page Template we could use instead of the No Sidebars one. I opened “no_sidebars.php” located in the theme directory and saw:

/*
Template Name: No Sidebars
*/

thesis_html_framework();

which told me I would have to hack Thesis core files to achieve what I was set out to do. After looking through the Thesis files I found where Chris Pearson has an “if” statement asking if $page_template == ‘no_sidebars.php’. This code is located in your_theme_folder/lib/html/content.php in the thesis_content() function (the first function in content.php). I saw that for the No Sidebars Page Template a class called “no_sidebars” was assigned to the “content_box” div so i added in my own “elseif” statement. The following code shows my end result of the thesis_content function in content.php: (The only code I changed was adding the elseif)

function thesis_content() {
if (is_page()) {
global $post;
$page_template = get_post_meta($post->ID, ‘_wp_page_template’, true);
}

if ($page_template == ‘no_sidebars.php’) {
echo ‘    <div id=”content_box” class=”no_sidebars”>’ . “n”;
thesis_content_column();
echo ‘    </div>’ . “n”;
}
elseif ($page_template == ‘SideBar2.php’) {
echo ‘    <div id=”content_box” class=”SideBar2″>’ . “n”;
thesis_columns();
echo ‘    </div>’ . “n”;
}
else {
echo ‘    <div id=”content_box”>’ . “n”;
thesis_columns();
echo ‘    </div>’ . “n”;
}
}

Notice that I added my own class called “SideBar2”. I found the “no_sidebars” class in your_theme_folder/lib/css/widths.php and didn’t want to edit two Thesis core files so I added the CSS for my “SideBar2” class in my “SideBar2.php” Page Template as follows:

<?php
/*
Template Name: SideBar2
*/
thesis_html_framework();
?>
<style>
.SideBar2 { background: none !important; }
.SideBar2 #multimedia_box{display:none !important;}
.SideBar2 #sidebar_1 ul.sidebar_list {display:none !important;}
.sidebar{margin-left:212px !important;float:right !important;}
</style>

Finally I just had to assign SideBar2 as a Page Template on any page I wanted to only show the 2nd Sidebar.

 

If you create your own WordPress Page Templates in the Thesis Theme by editing content.php remember that if you upgrade Thesis to a newer version you will lose the functionality you added. Make sure to keep notes of exactly what you edited for future reference. Hopefully as newer versions of Thesis are released they will support more design hooks including better or more robust Page Template capabilities.

UPDATE:  Thesis version 1.4+ now has a custom Page Template option with an associated hook that can be used to accomplish this.  This post was written prior to version 1.4.

30 thoughts on “How To: Create Custom Page Templates in WordPress Thesis

  1. This is exactly why I have a love/hate relationship with Thesis. This mod would be easy as pie in almost any other theme. the only other theme I’ve found that is worse to work with is WPRemix2. That one is a true mess.

    -Brad

    PS: Sorry to be so negative about all of this.

  2. Yea, this is a real pain with Thesis, but I really appreciate you spelling it out so clearly as to how to add a custom page. You just saved me a lot of time…. thanks!!

    Mick

  3. Jen is right. In this case you would use thesis_hook_custom_template, which allows you to do whatever you want with everything between the header and footer. This is something that Thesis does differently than other themes, but I don’t think it is difficult, it just needs a bit of understanding of how the theme approaches things. Admittedly the documentation on how to is a little thin on the ground.

  4. Hello Brian and Kristarella,
    Brian says:
    “UPDATE: Thesis version 1.4+ now has a custom Page Template option with an associated hook that can be used to accomplish this. This post was written prior to version 1.4.”
    I currently have a 3-column Thesis format, and would like to make a custom page template that would show the left column, eliminate the right column, and expand the center column to fill the space vacated by the right column.
    Kristarella says:
    “Jen is right. In this case you would use thesis_hook_custom_template, which allows you to do whatever you want with everything between the header and footer. This is something that Thesis does differently than other themes, but I don’t think it is difficult, it just needs a bit of understanding of how the theme approaches things.”
    I looked at the thesis_hook_custom_template but have no idea how to start this project. Could either of you head me in the right direction? Thanks a lot,
    Bill

  5. Hey Bill,

    You need to create a function and then add that function to the thesis_hook_custom_template hook (as per any additions to the theme).

    Inside the function you need something relating to what’s in lib/html/content_box.php. So, for the 3 column template without the third column…
    echo ‘ <div id="column_wrap">’ . "n";
    ?>
    <div id="content"<?php thesis_content_classes(); ?>>

    <?php
    thesis_hook_before_content();
    thesis_loop_posts();
    thesis_hook_after_content();
    ?>
    </div>

    <?php
    thesis_get_sidebar();
    echo ‘ </div>’ . "n";

    You could replace thesis_loop_posts(); with whatever you want the content of the custom template to be.

    Then you would use the body class given to the specific page to style the column widths. You’d need to add the width of the second sidebar to #content and #column_wrap.

  6. Help. I’m trying to work out to to have certain posts without sidebars whilst retaining them for normal posts.

    This code seems to be at the very heart of Thesis. But I cannot see a way manipulating this code in order to use a custom template for a post.

    Even using kristarella’s advice doesn’t help (I think?) because the thesis_hook_custom_template will only work on pages with the way the “if{} else{}” statements have been written.

    The first statement appears to set the page_template for posts. After searching the WordPress reference pages I can’t see what this $page_template will be set to or how I can influence it:

    if (is_page()) {
    global $post;
    $page_template = get_post_meta($post->ID, ‘_wp_page_template’, true);
    }

    The next statements relies on $page_template being set to one of the Page templates, so even if I create a Post template it will be ignored and sidebars will be entered on my page.

    if ($page_template == ‘no_sidebars.php’ || $page_template == ‘post_no_sidebars.php’) {
    echo ‘ ‘ . “n”;
    thesis_content_column();
    echo ‘ ‘ . “n”;
    }
    else {
    echo ‘ ‘ . “n”;

    if ($page_template == ‘custom_template.php’)
    thesis_hook_custom_template();
    else
    thesis_columns();

    echo ‘ ‘ . “n”;
    }

    I started writing a function but quickly realised that a) I don’t know where/how I’d run it and b) even if I could it would have no affect because of the code above.

    Surely this can’t be right?

    Does anyone know if there is a way to hook into this in an elegant manner, as I’ve found nothing after numerous searches on Google?

    Or is the only way to hack the core code?

    Thanks in advance.

    Pat

  7. Pat, you could try applying a CSS class of “no_sidebars” to those posts under the SEO Options on the post edit page. That will cause the content to be the full page width and then you can hide the sidebar with CSS .no_sidebars #sidebars {display:none;}. Unfortunately the sidebar will still be in the HTML of the page and only hidden to the viewer, but that’s about as easy as it gets. The alternative is to make a new theme template file called single.php and then use if/else to select the posts you want, but you’d also need to copy the PHP for the code surrounding the content area.

  8. Thanks Kristarella!

    I will try this, but will need to do some swat up on CSS. I have implemented a change to create a custom footer I got off another website, so think that should provide a good template of how to implement this 🙂

    I’m using a workaround now with LightBox to display full width images but definitely want to do this for my squeeze landing pages 😉

  9. Hey guys, great insight brian, thanks a lot
    Now to get to the point.
    I have a problem where I too have to edit thesis core files. I want to disable the sidebars on my home page template, and i got miself tangled in the if statements of the content_box.php back in the thesis/lib/html folder.
    I added this code line

    if (is_home() || is_front_page()) {
    $page_template == ‘no_sidebars.php’;
    }

    It doesn’t really do anything. Please help me

  10. @fvr

    You do not need to edit core files to disable sidebars on a home page template. Either use the No Sidebars template on a static home page (set under Settings > Reading) or a custom template and if you have removed the default custom template properly there will only be sidebars if you tell it to have them.

  11. How are you supposed to edit the markup for search results? Why is the documentation for this theme so poor when so many people seem to be paying fo it?

  12. No No… I do know that. But I want to say that i want to make a static page in wordpress. on that page i want to use thesis’s custom template. but i have some requirements.
    The Page Will Not Load Any Javascripts
    The Page Will Not Load Any Externel CSS
    The Page Will Not Load Any Images.

    Can You Please Tell Me How to make that kind of custom template in thesis theme?

  13. Saif, oh, I see. I don’t believe you can do that with the custom template since it only controls the content area.

    You would need to create a file in the root Thesis directory that contains something like:

    <?php
    /**
    * Template Name: Blank Page
    *
    * Blank page with #content_area
    *
    */

    echo apply_filters(‘thesis_doctype’, ‘<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;’) . "n";
    ?>
    <html xmlns="http://www.w3.org/1999/xhtml&quot; <?php language_attributes(); ?>>

    <head profile="http://gmpg.org/xfn/11"&gt;

    <title>PUT YOUR PAGE TITLE HERE</title>

    <meta http-equiv="Content-Type" content="<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’); ?>" />

    </head>

    <body<?php thesis_body_classes(); ?>>

    <?php

    echo ‘<div id="content_area" class="full_width blank">’ . "n";
    echo ‘<div class="page">’ . "n";

    echo ‘ <div id="content_box" class="no_sidebars">’ . "n";
    thesis_content_column();
    echo ‘ </div>’ . "n";

    echo ‘</div>’ . "n";
    echo ‘</div>’ . "n";

    ?>

    </body>
    </html>

    Note that since you’re wanting to exclude CSS etc you can’t use the Thesis way of building the head area and therefore none of Thesis’ fancy SEO options for pages that use that template.

  14. Hi,

    Thanks for this thread!

    I am trying to adjust one page (not post)’s layout. All other pages are 3 column, but for this one I would like it to just be a one or a two column. I’m not sure how to do this. Any help would be greatly appreciated!

  15. so i have the same problem. I will create a template. But this template site show the other under sites. (Title, Pre-Pic, More Tag) I don’t now what to do. can anyone help???

    sry for bad englisch.

  16. Hi,
    I am trying to implement the same for posts and I have decided the only way to do is to make my own custom template file which my post will be using.

    I do not want to code away the entire php codes for my template and would love to save time. Is there a way I can take the php codes from thesis and use it for my custom template and then make the changes on that ?

    Cheers,
    Vishal

  17. what if I want to apply the same custom template to a couple of pages and also to their corresponding sub-pages.
    How should I modify the is_page function?

    thanks, Gustavo

  18. sry its me again. I still have the Problem about the Pre-Pic and template page. How to display at a custom template the Page name and the pre pic???
    Is this possible with is_page???

  19. I tried to edit and created custom templates but later i found out that if you edit “thesis/custom-template” directly (especially if you are using one custom page or home page teaser). There is no need to get frustrated with custom editor.

Have a comment?

Your email address will not be published. Required fields are marked *

accessibilityadminaggregationanchorbackupsbookmarksbuddypresscachingcalendarcaret-downcartunifiedcrediblecustommigrationdesigndevecomfriendsgoodgroupsgrowthhostingideasinternationalizationiphoneloyaltymailhealthmessagingArtboard 1migrationsmultiple-sourcesmultisitenotificationsperformancephoneprofilesresearchscalablescrapingsecuresharearrowarrowsourcestreamsupportunifiedupdatesvaultwebsitewordpress