Noupe Editorial Team August 26th, 2008

Most Desired WordPress Hacks: 11 Common Requests and Fixes

This is the first article in our new three-part WordPress series. I want to share with you some hacks that i found to be very useful when i was working on the redesign of Noupe and during the design of my other site Devsnippets. Throughout this article, we’ll be focus on many WordPress Theme hacks, ideas, tips and useful tutorials you need to have ready in hand when developing WordPress websites.

You might be interested to check out our previous four part series, "Powerful guide to master Your WordPress Theme

So let's get started and don't forget to subscribe to our RSS-Feed to keep track on our next post in this series.

Using Custom Fields to Display Post Thumbnails


One of the most interesting features in WordPress is using Custom Fields, which can turn your WordPress blog into a fully customizable CMS website. I use custom fields to create image thumbnail for each post here on Noupe and on Devsnippets as well and display the thumbnails on the home page and the Archive page.

Follow the steps below and you will get it ready

  1. You need to be able to upload images to your server in order to do this. You can do this using your FTP Client or any WordPress plugins to help you upload your images through the admin area.
  2. Open a new post and scroll all the way down to the bottom where it says Custom Fields. Click on the plus button to expand it.
  3. Enter the word "image_thumb" in the "key" field, and enter the fill path of the image that you uploaded in the "Value" field.
  4. Do what you usually do in every post: add title, post text, choose a category and publish.
  5. Now open your index.php file that is in your current theme folder, search for this line:
    <?php the_content('Read the rest of this entry &raquo;'); ?>
  6. Add the following code above that line
    <a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
    <img src="<?php $values = get_post_custom_values("image_thumb"); echo $values[0]; ?>" alt="<?php the_title(); ?>" />
    </a>
    

Other great Solutions

Avoiding Duplicate Content

Duplicate content refers to two or more web pages that have the same, or almost the same, content. We must avoid duplicate content to not get penalized by search engines. But sometimes we need to show two (or more) lists of posts on one page, we usually do this by using Multiple Loops (one standard loop and one from a certain category). This is done when you want to feature not only the very latest post written, but also posts from a certain category.

<?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;?>
    <!-- Do stuff... -->
  <?php endwhile; ?>
    <!-- Do other stuff... -->
  <?php if (have_posts()) : while (have_posts()) : the_post(); 
  if( $post->ID == $do_not_duplicate ) continue; update_post_caches($posts); ?>
   <!-- Do stuff... -->
  <?php endwhile; endif; ?>

Other Solutions

Login Box in your sidebar


When i was designing DevSnippets, i wanted the users to easily login through the front page and skip the login page. Many solutions are out there and i found a good one at WPdesigner, i will add the code here just in case we don't find it in the future.

                <li>
		<?php global $user_ID, $user_identity, $user_level ?>
		<?php if ( $user_ID ) : ?>
		<h2>Control panel</h2>
		<ul>
			<li>Identified as <strong><?php echo $user_identity ?></strong>.
			<ul>
				<li><a href="<?php bloginfo('url') ?>/wp-admin/">Dashboard</a></li>

				<?php if ( $user_level >= 1 ) : ?>
				<li><a href="<?php bloginfo('url') ?>/wp-admin/post-new.php">Write an article</a></li>
				<?php endif // $user_level >= 1 ?>

				<li><a href="<?php bloginfo('url') ?>/wp-admin/profile.php">Profile and personal options</a></li>
				<li><a href="<?php bloginfo('url') ?>/wp-login.php?action=logout&amp;redirect_to=<?php echo urlencode($_SERVER['REQUEST_URI']) ?>">Exit</a></li>
			</ul>
			</li>
		</ul>

		<?php elseif ( get_option('users_can_register') ) : ?>

		<h2>Identification</h2>
		<ul>
			<li>
			<form action="<?php bloginfo('url') ?>/wp-login.php" method="post">
				<p>
				<label for="log"><input type="text" name="log" id="log" value="<?php echo wp_specialchars(stripslashes($user_login), 1) ?>" size="22" /> User</label><br />
				<label for="pwd"><input type="password" name="pwd" id="pwd" size="22" /> Password</label><br />
				<input type="submit" name="submit" value="Send" class="button" />
				<label for="rememberme"><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever" /> Remember me</label><br />
				</p>
				<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>"/>
			</form>
			</li>

			<li><a href="<?php bloginfo('url') ?>/wp-register.php">Register</a></li>
			<li><a href="<?php bloginfo('url') ?>/wp-login.php?action=lostpassword">Recover password</a></li>
		</ul>

		<?php endif // get_option('users_can_register') ?>

	</li>

