10 Exceptional WordPress Hacks

View original post found on Smashing Magazine Feed authored by Jean-Baptiste Jung

One of the reasons people love WordPress so much is its great flexibility. You can change the software’s appearance with themes. You can enhance its functionality with plug-ins. And, last but not least, you can totally unleash WordPress’ power with hacks. Some time ago, we wrote a post showing 10 Killer WordPress Hacks.

Today, let’s do it again with 10 new and totally killer WordPress hacks to make your blog stand out from the crowd. As usual, we won’t just list the hacks alone. In each entry, you’ll find an explanation of the code as well as the kinds of problems that the hack solves.

You may be interested in the following related posts:

1. Create TinyURLs On The Fly

Screenshot

The problem. Because Twitter has become a social media revolution, many bloggers and Twitter users enjoy sharing blog posts they have found and liked on Twitter. However, manually creating a TinyURL before tweeting can get a little tedious. As you probably know, Twitter can bring a lot of traffic to your blog, so it is in your interest to consistently provide short URLs to your readers.

The solution. To use this recipe, follow the simple steps below:

  1. Open your functions.php file.
  2. Paste the following code in the file:
    function getTinyUrl($url) {
        $tinyurl = file_get_contents("http://tinyurl.com/api-create.php?url=".$url);
        return $tinyurl;
    }
  3. Open your single.php file and paste the following in the loop:
    <?php
    $turl = getTinyUrl(get_permalink($post->ID));
    echo 'Tiny Url for this post: <a href="'.$turl.'">'.$turl.'</a>'
    ?>
  4. That’s all you need. Each of your posts now has its own TinyURL, ready for tweeting!

Code explanation. The popular URL shortening service TinyURL provides a quick API that creates TinyURLs on the fly. When you pass a URL to http://tinyurl.com/api-create.php, the API immediately prints the related TinyURL on the screen.

Using the PHP function file_get_contents(), we can get it and assign it to the $tinyurl variable. The last part of the code retrieves the post’s permalink and passes it as a parameter to the getTinyUrl() function previously created.

Source:

2. List Upcoming Posts

Screenshot

The problem. If you often schedule posts to be published, how about displaying them in a list? This will make your readers look forward to what you’re going to publish in a few days and can help you reach new RSS subscribers. Implementing this functionality on your WordPress blog isn’t hard at all.

The solution. Nothing hard here. Just copy this code and paste it anywhere in your theme files.

<div id="zukunft">
	<div id="zukunft_header"><p>Future events</p></div>

	<?php query_posts('showposts=10&post_status=future'); ?>
	<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
		<div >
			<p class><b><?php the_title(); ?></b><?php edit_post_link('e',' (',')'); ?><br />

			<span class="datetime"><?php the_time('j. F Y'); ?></span></p>
		</div>
	<?php endwhile; else: ?><p>No future events scheduled.</p><?php endif; ?>

</div>

Once you’ve saved the file, your upcoming posts will be displayed on your blog.

Code explanation. This code use the super-powerful query_posts() WordPress function, which allows you to take control of the WordPress loop.

The parameter used is post_status, which allows you to get posts according to their status (published, draft, pending or future). The showposts parameter is also used to define how many items you’d like to get. You can change the value of this parameter on line 4 to retrieve more or less than ten posts.

Source:

3. Create A “Send To Facebook” Button

Screenshot

The problem. In the first hack, we noted that Twitter can bring a lot traffic to your blog. Another website that can boost your traffic stats easily is Facebook. In this hack, let’s see how we can create a “Send to Facebook” button for your WordPress blog.

The solution.

  1. Open the single.php file in your theme.
  2. Paste the following code in the loop:
    <a href="http://www.facebook.com/sharer.php?u=<?php the_permalink();?>&t=<?php the_title(); ?>" target="blank">Share on Facebook</a>
  3. Alternatively, you could use the getTinyUrl() function to send a short URL to Facebook:
    <?php $turl = getTinyUrl(get_permalink($post->ID)); ?>
    <a href="http://www.facebook.com/sharer.php?u=<?php echo $turl;?>&t=<?php the_title(); ?>" target="blank">Share on Facebook</a>
  4. That’s all. Your readers will now be able to share your blog post on Facebook with their friends!

