post

Customizing Features and Teasers in Thesis 1.5.1

NOTE: As I’m not using the Thesis theme anymore, I’ll not be in a position to give any more reply and help in this area. Please accept my apology. However, the steps below should still work for Thesis 1.5.1. Here’s a screenshot on my customised Thesis theme: http://www.melvinneo.com/wp-content/uploads/2009/06/thesis.gif

After upgrading to Thesis 1.5.1, I went through hell trying to restore the original ‘Magazine’ look (both with Featured and Teasers posts) and praise God, I finally came out victorious!

I’m writing this tutorial so that you guys don’t have to go through hell just like I did!

Some of the steps below are taken from two sites (see PS). But because I find they’re either missing something or kind of dated. That’s why I’m compiling the steps here.

Here goes…

Features are posts which are displayed normally; Teasers are small boxes which display more limited information about each post, as a way to “tease” your readers into clicking through to read the full post.

PLEASE REMEMBER TO SAVE YOUR SETTINGS AFTER EACH STEP!

1.  Decide how many of each post type you want. Since Teasers display two across by default in Thesis (each taking up half the width of your content area), you should choose an even number of Teasers for optimal results.

2.  On the Reading Settings panel in WordPress, in the field for Blog pages show at most, enter the total of the number of Features and the number of Teasers you’ve decided to display. For example, if you’ve chosen to have three Features and four Teasers, you should enter the number 7 in this field.

Note: This setting will also determine how many total posts display on other multi-post pages, such as your archives, search results, etc. This behavior is controlled by WordPress, not Thesis.

3.  Go to “Appearance” followed by “Thesis Custom Programming” and copy and paste the following code to the last available space:

//Featured Post
function featurecontent() { ?>
	<div id="my-feature-box">
		<?php $my_query = new WP_Query('category_name=featured&showposts=1'); while ($my_query->have_posts()) : $my_query->the_post(); $do_not_duplicate = $post->ID;?>
			<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
			<?php the_excerpt(); ?>
			<div class="featurereadmore">
				<a href="<?php the_permalink() ?>" rel="bookmark" title="Read the full article">Read the full article &rarr;</a>
			</div>
		<?php endwhile; ?>
	</div>
<?php
}
add_action('thesis_hook_feature_box', 'featurecontent');

Note that the number ’1′ in ‘showposts=1′ means only 1 featured post will be displayed. If you want 2, just change it to 2, so on and so forth.

4.  If you don’t like the plain  look, you can change the featured post by changing the custom_css. Here are the css codes I added to make it look like what it is now. Go to “Appearance” followed by “Thesis Custom Styling” and copy and paste the following codes to the last available space:

/* Featured Post Formatting */
.custom #my-feature-box { font-family: Helvetica,Arial,sans-serif; color: #222222; background: #aaaaaa; padding: 22px 15px 22px 15px; background: url(i/featured.gif); }
.custom #my-feature-box h2 { font-family: Georgia,"Times New Roman",Verdana; font-size: 2.2em; margin: 0 0 15px 0; }
.custom #my-feature-box h2 a { color: #000000; text-decoration: none; }
.custom #my-feature-box h2 a:hover { color: #000000; text-decoration: underline;}
.custom #my-feature-box p { font-size: 1.4em; line-height:1.571em; text-align: justify;}
.custom #my-feature-box .featurereadmore { padding: 22px 0 0 0; }
.custom #my-feature-box .featurereadmore a { font-size: 14px; text-decoration: none; }

5.  Create a category called, “Featured” and subsequently place the post(s) you want to feature under the “Featured” category. NOTE: Make sure you spell the word “Featured” with the exact spelling and casing like mine. If not, I’m not sure whether it’ll turn up fine or not.

6.  Go to  “Appearance” and in the “Thesis Options” panel, under Home Page“, expand the “Home Page Display” section. For Number of featured posts to show,  select the number of posts you’ve decided on for Features. I SELECTED ’0′ BECAUSE MY CUSTOM PROGRAM IN STEP 3 OVERRODE THIS OPTION.

7.  Go to “Appearance” followed by “Design Options” and under “Feature Box” expand the “Placement” section. As for me, I chose “In your content column“, “on home page only” and “Above all posts” Right above the “Feature Box” option, there’s a “Teasers” option. You can play with it however you want.

And there’s all to it! Have fun.

Hope my instructions are clear enough so that you guys can cut short your learning curve!

Best regards,
Melvin Neo

PS: The steps above were taken from http://diythemes.com/answers/configure-features-teasers/ and http://www.emptycabinmedia.com/thesis-feature-box/. But because I find they’re either missing something or kind of dated. That’s why I’m compiling the steps here.