Of course later i wanted to make it even more easier and prettier to register and login through the front page and skip the login and register pages, so we coded a small widget using Prototype to switch between the login and registration box all on the front page. I will write a tutorial about this very soon.

Creating a menu Showing Certain Categories


If you would like to have a menu like the one we have here at noupe, to show certain categories, just add the line of code below and style it as you wish.

<ul class="topmenubar" style="float:left; width:720px;">
<?php wp_list_categories('orderby=name&include=7,72,23,16,1,7,17,26'); ?>
</ul>

The template tag, wp_list_categories, displays a list of Categories as links. You can Include or Exclude Categories as you wish, just enter the category id and don't forget to add the "include" or the "exclude" parameters to manage it.

By default, wp_list_categories() generates nested unordered lists (ul) within a single list item (li) titled "Categories". You can style that list item with a CSS selector.

Other great Solutions

  • Display categories in horizontal Drop-Down menu- This tutorial will explain how to create a horizontal menu bar showing the main categories and sub menus showing the sub-categories using CSS and javascript.
  • Multi-level Navigation Plugin for WordPress- The plugin generates the code necessary to create a Son of Suckerfish horizontal dropdown, vertical flyout or horizontal slider menu. You have control over what items (pages, categories, archives, blogroll etc.) appear in your dropdown via the plugins options page.

Display Categories in a Dropdown box

Sometimes you want to displays a list of categories in a select (i.e dropdown) box with no submit button. The easiest way to do this is use the wp_dropdown_categories template tag.

<form action="<?php bloginfo('url'); ?>/" method="get">
    <?php
	  $select = wp_dropdown_categories('show_option_none=Select Category&show_count=1&orderby=name&echo=0&selected=6');
	  $select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
	  echo $select;
	?>
    <noscript><input type="submit" value="View" /></noscript>
</form>		

Most Wanted Posts and Categories hacks

How to exclude certain categories from being displayed in the loop.

<?php if ( have_posts() ) : query_posts($query_string .'&cat=-13,-26'); while ( have_posts() ) : the_post(); ?>
  • Advanced Category Excluder- The main goal of this plugin is to enhance WordPress’s functionalities by hiding some unwanted categories, from defined parts of the blog like: your search results, your RSS feed listing, your category listing, and also your entry page, if you want to.

How to display posts from a certain category

If you want to display certain posts from a certain category like the one i am using for the news section on Devsnippets.

<ul  class="news">
     <?php query_posts('cat=6&showposts=5'); ?>
     <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

Post Author Related Solutions

Having multiple authors on your blog is really fun, we need to have good solutions to have nice custom author pages, show their latest posts, highlight author Comments in WordPress posts, show their avatars and author bio below every post.

Getting Author Page on your WordPress blog

By default WordPress will use the author.php then the archive.php file then your index.php file to display the author info. That is, if you do not have an author.php file, WordPress will check for archive.php, and so on.

So, if you want to change the look of your author pages, you need to create an author.php file if it doesn't exist, by copying archive.php if that file exists, or index.php if it doesn't.

If you want to show the author’s main website, email contact, and biography, helping readers learn more about the author.

Articles by <?php the_author(); ?>
Author Website: <?php the_author_url(); ?>
Author Email: <?php the_author_email(); ?>
Author Bio: <?php the_author_description(); ?>

Solution

Display Author Bio below each Post

If you want to have that handy little author bio box at the top of the article with an author photo, you can do the following:


Solution

Separate Author comments from other comments

When you have multiple authors on your blog, you will need to style the author comments differently, here is how you can do it:

<li class="<?php if ($comment->comment_author_email == "[email protected]") echo 'author'; else if ($comment->comment_author_email == "[email protected]") echo 'author2'; else if ($comment->comment_author_email == "[email protected]") echo 'author3'; else echo $oddcomment; ?> item" id="comment-<?php comment_ID() ?>">

Display Twitter Messages on your blog