Code explanation. This useful hack is very easy to understand: the only thing we do here is retrieve the post’s permalink and title and send them as parameters to http://www.facebook.com/sharer.php.

In the alternative method, we used the getTinyUrl() function (created in the previous hack) to send a short URL instead of the post’s permalink.

Source:

4. Create A Maintenance Page For Your WordPress Blog

Screenshot

The problem. One thing I really like about Drupal is the option to temporarily redirect visitors to a maintenance page. Sadly, WordPress doesn’t have this feature. When you upgrade your blog, switch themes or make design changes, you may not want your visitors to see your blog as it is being tweaked, especially if it has design or code problems or, even worse, security gaps.

The solution. To solve this problem, we use the power of the .htaccess file. Just follow the steps below to get started.

  1. Create your maintenance page. A simple WordPress page is generally sufficient.
  2. Find your .htaccess file (located at the root of your WordPress installation) and create a back-up.
  3. Open your .htaccess file for editing.
  4. Paste the following code:
    RewriteEngine on
    RewriteCond %{REQUEST_URI} !/maintenance.html$
    RewriteCond %{REMOTE_ADDR} !^123\.123\.123\.123
    RewriteRule $ /maintenance.html [R=302,L]
  5. Replace 123\.123\.123\.123 on line 3 with your IP address (Don’t know it?). Make sure to use the same syntax.
  6. Now, all visitors except you will be redirected to your maintenance page.
  7. Once you’re done tweaking, upgrading, theme switching or whatever, re-open your .htaccess file and remove (or comment out) the redirection code.

Code explanation. The .htaccess file, which controls the Apache Web server, is very useful for these kinds of tasks.

In this example, we state that any visitor who has an IP different from 123.123.123.123 (which doesn’t request maintenance.html) should be redirected to maintenance.html.

By replacing 123.123.123.123 with your own IP address, you make sure you’re still allowed to browse your blog normally, while others are redirected to maintenance.html.

Source:

5. Display Related Posts Without A Plug-In

Screenshot

The problem. One well-known way of keeping visitors on your blog longer and helping them discover news posts is to display, usually at the end of the article, a list of related content.

Many plug-ins will do this job, but why not super-charge your theme by integrating this functionality by default?

