WordPress is one of the most popular CMS platforms in today’s web design industry, largely because of the vast selection of available themes, free and commercial. But most often a theme is only a starting point – there is no such thing as a perfect theme – many website owners start with a great theme and tweak it to perfectly suit their needs.
Tweaking is not a privilege of those proficient in scripting or programming. There are many “customizations” you can make to your WordPress theme, even if your scripting/design knowledge and experience is limited.
Here are some of the easy customizations you can make to your WordPress theme.
- Edit the theme’s CSS
- Display post excerpts or full content
- Excluding/including a category
- Crafting page navigation
- Add something (anything) to the end of your blog posts
- Change the header image (if theme has a header image)
- Change the sidebar
- Add contact form
- Add Google Analytics tracking code
Edit Theme CSS
You can tweak colors, fonts, layouts, backgrounds and other visual elements by editing the Cascade Stylesheet, or CSS. Most of the time, you will find the theme’s CSS style in the file style.css. You can access this file via Appearance > Editor in your WordPress admin panel.
How to:
- Locate the attribute you want to edit. The attributes are identified by names indicating sections, such as body, header, etc.
- Make the changes to the code displayed between the curly brackets { }.
- Save the changes
For more information: http://codex.wordpress.org/CSS
Display Post Excerpts or Full Content
By default, your theme will display the full content of your blog posts on your home page. But if you would rather display only a short excerpt from the post as a little “teaser” to click through to the full article, you can tweak your theme to display excerpts.
To do this, you will need to get familiar with two tags:
1) The tag that displays your full post content is <?php the_content(); ?>
2) The tag that displays your post excerpt is <?php the_excerpt(); ?>
All you need to do is replace the content tag with the excerpt tag on your index.php file. Then, when you write a new post, enter in your article summary (or teaser) in the Excerpt field.
*Note* If no excerpt is set, it will automatically display the first few sentences of your blog post.
For more information on excerpts: http://codex.wordpress.org/Excerpt and http://codex.wordpress.org/Template_Tags/the_excerpt
Excluding/Including a Category
Let’s say you want to display posts from only one category on your homepage, or you want to exclude posts from one or more categories. Here’s how you do it:
Add this code where you want the posts to be displayed:
<?php query_posts(‘cat=3’); ?>
This code will display posts only from category ID 3. Change this number to whichever category ID you’d like to include.
If you want to do the opposite, all you need to do is add a “-“ in front of the category ID number, like this:
<?php query_posts(‘cat=-3’); ?>
This will exclude all posts which have the category ID 3.
For more information on query posts: http://codex.wordpress.org/Template_Tags/query_posts
Page Navigation
Many themes display all of your pages across the top of your site. But let’s say you’d like to exclude a page from the main navigation. Here’s one way you can do it:
Look for the following code (usually in the header.php file):
<?php wp_list_pages(); ?>
Change it to this:
<?php wp_list_pages(‘exclude=4’); ?>
This will tell WordPress to list all your pages except for the page with ID 4. You can change this number to whichever Page ID you’d like to exclude.
If you want to exclude more than one page, simply separate all the page IDs with a comma, like this:
<?php wp_list_pages(‘exclude=4,5,7,10’); ?>
For more information on WP list pages: http://codex.wordpress.org/Template_Tags/wp_list_pages
Add Something (Anything) to the End of Every Blog Post
Maybe you want to add a link to subscribe to your newsletter, an advertisement, etc. To the end of every blog post. Here’s how you do it:
The file you need to edit is the single.php. This is the template that displays your single articles. Open the file and find a good spot for the content you want to add. For example, to add a “Subscribe to newsletter” link after your post (and before the comments):
<?php the_content(); ?>
[the “subscribe to newsletter” link]<?php comments_template(); ?>
Changing the Header Image
Websites are often judged by their looks and the first impression comes from the header – it is the first thing that your visitors see.
Your theme’s header is specified in the header.php and the style.css files. In the header.php file, you may see:
<div id=”header”>
<div id=”headerimg”>
<h1>
<a href=”<?php echo get_option(‘home’); ?>”>
</h1>
<div class=”description”>
<?php bloginfo(‘description’); ?>
</div>
</div>
</div>
And in the styles.css file, you may see:
#header {
background: url(“<?php bloginfo(‘stylesheet_directory’); ?>/images/header.jpg”>
no-repeat bottom center; }
#headerimg {
margin: 10px 8px 0;
height: 192px;
width: 740px; }
To change the image file, replace the “header.jpg” with the name of the new image file you have uploaded to replace it. If it is in a different directory, replace the bloginfo() tag with the address of the image’s location.
If you are using an image that is the same size, then simply replace the image. But if the image is a different size, change the height and width in the #headerimg section.
For more information: http://codex.wordpress.org/Designing_Headers
Changing the Sidebar
The sidebar is the narrow vertical column placed either on the right or left-hand side of on your theme, and often jam-packed with lots of information to provide navigation for the visitor. The list of navigation item often includes Categories, Pages, Archives, Search, Recent Posts and Recent Comments.
The information displayed in the sidebar is controlled by the theme’s sidebar.php file.
Take a look at the file and you might see:
<?php wp_list_pages(‘title_li=<h2>Pages</h2>’); ?>
The Categories list might look like:
<li id=”categories”><?php _e(‘Categories:’); ?>
<ul>
<?php wp_list_cats(); ?>
</ul>
</li>
You can change the sidebar by editing the sidebar.php file. Or, you can also use the widgets subpanel ( located at Appearance > Widgets) in your WordPress admin panel to add and change your sidebar (this option does not require you to know any scripting). If you have installed and activated sidebar plugins and widgets, you will find these plugins listed in the widgets subpanel.
For more information: http://codex.wordpress.org/Customizing_Your_Sidebar
For more information on the Widgets subpanel: http://codex.wordpress.org/Widgets_SubPanel
Add Contact Form
By now, we all know that adding a mailto link on a website is the easiest way to increase the amount of spam in your inbox. Instead, use a contact form. WordPress has hundreds of contact form plugins you can choose from: http://wordpress.org/extend/plugins/search.php?q=contact. Contact Form 7 (http://contactform7.com/) and Cforms (http://www.deliciousdays.com/cforms-plugin/) are a couple great forms you should check out.
All you need to do is install the plugin, activate it and design your form, then add it to your page in just a click.
Add Google Analytics Tracking Code
Everyone wants to know how many visitors come to their website. Google Analytics is the most popular tool for tracking your website traffic. Adding the Google Analytic tracking code is very easy – setup an analytics account with Google and copy and paste the provided code before the </body> tag on the footer.php file (so that the code is embeded at the bottom of all pages of your website).
For more information: http://wordpress.org/extend/plugins/google-analytics-for-wordpress/
Posted in: Themes