WordPress Thesis Theme Customization

When browsing other WordPress blogs with awesome themes, I always find myself wondering how someone handled a particular aspect of the layout or functionality. This is especially true with the Thesis Theme, because of the difference in setup due to the Thesis hooks system. So for anyone browsing Kikolani, I wanted to answer the question of “how did you do that” in a new series on WordPress Thesis Theme Customization.

Part Three B: Posts & Social Bookmarking Icons

There are five main customizations that I have done to my single posts.

Custom Byline with Tweetmeme Button

The first customized item is the custom byline, or the details right under the post title, which shows on the main index page, archives, and single post pages. In Thesis Options, under Display, I set the Byline to include “Show author name in post byline,” “Link author names to archives,” and “Show published-on date in post byline.”

Then, in the custom_functions.php, I add a custom byline function to the Thesis byline item hook using this code:

add_action('thesis_hook_byline_item','custom_byline');

In the custom byline function, I include the following to add the comment count to the byline, and also include the Tweetmeme controls as well to make re-tweeting articles easy:

function custom_byline() {
?>
 in <span class="url fn"><?php the_category(', '); ?></span> | <a href="<?php comments_link(); ?>" class="url fn"><span class="url fn"><?php comments_number('0 Comments','1 Comment','% Comments'); ?></span></a> <div style="float:right;margin-top:-19px;margin-right:-10px;"> <script type="text/javascript"> tweetmeme_url = '<?php the_permalink() ?>'; tweetmeme_style = 'compact'; </script> <script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script> </div>
<?
}

Continue WordPress Thesis Theme Customization Part Three B: Posts & Social Bookmarking

When browsing other WordPress blogs with awesome themes, I always find myself wondering how someone handled a particular aspect of the layout or functionality. This is especially true with the Thesis Theme, because of the difference in setup due to the Thesis hooks system. So for anyone browsing Kikolani, I wanted to answer the question of “how did you do that” in a new series on WordPress Thesis Theme Customization.

Part Three A: Custom Background, Header, Navigation Bar & Sidebar

The best way to make your Thesis website look less out of the box and more custom is through the custom coding. Unlike other WordPress themes where you can go in and edit the various template files (single.php for single posts, index.php or home.php for the homepage, etc.), Thesis gives you two files – custom_functions.php and custom.css. It is within these two files that you do all of your custom coding, from a new navigation menu to an Archive page layout.

There is a plugin that I mentioned in Plugins part of this series, Thesis Openhook, that allows you to either enter coding directly into the custom.css, custom_functions.php or into blocks that are divided up by location in your Thesis theme. So if you want to add something after your default sidebar widgets, there is a box called After Sidebars that allows you to do so.

I have some of my custom coding directly in my custom_functions.php, and other parts of it are in the OpenHook boxes. Part Four A is the coding behind the custom background, header, navigation bar & sidebar on this site.

Background Image

The following code inside the custom.css sets the background image of the website.

body.custom {
background: #8db6b6 url('images/chihuly-colors.jpg') 100% 0 no-repeat;
background-attachment: fixed;
}

Continue WordPress Thesis Theme Customization Part Three A: Custom Coding

When browsing other WordPress blogs with awesome themes, I always find myself wondering how someone handled a particular aspect of the layout or functionality. This is especially true with the Thesis Theme, because of the difference in setup due to the Thesis hooks system. So for anyone browsing Kikolani, I wanted to answer the question of “how did you do that” in a new series on WordPress Thesis Theme Customization.

Part Two: Plugins

One of the things I love about WordPress is that most of the functionality that you are seeking can be found in the plug-ins directory. Most of them (with exception to cForms II) can be found in the WordPress plug-ins directory and installed automatically in WordPress 2.7+ by going into your Admin Panel > Plugins > Add New >. Other plug-ins can be uploaded in .zip format on the Add New Plugins page. Here are the ones that I use – with exception to Thesis OpenHook, these are great suggestions for other themes as well.

  • Add Post Footer – This plugin allows you to add specific content to every post, text and ads. This is where I add in the 468×60 Google Adsense ad along with the “Enjoy this post?…” text at the end of each post. (This plugin isn’t fully necessary, considering I could add it into the custom-functions.php, but I haven’t gotten around to moving it yet. Plus it’s a great plugin for other themes.)
  • cForms II – This plugin controls the form on my contact page. It is highly flexible in terms of adding additional fields (checkboxes, drop downs, additional text inputs, etc.) and customizing the styling of the forms, offering several pre-built styles to choose from with the option to further edit the CSS for those styles.
  • Chat Catcher – This plugin captures some of the Twitter and FriendFeed shares of a particular post and adds them to your post’s comments as comments or trackbacks. I have mine set to “Post Trackbacks.”
  • CommentLuv – This plugin automatically captures the latest blog post of a comment author, provided that they have registered their site on ComLuv.

Continue WordPress Thesis Theme Customization Part Two: Plugins

When browsing other WordPress blogs with awesome themes, I always find myself wondering how someone handled a particular aspect of the layout or functionality. This is especially true with the Thesis Theme, because of the difference in setup due to the Thesis hooks system. So for anyone browsing Kikolani, I wanted to answer the question of “how did you do that” in a new series on WordPress Thesis Theme Customization.

Part One: Options

The Thesis Theme comes with two sets of options: Thesis Options and Design Options.

Thesis Options

Thesis Theme Options

Thesis Options control the main functionality of the Thesis Theme, including SEO, syndication/RSS, thumbnails and more. Here are the options I have set for Kikolani.

Continue WordPress Thesis Theme Customization Part One: Options