The solution.

  1. Open the single.php file in your theme.
  2. Paste the following code in the loop:
    <?php
    $tags = wp_get_post_tags($post->ID);
    if ($tags) {
      echo 'Related Posts';
      $first_tag = $tags[0]->term_id;
      $args=array(
        'tag__in' => array($first_tag),
        'post__not_in' => array($post->ID),
        'showposts'=>5,
        'caller_get_posts'=>1
       );
      $my_query = new WP_Query($args);
      if( $my_query->have_posts() ) { ?>
    <ul>
    
    </ul>
    
  3. Save the file, and then have a look at your blog: related posts are automatically displayed!

Code explanation. This hack uses tags to retrieve related posts. The first thing it does is get the post’s tags. If a post has tags, the first one is extracted and used in a query that retrieves posts with the same tag.

By default, this code displays up to five related posts. To change this number, simply edit line 9 of the code.

Source:

6. Automatically Retrieve The First Image From Posts On Your Home Page

Screenshot

The problem. Many WordPress users use custom fields to display a thumbnail on their blog home page. Of course, this is a nice solution, but how about automatically retrieving the first image from a post and using it as a thumbnail?

The solution. This hack is quite easy to implement:

  1. Open the functions.php file in your theme.
  2. Paste this code in. Don’t forget to specify a default image on line 10 (in case a post of yours does not have an image).
    function catch_that_image() {
      global $post, $posts;
      $first_img = '';
      ob_start();
      ob_end_clean();
      $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
      $first_img = $matches [1] [0];
    
      if(empty($first_img)){ //Defines a default image
        $first_img = "/images/default.jpg";
      }
      return $first_img;
    }
  3. Save the functions.php file.
  4. On your blog home page (index.php), call the function this way to get the URL of the first image from the post:
    <?php echo catch_that_image() ?>

Code explanation. The function uses the global variable $post to parse the post’s content with a regular expression. If an image is found, its URL is returned by the function. If not, the default image URL is returned.

Source:

7. Resize Images On The Fly

Screenshot

The problem. When you use thumbnails on your blog’s home page or even images in posts, having to manually resize them is boring and wastes a lot of time. So, why not use the power of PHP to do it?

The solution. To achieve this hack, just follow these simple steps:

  1. Get this script and save it on your computer (I’ll assume you’ve named it timthumb.php).
  2. Use an FTP program to connect to your server and create a new directory called scripts. Upload the timthumb.php file to it.
  3. Once done, you can display images like so:
    <img src="/scripts/timthumb.php?src=/images/whatever.jpg&h=150&w=150&zc=1" alt="Screenshot" />

    In other words, you just call the timthumb.php file and pass your image as a parameter. The same goes for your desired width and height.

Code explanation. The timthumb.php script use the PHP GD library, which allows you to manipulate images dynamically with PHP. GD is installed by default on all servers running PHP5. If you’re not running PHP5, you’ll have to check if GD is installed before using this script.

The timthumb.php file gets the parameters you’ve passed to it (image URL, width and height) and uses it to create a new image with your stated dimensions. Once that’s done, the image is returned to you.

Source:

8. Get Your Most Popular Posts Without A Plug-In

Screenshot

The problem. Displaying your most popular posts is a good way to make visitors stay longer on your blog, as is displaying related posts. Many great plug-ins can list your most popular posts, but again, why use a plug-in when you can simply hack your WordPress theme to do it automatically?

The solution. Just paste the following code anywhere in your theme files (for example, in sidebar.php). To change the number of displayed posts, simply change the “5″ on line 3 to your desired number.

<h2>Popular Posts</h2>
<ul>
<?php $result = $wpdb->get_results("SELECT comment_count,ID,post_title FROM $wpdb->posts ORDER BY comment_count DESC LIMIT 0 , 5");
foreach ($result as $post) {
setup_postdata($post);
$postid = $post->ID;
$title = $post->post_title;
$commentcount = $post->comment_count;
if ($commentcount != 0) { ?>

<li><a href="<?php echo get_permalink($postid); ?>" title="<?php echo $title ?>">
<?php echo $title ?></a> {<?php echo $commentcount ?>}</li>
<?php } } ?>

</ul>

Code explanation. This code executes an SQL query to the WordPress database, using the $wpdb object, to get a list of the five posts with the most comments. The results are then wrapped in an unordered HTML list and displayed on screen.

Source:

9. Highlight Searched Text In Search Results

Screenshot

The problem. The WordPress search engine system is often criticized for not being powerful enough. One of its weakest points in my opinion is that searched text is not easily distinguishable from the rest of the text. Let’s solve that!

The solution.

  1. Open your search.php file and find the the_title() function.
  2. Replace it with the following:
    echo $title;
  3. Now, just before the modified line, add this code:
    <?php
    	$title 	= get_the_title();
    	$keys= explode(" ",$s);
    	$title 	= preg_replace('/('.implode('|', $keys) .')/iu',
    		'<strong class="search-excerpt">\0</strong>',
    		$title);
    ?>
  4. Save the search.php file and open style.css. Add the following line to it:
    strong.search-excerpt { background: yellow; }

That’s all. Better, isn’t it?

Code explanation. Once again, regular expressions are a lifesaver. The regexp parses the $s content ($s is the variable containing the searched text) and automatically adds a <strong class=”search-excerpt”> element around any occurrences of $s.

Then, you simply modify your style.css file to give searched text a special style and make it more visible to your readers.

Sources:

10. Disable Widgetized Areas Without Editing Theme Files

Screenshot

The problem. Widgets are very useful, but sometimes you don’t need them on a particular page or post. Sure, you can create a page template for a particular page or even remove the widgetized zone from the code, but a much better and more elegant solution exists.

The solution. To do this, simply add the following code to your functions.php file:

<?php
add_filter( 'sidebars_widgets', 'disable_all_widgets' );

function disable_all_widgets( $sidebars_widgets ) {
	if ( is_home() )
		$sidebars_widgets = array( false );
	return $sidebars_widgets;
}
?>

Code explanation. This code first adds a filter to the sidebars_widgets WordPress function. Now every time WordPress tries to execute this function, it will execute the disable_all_widgets function we just created.

The disable_all_widgets function uses WordPress conditional tags (in this example, is_home(), but you can use any conditional tag) to disable all widgets if a visitor is on a particular page or post.

Source:

Related posts

You may be interested in the following related posts:

About the author

This post was written by Jean-Baptiste Jung, a 27-year-old blogger from Belgium, who blogs about WordPress at WpRecipes, about Photoshop at PsdRecipes and about everything related to blogging and programming at Cats Who Code. You can stay in touch with Jean by following him on Twitter.

(al)


© Jean-Baptiste Jung for Smashing Magazine, 2009. |
Permalink |
104 comments |
Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine

Post tags: , , , , , , ,

10 Useful RSS-Tricks and Hacks For WordPress

View original post found on Smashing Magazine Feed authored by Jean-Baptiste Jung

By Jean-Baptiste Jung

RSS is one of those technologies that are extremely simple yet extremely powerful. Currently, RSS is the de facto standard for blog syndication, and it is used widely in both personal and corporate settings; for example, in blogs. And because a large percentage of these blogs run on WordPress, we’ll cover in this post some (hopefully) relatively unknown but useful RSS-related tricks and hacks that will help you use RSS in a more effective way — and without unnecessary and chunky WordPress plug-ins.

Let’s take a look at 10 useful, yet rather unknown RSS-tricks for WordPress. Each section of the article presents a problem, suggests a solution and provides you with an explanation of the solution, so that you can not just solve some of your RSS-related problems but also understand what you are actually doing. Thus, you can make sure your WordPress theme remains under your control and is not bloated with some obscure source code.

1. Control When Your Posts are Available via RSS

Screenshot

The problem. Have you ever published an article and then immediately noticed an error? Sure, you can edit it, but there’s another problem: the article has already been published in your RSS feed. To avoid this kind of problem, use this recipe to create a delay between the publication of a post and its availability in your RSS feed.

The solution. To apply this hack, simply paste the following code into your theme’s function.php file. If your theme doesn’t have this file, just create it.

function publish_later_on_feed($where) {
	global $wpdb;

	if ( is_feed() ) {
		// timestamp in WP-format
		$now = gmdate('Y-m-d H:i:s');

		// value for wait; + device
		$wait = '5'; // integer

		// http://dev.mysql.com/doc/refman/5.0/en/date-and-time-functions.html#function_timestampdiff
		$device = 'MINUTE'; //MINUTE, HOUR, DAY, WEEK, MONTH, YEAR

		// add SQL-sytax to default $where
		$where .= " AND TIMESTAMPDIFF($device, $wpdb->posts.post_date_gmt, '$now') > $wait ";
	}
	return $where;
}

add_filter('posts_where', 'publish_later_on_feed');

Code explanation. The above code will add a 5-minute delay to the time between when your post is published on your blog and when it appears in your RSS feed. To change the length of the delay, change the value of the $wait variable on line 9.

Sources

2. Redirecting WordPress Feeds to FeedBurner Feeds

Screenshot

The problem. Beginner bloggers usually start to use FeedBurner only after they have seen it used on many other blogs and realize how useful and cool this tool is. They sign up and start to use it, but their early readers are already subscribed to their default WordPress feed.

Another problem: do you often change your theme? If so, you must be bored having to edit each call to bloginfo(’rss2_url’) and replace it with your FeedBurner feed’s URL.

The solution. The solution to both problems described above is simple: use server redirections.

  1. Create a backup of your .htaccess file, located in the root of your Web server.
  2. Edit the .htaccess file and add the following code. Don’t forget to modify the feed’s URL with your own feed’s URL.
    # temp redirect wordpress content feeds to feedburner
    <IfModule mod_rewrite.c>
     RewriteEngine on
     RewriteCond %{HTTP_USER_AGENT} !FeedBurner    [NC]
     RewriteCond %{HTTP_USER_AGENT} !FeedValidator [NC]
     RewriteRule ^feed/?([_0-9a-z-]+)?/?$ http://feeds.feedburner.com/wprecipes [R=302,NC,L]
    </IfModule>
  3. Save the file. You’re done!

Code explanation. Each time someone clicks on a link to http://www.yourblog.com/feed, he or she will be redirected to http://feeds.feedburner.com/yourblog. This way, you will have never lost an RSS subscriber, and even if you change your theme twice a day, you’ll never have to manually edit your RSS feed links again.

Sources

3. Insert Ads (or Anything Else) in Your RSS Feed

Screenshot

The problem. Monetizing RSS feeds is currently becoming a common practice, and many blog owners do it to maximize their income. FeedBurner can insert AdSense ads into your feed items, but you need at least 500 subscribers to qualify, and you can’t use any ads other than the AdSense ads provided by FeedBurner.

The solution. It is possible, though, to insert other kinds of ads into your RSS feed. You can, for example, use a link to a free WordPress theme only for your RSS subscribers.

Follow these simple steps to perform this hack:

  1. Edit the functions.php file of your theme. If your theme doesn’t have a functions.php file, simply create one.
  2. Paste the following code into your functions.php file:
    <?php
    function insertAds($content) {
        $content = $content.'<hr /><a href="http://www.wprecipes.com">Have you visited WpRecipes today?</a><hr />';
        return $content;
    }
    add_filter('the_excerpt_rss', 'insertAds');
    add_filter('the_content_rss', 'insertAds');
    ?>
  3. Save the file. You’re now displaying your ads in your RSS feed!

Code explanation. I have seen many similar hacks on the Web, but all of them require you to edit WordPress core files to achieve the same result. Of course, editing WordPress core files is a very bad idea because then you would have to re-edit the files each time you upgrade your blog. Instead, this hack uses the add_filter() WordPress function to insert content into your RSS feed without editing any core files.

Sources

4. Format Your Images for Feed Readers

Screenshot

The problem. You took a lot of time to write and format your post and add beautiful screenshots. It looks so good on your blog. Sadly, when the post is displayed in Google Reader or any other RSS reader, it doesn’t look so great.

The solution. This is due to the fact that most feed readers display images inline with text:

inline image

To avoid this problem, add a CSS class to display the image as a block. WordPress provides the built-in class “center“:

<img src="http://88.198.60.17/images/wordpress-rss-hacks/myimage.jpg" alt="This is my image" class="center"/>

Sources

5. Provide Your Readers with a Feed for Each Post

Screenshot

The problem. When a post has lots and lots of comments, it can be hard for readers to follow the conversation. Most WordPress users don’t know this, but our favorite blogging engine has a built-in function for providing an RSS feed for the comments in each post.

The solution. Well, this recipe isn’t really a hack or anything: to provide an RSS feed for the comments in a particular post, just call the comment_rss_link() function:

<?php comments_rss_link('&raquo; Comments RSS Feed'); ?>

Sources

6. Exclude Categories from Your RSS Feed

The problem. Do you use one of your blog categories to let readers know about your website’s news, or does your blog feature a category that has nothing to do with the rest of your content? If so, it is generally not a good idea to include it in your RSS feed.

The solution. Here’s how to get rid of one of the categories in your RSS feed:

  1. First, get the numeric ID of the category you want to exclude. If you don’t know how to get the ID of a particular category, you can learn how here.
  2. Once you have the ID of the category you want to exclude from your RSS feed, edit the functions.php file in your theme. Create the file if it doesn’t exist.
  3. Paste the following code in it:
    function myFilter($query) {
        if ($query->is_feed) {
            $query->set('cat','-5'); //Don't forget to change the category ID =^o^=
        }
    return $query;
    }
    
    add_filter('pre_get_posts','myFilter');
  4. Save the file, and you’re done!

Code explanation. This hack works exactly the same way as the previous one: create a custom function to exclude the category that you don’t want to appear in your RSS feed, and then use the super-useful add_filter() function to apply it to the pre_get_posts() WordPress core function.

Sources

7. Display Any RSS Feed on Your WordPress Blog

Screenshot

The problem. Do you have more than one blog, or do you manage a forum? If so, you may want to be able to display any RSS feed on your WordPress blog.

The solution. Many plug-ins can do the job, but they’re not necessary at all. WordPress has a built-in RSS reader that is used, for example, to display news on your dashboard. All you have to do is use it in your theme.

  1. Paste the following code anywhere in your theme (personally, I’d put it in the sidebar, the footer or, even better, the page template):
    <?php include_once(ABSPATH.WPINC.'/rss.php');
    wp_rss('http://feeds.feedburner.com/wprecipes', 3); ?>
  2. Save it and you’re done. It’s as easy as that!

Code explanation. The first thing we have done is include the rss.php file from WordPress core. This file allows us to use the wp_rss() function, which takes two parameters: the first is the RSS feed’s URL, and the second is the number of RSS entries to be displayed.

Sources

8. Use Category-Specific RSS Feeds

Screenshot

The problem. Many blogs talk about a lot of different topics: design, programming, blogging tips, etc. Have you ever come across a blog in which you have enjoyed only one category of posts? If so, you should definitely consider offering one feed per category to your own readers.

The solution. Let’s say you’d like to be able to subscribe only to TheGridSystem’s tools section. The category URL is:

http://www.thegridsystem.org/categories/tools/

To get an RSS feed for this category, you simply have to add /feed to the end of the URL:

http://www.thegridsystem.org/categories/tools/feed

Pretty easy, isn’t it? But pretty useful, too, in my opinion.

9. List RSS Feeds by Category

Screenshot

The problem. If you like the previous hack, you will probably also want to be able to display the names of all your category feeds in a list to your readers.

The solution.

  1. Edit any of your theme files, where you want to list your categories and their accompanying feeds.
  2. Paste the following code:
    <?php wp_list_categories('feed_image=http://www.myblog.com/image.gif&feed=XML Feed&optioncount=1&children=0'); ?>
  3. Save the file. You categories will now be displayed, along with their RSS feeds!

Code explanation. This hack uses only the good old wp_list_categories() function, with two parameters. The first is feed_image, which allows us to specify the URL to be displayed as a feed image. The second parameter is feed, which is used to specify the feed format.

10. Get Rid of RSS Feeds the Clean Way

Screenshot

The problem. Let’s say you’re using WordPress as a CMS to manage your online portfolio or your company’s website. In such cases, the RSS feed isn’t that useful, and some people would probably want to remove it.

The solution. I have seen many “hacks” on the Web where people say you just have to remove the include on the wp-settings.php core file. I don’t think you should ever edit a core file. Instead, the following hack will do the job. Simply paste this code in the functions.php file of your theme:

function fb_disable_feed() {
	wp_die( __('No feed available,please visit our <a href="'. get_bloginfo('url') .'">homepage</a>!') );
}

add_action('do_feed', 'fb_disable_feed', 1);
add_action('do_feed_rdf', 'fb_disable_feed', 1);
add_action('do_feed_rss', 'fb_disable_feed', 1);
add_action('do_feed_rss2', 'fb_disable_feed', 1);
add_action('do_feed_atom', 'fb_disable_feed', 1);

Sources

About the author

This guest post was written by Jean-Baptiste Jung, a 26-year-old blogger from Belgium, who blogs about WordPress at WpRecipes and about everything related to blogging and programming at Cats Who Code. You can stay in touch with Jean by following him on Twitter. (al)