Archive for the ‘Web Design’ Category

How to Exclude Category Posts in WordPress – Tutorial with Code that Works

Saturday, July 4th, 2009

It is astounding how much worthless advice can be found on the web. If you are not a seasoned coder, you can find yourself facing simple dilemmas which can turn into a nightmare if solutions offered on various websites don’t lead to actual solution of your problem, only cause more problems and frustration. And that’s what I found to be the case with excluding posts from one particular category (or more categories) from your WordPress powered blog’s main page. I have been contacted by several people asking me for help excluding category posts from their WordPress blog, each of which was tearing their hair out as their tried many suggested solutions you can find across the web, but they either don’t work at all, or exclude the category, but break something else (mostly bust your title tags which are the most important part of your on page SEO).

Why Exclude Categories in WordPress?

There are several reasons why you may need to exclude category posts from your WordPress blog. One of the WP blogs I have built used a “Video of the Day” feature. The blog normally focused on different subject matter, but the owner wanted to offer his readers an extra feature to keep them entertained so he introduced the Video of the Day page. He would be posting one cool video each day and had them all listed on a dedicated page, however he didn’t want these Video of the Day posts mixed up with main topic of his website. So he was looking for a code to add to the WordPress theme which would exclude all posts from Video of the Day category from his main blog page. It turned up being a pain in the neck finding out the tutorial or ready to use code that would safely and reliably exclude that category.

How to Exclude Category Posts in WordPress – Tutorial

To exclude posts from a particular category in WordPress you first need to create that category and then mark down the category ID. It is very easy to do, just follow these steps:

  • go into Posts > Categories
  • create New Category (skip this step if you are excluding a category which already exists)
  • click on Category you want to exclude
  • mark down the ID number of the category – you can see it by taking a look at the ULR of the page in your browser’s address bar. It is the number at the end of the URL, right after the equal sign. The URL should end with something like this &cat_ID=xx where xx is a number (note, it could be a single, double or triple digit number, depending on how many categories your WordPress blog has. Some blogs could get four or five digit number. Just mark down the number in full as it appears after the equal sign)
  • go into Appearance > Editor and click on the file called “Theme Functions” (functions.php) listed under the Templates on the right hand side
  • paste the code below into your functions.php theme file, right before “?>” part at the end of it, replace “xx” with your category ID you have made note of and click “Update File”.

Code to Exclude Category Posts in WordPress

Use this code to paste in your functions.php file. It should be pasted right before the ?> part which should be the part of the exiting code. Replace “xx” in the code provided with Category ID you have made note of before hand. This is absolutely essential as you must let WordPress know which category you want to exclude for it to work. If you forget about it and paste it as it is provided below with xx instead of a Category ID, your category poses will NOT be excluded! Make sure you keep the minus sign (-), only replace “xx”, nothing more.

function exclude_category($query) {
if ( $query->is_home ) {
$query->set('cat', '-xx');
}
return $query;
}
add_filter('pre_get_posts', 'exclude_category');

Excluding Multiple Categories in WordPress

Sometimes you may wish to exclude more than one category from your main blog page. To do it is again very easy, you just need the Category ID of each category you wish to exclude. Post that Category ID along with the minus sign right before it in the same space as other category IDs, but separate them with spaces. So the final code would look something like this:

$query->set('cat', '-9 -53 -98 -484');

An example of code above would exclude posts from categories with following IDs: 9, 53, 98, 484

How to Exclude Categories from Archive Pages in WordPress

Sometimes you may also want to exclude category posts from archive pages. Or you may wish to have a category excluded from both Archives and Main Blog Page. Both of these are easy. The code for it would be as follows:

To exclude category posts from Archive pages, replace second line of code with following code:

if ( $query->is_archive ) {

To exclude category posts from both Archive pages and Main Blog Page, replace second line of code with following code:

if ( $query->is_home || $query->is_archive) {

That’s it. I have written this post in a way so even a new blogger could understand it and hopefully it helps. These codes definitely work with WordPress 2.7 through 2.8 but will also work on most older versions of WordPress.

 

Good Website Design – What to Keep in Mind

Wednesday, July 1st, 2009

You know good design when you see it, but what exactly makes good website design? What do you as a web designer need to keep in mind in order to make sure your design is “good”? It’s easy to pinpoint a well designed website once it’s complete, but where do you start when you’re building a website from scratch? Let’s take a look at some important points a designer should keep in mind in order to make sure his/her design is a good one:

Proximity

Proximity is one of the fundamentals of good website design. All elements that are related to one another must be placed within the same area. Human brain associates information it perceives based on proximity. A viewer will be able to categorize the information on your website better if elements that are related to each other are placed close to each other and vice versa – elements that are NOT related to each other should NOT be placed close to each other.

If you keep your website design organized with proximity principle in mind, you will help viewers to understand your website. If surfers can’t clearly comprehend information your website provides, they are less likely to read the content and respond to it. Disorganized information is also information that will be forgotten. Proximity helps keep information organized which can ultimately lead to engagement of the viewer.

To better understand proximity, take a look at any website and focus on your eyes. See how many different parts of the website your eyes will have to fall on in order to understand how the website is organized. If you can immediately recognize main areas of the website, such as:

  • Header and Main Menu
  • Sidebar with Additional Navigation
  • Main Content Area

then the website is well organized and each part has elements that belong to it in good proximity. Some websites are more complex so there could be more than 3 areas to focus on, but it still should be easy to recognize them and be clear what their purpose is. If let’s say part of main menu is here but some important elements of it are at a totally different spot – that’s not a good website design.

Repetition

Repetition is consistency. Well designed websites use many of the same elements throughout the site. Whether it’s the color scheme, the font, the way corners are rounded – having these elements repeated throughout the website ensures that the pages “belong” with each other. Consistent pages appear professional and trustworthy.

You can take the rule of repetition a step further and adjust the aspects of your design to your company logo. For example if your logo uses red and black font, have the website designed so titles are in red and articles in black font. Or if for example your logo contains what appears as X and Y axes of a graph, built your website with elements of X and Y graph axes integrated into the design. Just keep in mind that overdoing it with repetition is not good either.

Alignment

Elements which are in alignment with each other appear cohesive to the eye. We have all seen websites with the text and/or graphic placed randomly within the layout. If you aim for good website design, you must never place anything arbitrarily. The connection between visual elements of your website must be apparent. That human brain naturally appreciates if items on a page layout are aligned.

Take a look at any website that naturally strikes you as well designed. You will notice that elements on it are aligned with each other. There usually is one main elements and several smaller ones that complement the main one. Those smaller elements will always be in alignment with the main element both horizontally and vertically.

Proper alignment adds to solidity of any web design. This principle of alignment applies in many other aspects of industrial production, not just web. You can see it in furniture, electronic devices, automotive designs, etc. Good website design needs proper alignment of elements the same way everything else does to be appealing.

Contrast

Contrast makes design “interesting”. Two elements that are not the same should be distinguished from each other with the means of contrast. For example – title of your article should be significantly different from the text of the article itself. It could be different in more than one way, for example a title could be bold, while text is light, the size of title could be larger than the size of text and it also could be a different color form the text. Adding contrast to your design will help organize the content into easily navigable hierarchies.

If you’re going for contrast, go for a lot of contrast. Contrast will make the page more interesting and easily scannable. This is important as it helps the reader to understand how the information on the page is organized. If reader doesn’t have to work hard to figure this out, they are more likely to stay and read what you have to say.

Good Website Design

Proceeding were four of the most important aspects of good website design. Websites that follow these principles have cleaner, more professional look. Check it out for yourself – next time you stumble across a website that strikes you as well designed, remember these four principles and notice how they are an inconspicuous, but solid part of that website. Good web designers know it and follow it on every bit of design they are a part of. Now you know it too. Apply it to your websites and see your readership base grow and retain.