Comments

  1. Hey Neil,

    I’ve not been working on Thesis 1.5.1 for a loooooooong time. As such I’m not in a position to help you much. Please forgive me for that.

    Regards,
    Melvin Neo

  2. Hi Melvin,
    Do you know how to tell Thesis to have teasers on the homepage, but have one column dedicated to one category and a second column dedicated to another category?
    What I would like to do is post MANY Christian news articles per day, but not let this drown out my other types of posts on the homepage (posted only twice a week).
    Thanks for any help you can offer.

  3. Hey Penny,

    You know what? Ever since I updated to Thesis 1.6, some of the features in 1.5 are gone. Now I can’t even find the codes I did to the custom programming page. LOL. Therefore, I’m sorry I can’t help you with your question.

    By the way, I’ve visited your site and also the other two sites. Very nice. Especially your “Life As A Mummy” site. I like the logo! :) And I noticed that 2 of your sites have a Google PR of 2! That’s very good. You should learn how to take full advantage of it. Keep it up!

    One more by the way. :) I own a web hosting and web design business and sometimes I may have more projects that I can handle. Are you keen in taking on web design projects? Looks like you’re familiar with WordPress. And many of my sites are designed using the WP platform. Do let me know.

  4. Hi Melvin, thanks for sharing. Any idea how I can create that teaser to be 3 in a row instead of the default 2 in a row?

  5. Thought you might like this link Melvin in case anyone is looking to display teasers one at a time instead of side by side.

    http://diythemes.com/answers/customize-teasers/

    Cheers

    Sonya

  6. Hi Melvin,
    Thanks for taking a look, went back and redone it all, and seems that you are right, I must have missed something. Working great now.

    Cheers

    Sonya

  7. Hey Sonya,

    I’m not sure what do you mean by “it did not work so good.” I thought it looks ok. It’s only kinda empty though because there’s no content. If you’re saying that the “Featured” content did not show up like what it did in focusedonprosperity.com, could it be due to you not having typed in any contents at all? Or maybe you did not put in under the “Featured” category? Or maybe you missed out a step or two? I’m not sure ‘cos I can’t get into your admin area to see.

    Regards,
    Melvin Neo

  8. Hi Melvin,
    I done what you said on this site http://www.focusedonprosperity.com and it worked fantastic. When I done the same thing on this site http://www.about-magnetic-sponsoring.com, it did not work so good. Could you take a look and maybe you might know why it has displayed like it has.

    Cheers

    Sonya

  9. Hi Melvin,
    Yes I mean having them in a row not side by side but also having a box around each teaser. I will keep looking and will post the answer back here for you when I find it.

    Thanks for your reply :)
    Sonya

  10. Hey Sonya,

    If you’re talking about having more than 8 teasers in the homepage like mine, please read Step 2 of this post.

    But if you’re talking about having the teasers to display row by row instead of 2 columns by 2 columns, I haven’t done it before and therefore I’m not in the position to tell you if tweaking Thesis Custom Programming will help. My apologies.

  11. I would like to have my teasers displayed like this website: magneticsponsorings.com. Is there away that I can do this? Love your site and it is so good to have someone who knows what they are doing.

    Cheers

    Sonya

  12. Kathy Stanley says:

    I highlighted the code, did a copy/paste – then removed the line numbers. This time I used the “mouse over” instructions – and it worked.

    Thanks a million – I appreciate it!

    Kathy

  13. Melvin Neo says:

    Hey Kathy,

    I can’t possibly see what you did wrong because there’s no site for me to go to. :)

    How did you copy the codes? Did you move the mouse over, and wait for the 3 small icons to appear and click on the icon with the “<>” sign?

    Anyway, to restore your site, can I suggest you upload the original custom_functions.php and custom.css back into their respective folderS either via your file manager in your Control Panel or FTP?

  14. Kathy Stanley says:

    Ok – I hate to be *that* newbie – but when I cut and paste your code into the custom_functions.php file, as well as the custom.css file, the entire site will no longer load. Not even the admin section…all pages are blank.

    So – can you enlighten me as to what glaring mistake I’m obviously making?

    Thanks.

  15. Thanks for the tutorial, finally a step by step, copy paste and done easy to follow thesis tutorial. I’m going to post this in the forums as the solution to my problem that I submitted. Good Job!

  16. It seems like just putting a new post in the “Featured” category will not really work in a sense that the “Featured” section on the home page will always show the latest post – even it that particular post wasn’t put under the “Featured” category. I think it’s a bug those guys at Thesis have to deal with.

    I have tried following the instructions at http://diythemes.com/answers/configure-features-teasers. But to to no avail. Therefore, I’m using the current steps as set forth in my current post.

    I don’t think you can pull in any picture into the Feature box. As for teasers, if you follow the steps laid out here, I believe it’ll work. Because I’ve tried it out also for another of my Thesis site.

  17. Is there another way to go about putting the feature box together. I thought that if I put my blog in the featured category that it would automatically pull onto a feature box on my home page. The same with the teasers.

    I guess the problem is that I can not get a picture to pull into the feature box and my teasers are not working at all. Any help you can provide would be much appreciated. Thanks!

    Jessica

Trackbacks

  1. [...] Customizing Features and Teasers in Thesis 1.5.1 [...]

  2. [...] Customizing Features and Teasers in Thesis 1.5.1 [...]

  3. [...] Customizing Features and Teasers in Thesis 1.5.1 [...]

  4. [...] Customizing Features and Teasers in Thesis 1.5.1 – Melvin Neo [...]

  5. [...] – Customizing Features and Teasers in Thesis 1.5.1 [...]

  6. [...] – Customizing Features and Teasers in Thesis 1.5.1 [...]

Speak Your Mind

*