This post has been marked as old. The code might no longer work. Comments have been disabled as this is no longer maintained. Use the search on the right to find a newer tutorial.
As I’ve been working with Thesis a lot lately, I thought it would be a good idea to start posting some tips for customizing it. If you need help with Thesis or WordPress, please review my WordPress Consulting page.
1. Custom Use of Post Image and Thumbnails
Thesis has a great tool for adding images to posts, and when making customizations you might need to access those images. Thesis stores the URL for the post image in a custom field titled thesis_post_image, so assign it to a variable like this:
global $post;
$post_image = get_post_meta($post->ID, 'thesis_post_image',$single=true);
You can then use $post_image to plug the image url where you want it, like :
<a href="<?php the_permalink() ?>"><img src="<?php echo $post_image ?>" alt="" /></a>
If you would like to use a thumbnail of this image, you’ll need to use the thumb.php script included with Thesis (found in /lib/scripts/thumb.php). There’s five parameters you can use:
- src= url to the image
- w= the width of your thumbnail
- h= the height of your thumbnail
- zc= whether it should zoom (0) or crop (1) the original image
- q= quality, the default is 75 and max is 100
To make a thumbnail, you simply link to thumb.php script and include the parameters. Here’s an example:
<img src="<?php bloginfo('template_url'); ?>/lib/scripts/thumb.php?src=<?php echo $post_image ?>&w=66&h=66&zc=1&q=100" width="66" height="66" alt="Thumbnail image for <?php echo $post->post_title ?>" />
The red part is the link to the thumb.php script, the green is the link to the original image, and blue is the other four parameters defining the thumbnail.
2. Displaying Category Posts on a page
United4Iran.org organized events in over 100 cities, and created a page for each city with relevant information. They wanted a way to show relevant posts on those pages (we define “relevant posts” as posts in a certain category; posts for the Austin, TX page are in the “austin” category). We used a custom function so Thesis could be updated in the future without causing problems to our customizations.
When the client wants to add a post category to a page, he simply adds the category ID to the page’s custom field called custom_cat_page. The page will then list the 10 most recent posts from those post categories, and provide a link to the archive page for more.
I’ll work through the custom function, detailing what each part does (the parts beginning “//” are my comments).
function custom_cat_page() {
global $post;
$temp_query = $post;
// This loads the data on the current post and saves it in $temp_query (so we can get it later)
$postID = $post->ID;
$custom_cat = get_post_meta($postID, 'custom_cat_page',$single=true);
// Save the custom field 'custom_cat_page' to $custom_cat
if($custom_cat){
// If the custom field is in use...
?><?php
$posts = new WP_Query('cat='.$custom_cat.'&showposts=10');
// Get the 10 most recent posts from the specified categories
while ($posts->have_posts()) : $posts->the_post();
?>
<h3><a href="<?php the_permalink() ?>"><?php echo $post->post_title ?></a></h3>
<?php the_excerpt();
// Show the post title and excerpt.
endwhile;
?>
<p><a href="/?cat=<?php echo $custom_cat;?>">View the Archives</a></p>
// Link to the archives page for the categories
<?php
$post = $temp_query;
// Reset $post back to its original content
}
?>
<?php
}
add_action('thesis_hook_after_post','custom_cat_page');
// Add this function after the page's content
RookieMom Whitney says
None of my thumbnails are loading and I'm mystified. I'm not trying to do anything fancy – I just want thumbnails on my archive page. We have set up a sandbox version of my site where I am trying to work this out. Any tips would be tremendously appreciated.
The alt text is showing and the space is reserved in the layout, but the image itself is not loading.
(See category page: http://sandbox.rookiemoms.com/categories/craft/)
Gigi Gerow says
In the code for the post category page…I would like to sort the posts by the title…I know that somewhere
I need to add &orderby=ASC…I just can't quite figure it out.
Thank you for the information. It is very useful.
Alberg says
HI Bill.
Thanks for the tutorial on FCG. I am trying to use the gallery to replace the Thesis multimedia box, so that I can store a dozen images in it, and have them auto rotate. I'd like that to appear on all pages on the site. Any thoughts on how to do that? And one thing I may not be getting – do I have to create a seperate post or page for each image that I want in the gallery? This is different from how I populate the multimedia box – by just dropping images in a folder. Am I missing something? Thanks, Alan
Bill Erickson says
Yes, you'll need to create a separate post or page for each image. This is really designed as a way of highlighting your posts or pages, not to just display images.
If you just want images, google for a jquery image rotator code, then drop that in the custom functions file instead of FCP. You could also use Slideshow Pro (that's what I used on bilpil.com )
Bill Scheider says
Hi Bill
Thanks for this tutorial! I’m wondering how you integrated the slideshow pro into the thesis theme on the bilpil.com site? I’ve got SSP standalone and the Slidepress plugin installed but can’t figure out how to integrate it into Thesis!
Can you help?
Thanks so much
Bill Scheider
Bill Erickson says
On that specific site I just dropped the standalone code in a function and attached it to the feature box. If you’re using SlidePress you can use the handy template tag.
Calin says
Hi,
I'm using http://hellosam.net/lang/zh-hk/project/xlanguage/ for internationalization. Unfortunately your code does not works with the xLanguage plugin.
Calin.
Christine Green says
Bill,
Thanks for this post. I was able to use the code to create a new sidebar. I then added a text widget to that sidebar but is has a bullet "dot" in front of the text (as part of
I believe…?). I can't figure out how to remove that.
I'd appreciate help.
Thanks once again!
Avi D says
Hi Bill,
That’s a great bit of code. As understand it , this code works for
A) Individual posts
B) Page
The reason is I’ve tried this out in a couple of posts to no avail. I’m in sandbox mode or I’d have dropped you a link. I’ve added the php to custom functions and the css to custom.css.
Anything I’m missing here?Thanx…
Avinash D says
Beautiful bit of code. A question:
1) Assuming I wanted only 2 columns of text, how would this be rewritten to slot all text into 2 columns regardless of number of ? What I meant is, assuming I have 3 , I don’t want 3 columns but 2 columns. So I would want the 1st 2 h4’s in column 0 and the 3rd h4 in column 1. The logic would be: Test number of H4. If X>2, take 1 more than half the number of H4 and add to column 0. Add rest to column 1. Hence if 9 H4, 5 h4 to column 0 and 4 h4 to column 1.
Bill Erickson says
All the function does is break <h4>'s into div's, which can then be styled with the custom.css file. So in your instance, I would do page-specific css that was applicable for your specific situation. So on the about page, do something like:
.custom.about #content-0 { }
.custom.about #content-1 { }
…
—
Bill Erickson
WordPress Consultant
https://www.billerickson.net
John says
Hey Bill,
I am trying to implement both of these features into one but am unable to get the image to display. Displaying the post titles and excerpts is working fine, but above the title I am getting an empty imc src call <img alt="" src="">
Basically I would like to have the thesis_post_image output above the Post Title.
This is essentially how they show up on regular category pages using thesis and populating the thesis_post_image.
Do you think you could show me how to add that code?
Marylene says
I have the same issue, did someone have figured it out?
Thanks a lot,
Marylene
colm flanagan says
Hi,
I have been having the same problem from the start with thesis theme and i cant find any help on how to solve it. When i publish a post on the home page the thumbail works 100% but is doesn’t carry over into the category pages….Is there a simple option i am overseeing or is it another issue?? Any advice would be appreciated..
Thanks
Colm
Bill Erickson says
Go to Site Options, and in the Archives dropdown make sure you have either “Everything’s a teaser” or “Same as Homepage” selected.
colm flanagan says
Thanks man, so simple and yet it was giving me a headache…Thanks again..
P.S sorry for submitting the Q twice, very tired 🙂
colm flanagan says
Can any one tell me why my thumbnails dont carry over from my homepage to my category page in the thesis theme?? Im really struggling to find help on this one..Thanks..