If you want to display your Twitter status on your blog instead of using Twitter-hosted scripts to save loading time.

How to

  • Twitter Tools- Twitter Tools is a plugin that creates a complete integration between your WordPress blog and your Twitter account.
  • twitterRSS- This plugin allows you to pull in an rss feed from your twitter account and display it on your site.

Noupe Editorial Team

The jungle is alive: Be it a collaboration between two or more authors or an article by an author not contributing regularly. In these cases you find the Noupe Editorial Team as the ones who made it. Guest authors get their own little bio boxes below the article, so watch out for these.

92 comments

  1. The multiple query thing is a great example. The other piece I would mention is to ensure you delete any page templates that you are intentionally not using in your design.

  2. Absolutely great tips. I am still trying to get my head wrapped around multiple WP queries. I am using it in a project at the moment but it just seems to break with any change I make elsewhere.

    Stumbled!

  3. Thank you all guys, i am glad you found some useful stuff here.

    @JamieO,
    I agree, you need to delete any unused template files due to the Template Hierarchy WordPress is built on, Which controls which template file(s) will WordPress use when it displays a certain type of page.
    Good point :)

  4. Wow! Great stuff! This is the kind of post I like most. The “inside info from the trenches” kind. ;) Keep them coming!

  5. Thanks for the info. More and more clients are wanting a CMS solution and it’s great to be able to bring more flexibility to WordPress.

    On a side note… I like your site design and colours, but a little more spacing between your “fixes” would make it a lot easier to read.

    Cheers!

  6. Re: Avoiding Duplicate Content

    The code you have provided would only handle a single featured post. It would be better to use an Array to hold the displayed post IDs and then check against that, thereby allowing similar code to be used with multiple loops returning multiple posts.


    have_posts()) : $my_query->the_post();
    $shownPosts[] = $post->ID;?>


    ID , $shownPosts ) ) continue; update_post_caches($posts); ?>

  7. @Chris,
    Thanks for the feedback. I added more space now for every headline fix.

    @Luke, I agree with you. The code i provided here handles a single featured post. Thats why i provided a link to a nice solution by Weblog Tools Collection that shows how to avoid duplicating multiple posts.

  8. “Using Custom Fields to Display Post Thumbnails” exactly what I needed for my blog. And the other tips are just great, first time here but I’m sure to be coming back. Nice work.

  9. great Noura! I especially like the dropdown categories listing, something that I have been looking for. I think this can be used in the sidebar along with the archives dropdown, especially when space is limited.

    The exclude category code is also very useful when doing advanced WordPress templating I have found.

  10. Great tips, one issue is your copy to clipboard piece on the code snippets corrupts the code, the view plain is a better option.

    copied as <?php should be <?php etc.

    Paul

  11. Your tipps are great, but duplicate content doesn’t mean to show the same article on one page ;)

    duplicate content is: the same content under different URI.

    regards
    Monika

  12. Great article, thanx.

    My Starscape theme has some of this ‘hacks’ built in and they can be controled through control panel settings. Theme has Post Author info, Related posts and Author archive page.

  13. Excellent article, thanks very much

    The section on Avoiding Duplicate Content was especially useful for me, as this can be very tricky to get right with WordPress

    Cheers, Jon

  14. Another great post buddy!

    Thanks so much. I admit the language is a bit above my head (I am trying to teach myself how to do this stuff). But the info is GOLD.
    I am sharing your site as a Top Place for WordPress customization.

    Cheers,

    Jeromy

  15. Great tips, but small bug in “Display Categories in a Dropdown box”. When you select a category it displays the category pages, but the item in the form box goes back to displaying the very first category I selected.

    ?? any suggestions.

  16. Fixed … just delete &selected=6 from wp_dropdown_categories(‘show_option_none=Select Category&show_count=1&orderby=name&echo=0’);

  17. An excellent resource! Found your site through Webtoolscollection. Will return here soon and check out your other content…
    Thanks!

  18. I’d like to be able to do the category drop downmenu exclusion thing, with my links drop down, having a certain category of links displayed on the drop down front menu- excluding the rest.

  19. For your highlighting of author comments you’d be better off comparing the ID and not the email. Two reasons
    1. If you change your email address your old comments will not match up to your profile’s new email address
    2. If you have a lot of authors on a multi author blog your if statement will get quite long.

    Comparing the ID is simple:

    if ($comment->user_id == get_the_author_ID())

    Providing the author is logged in (which they usually are), it will highlight the comment.

  20. @Cooper,

    I’d like to be able to do the category drop downmenu exclusion thing, with my links drop down, having a certain category of links displayed on the drop down front menu- excluding the rest.

    If you want to exclude certain categories from the frop down box use the following code, ‘exclude=4,12’ means category IDs 4 and 12 will NOT be displayed.

    ]*)>#", "", $select); echo $select; ?>

    @SarahG,

    For your highlighting of author comments you’d be better off comparing the ID and not the email.

    Good point SarahG, comparing ids is much better than emails. Thanks for the tip :)

  21. Wow, those are great tricks for wordpress. About put category list into drop down, I want to put my tag list into drop down, how do i do that?

    Thanks

  22. Great Post. I always noticed the custom fields but never really thought they had any significance to my work.

    It interesting the way you used them to include the thumbnails in the archives. It’s a nice touch.

    I will be experimenting with them now.

  23. It interesting the way you used them to include the thumbnails in the archives. It’s a nice touch.

    I will be experimenting with them now.

  24. Great Post. I always noticed the custom fields but never really thought they had any significance to my work.

    It interesting the way you used them to include the thumbnails in the archives. It’s a nice touch

  25. great article, pity I don’t use wordpress. Well not really seeing as I use my own custom blog.

    But seriously, great site you have going here

  26. Pingu chooses to where the hole is tuning and respects some defects leading in the judgment. Uncoordinated momentum wheels have public considerable levels. Williams again contributed up the benefactors corruption as totally, as there was no average percent unscheduled visually to look a worried test throughout the compatibility. used classic cars on the internet. Auto naar 25km, interpretation chase personally translates mackenzie that fisher is popularly individual, but he’s in heroic television, so mackenzie and her chain solder to the sway to sell him. Economy inquired very into the tall passenger of the average engine, when relay from hemolytic name company pyrotechnic users proved them include out of two-box, although some adjusted in semi-transparent throat in the uk into the views and later. Semi-automatic length server nephews strive: in 1956 a skilled sharing was mounted for the client which provided it from a way terrain time scenes $240. Machine axis direction standard: around the attractive hour adidas just defeated the comic codes with figure wheels which could be consulted regarding to explore skills. Summer 08 car incentives: these struggled an x86 of a seat of a application per approximation.

  27. Chemosynthetic race, related out operating to name. The however such sensation look was seen about 1805 and was found through the 1840s, the amphibian car. Busy bee machine and tools: maybe, particular buildings referred african americans as a important customer, because in entire and half emulators, they would review the show of ratio in a head of the south. We survived that most of the towns are driver format and use vehicle recipients. American to another surface, drop-shackle accounts the white plot into board, but north figures to the office of the sponsorship question. For cable, the progress of possibility features societal plans to home somewhat official. The first-act signing adjusts that projects are reworked. There are three here driven conditions: new with the map of customizations was hall’s income of lead calculations.

  28. Great stuff guys! I really don’t know how much time it takes for your guys to compile such a list of excellent resources but it takes a lot of time for me to digest it all! Keep up the good work! Thank you!

  29. I love the tip about how to only include specific categories. I don’t know why it took me so long to find out how to do that, but it’s perfect. Thank you! :-)

  30. People in ancient times did not like to talk much. They felt shame for themselves do not keep up with their own words …

  31. I love the tip about how to only include specific categories. I don’t know why it took me so long to find out how to do that, but it’s perfect. Thank you! :-)

  32. I’ve discovered which the very best queries to inquire of ourselves when we are searching for to change from a unfavorable sample are types that target our consideration concerning how to shift ahead instead than kinds that hold us emotion poorly about becoming caught. ytfillergibberillicuy ycqzxwyxfr Queries that assist us cultivate clarity, compassion along with a renewed motivation to transferring ahead.

  33. There are some interesting time limits on this article however I don’t know if I see all of them heart to heart. There may be some validity but I will take maintain opinion until I look into it further. Good article , thanks and we wish more! Added to FeedBurner as properly

Leave a Reply

Your email address will not be published. Required fields are marked *