WordPress is now over ten years old and its popularity is still growing. Originally a blogging platform, since the release of WordPress 3.0, WordPress has made its full fledged triumphant step onto the CMS stage. WordPress developers used to hack the snot out of WordPress to get it to do what they wanted, but now, with features like Custom Post Types, Custom Taxonomies and Widgets, WordPress is a legit CMS platform that is even better to use than most of the other popular CMS’ on the market.

There are still plenty of developers and designers (mostly developers) who don’t believe in the power of WordPress. They don’t believe that WordPress is a powerful, easy to develop and user friendly CMS that is actually being used to build “real” websites and not just blogs. But they are wrong.

WordPress is being used all over the interwebs for more than just blogs and by some really powerful names and companies. WordPress.org has a really great showcase of websites that are powered by the mighty WordPress; full CMS sites, blogs, e-commerce, business, education and colleges.

Here is a few of my favorite websites that are showcased on WordPress.org:

mashable

arcadefire

omgubuntu

spotify

kimkardashian

uxbooth

mozillalabs

odysseybmx

bungobox

techcrunch

playstation

mikeroweworks

surfermag
sylvesterstallone

Well, if Rocky uses it, then I think WordPress has finally arrived.

This is a snippet I’ve been looking for for a very long time now but have never found a legit solution. Some script functions do a warning pop up or only partially disable right-click, but this little snippet completely disables it. To disable right-click is really great if you are trying to protect photos from getting stolen or things like that and I know a lot of designers and developers hate when a web site takes control over basic browser functions. But privacy is becoming a huge deal on the internet and in some case its important to protect yourself, your images and your designs from being blatantly stolen right off your digital property.

Here’s the snippet, sweet and simple – oh, don’t forget to include jQuery: (big thanks to Codrops.com for this fantastic snippet)

<script>
$(document).ready(function(){
$(document).bind("contextmenu",function(e){
return false;
});
});
</script>

The color red is a very strong, vibrant and energetic color. Red is a high visibility color, which explains why its used for stop and warning signs – but it doesn’t necessarily represent a stop or warning, its simply a color that grabs the users attention. Red is a hot color, an exciting color that can cause emotion in the user; passion, anger, lust, sex, aggression or excitement. It’s also used to portray pride and strength because it is a bright bold color.

In any case red is a color demands the users attention, so it can be a tricky color to use when it comes to web design. Red can be very overwhelming on a computer monitor so a lot of designers refrain from using it, that is why the web is filled with blue’s and green’s – much easier to deal with on the web. But red is a really great color when designed and used correctly – when I was nine I claimed it as my favorite. Here are some great, well designed red websites for your inspiration that use the mighty red (and not just an accent color).

http://www.zis.es/

http://www.polyesterstudio.com/

http://www.foodily.com/

http://www.zag.gy/hello

http://www.bipcreativa.com/

http://www.twitjustice.org/

http://www.mcmillerssweetsemporium.co.uk/

http://struckaxiom.com/work

http://www.lbdsociety.com/

http://www.neverabettertime.co.nz/

http://collisionlabs.com/

http://thisispopa.com/

http://www.flywhitespace.com/

http://thelitpub.com/

I still haven’t figured out what this site is or does but I think its pretty damn rad. The animation on this site is brilliant and extremely fun to watch… it reminds of playing Donkey Kong on the Atari 2600. I think my favorite part about Seamco.be is the announcement box with the hopping bottles. Head on over and give it a gander, you’ll be pleasantly surprised.

There are a ton of different ways to include jQuery in your WordPress theme, but after I stumbled upon this snippet I have never turned back. Brought to us by the pure genius of Chris Coyer – CSS Tricks – this snippet is a simple PHP function to add to your functions.php file. The real benefit to this is that you can avoid loading jQuery multiple times if you have plugin, widgets or anything else that requires jQuery.

Here’s the code:

if( !is_admin()){
wp_deregister_script('jquery');
wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"), false, '1.4.2');
wp_enqueue_script('jquery');
}

Thanks CSS-Tricks.com!!!

I was browsing Forrst.com the other day and came across a website redesign post for SpyllPaints.com – today’s kick ass site of the week. Now, I love portfolio sites because most of the time these are the most well designed, thought out sites on the web and this one is no different. The first thing that really caught my eye was the unique navigation buttons and rollovers. I’m always a sucker for really unique navigation – probably because I can’t ever seem to design a really unique navigation.

SpyllPaints.com has a really good consistent brand through out the site and I absolutely love the contact form that resides in the footer of every page. Great typography, great hover usage and a really great, attention grabbing color scheme. Just glancing through the portfolio, Sylvia Birns-Sprague is definitely a great designer/artist/programmer and her portfolio enhances and reflects that talent.

Today’s Kick Ass Snippet is a nifty little WordPress snippet that allows you to add pagination to your posts anywhere without using a plug in. I was working on a project recently and needed a better solution for pagination, I tried a few plug-ins but never fell in love with any of them and then I found this snippet on WP-snippets.com and it solved my problem.

This snippet creates a pagination style just like the WP-PageNavi plugin and its pretty easy to install. You’ll just need to start by adding this snippet to your functions.php:

function pagination($prev = '«', $next = '»') {
global $wp_query, $wp_rewrite;
$wp_query->query_vars['paged'] > 1 ? $current = $wp_query->query_vars['paged'] : $current = 1;
$pagination = array(
'base' => @add_query_arg('paged','%#%'),
'format' => '',
'total' => $wp_query->max_num_pages,
'current' => $current,
'prev_text' => __($prev),
'next_text' => __($next),
'type' => 'plain'
);
if( $wp_rewrite->using_permalinks() )
$pagination['base'] = user_trailingslashit( trailingslashit( remove_query_arg( 's', get_pagenum_link( 1 ) ) ) . 'page/%#%/', 'paged' );

if( !empty($wp_query->query_vars['s']) )
$pagination['add_args'] = array( 's' => get_query_var( 's' ) );

echo paginate_links( $pagination );
};

Then add this code – pagination() - to where you want to add your pagination, outside the loop but inside the if( have_post() ) statement, like this:

<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
// post goes here
<?php endwhile; ?>

<div><?php pagination('»', '«'); ?></div>

<?php endif; ?>

Here are the CSS classes to use when styling:

<pre><code>.page-numbers { font-size: 15px; }
.page-numbers.current { color: #222; }
.page-numbers .dots { letter-spacing: 1px }
a.page-numbers { font-size: 14px; color: #3888ff; }

Thanks WP-Snippets.com and @pjrvsWP for the great snippet!

WordPress is the most popular blogging platform in the world, for very good reason, its freaking awesome. WordPress is also one of the hottest opensource CMS platforms used today, so if you’re a web designer or developer that doesn’t know WordPress I think its about time you get your self educated.

There are a lot of articles floating around the web for learning more about WordPress, and there are many, many, many books written on WordPress from blogging to theme development to plugin development. But WordPress – just like everything else on the web – changes pretty quickly and WordPress is constantly adding new features. So if your learning WordPress, or planning on learning WordPress, its important to have some good resources that are being updated regularly.

Here are the top 8 online resources for learning WordPress. These resources are devoted to educating you about everything WordPress and presenting new information as things evolve.

wptuts

WPTutsplus.com is a great site for the beginner or the advanced WordPress designer or developer. In the tradition of Tutsplus, WPTutplus is chalk full of tutorials, videos and articles about the mighty WordPress.

wpbeginner

WPBeginner.com is one of the first resources I used to start learning about WordPress. Lots of tutorials and articles about everything from theme development to Facebook integration to popular blogging plug-ins. Its geared more toward the beginner, but since WordPress is constantly evolving, even the advanced developer can pick up a few new tips.

wpgarage

WPGarage.com is a great resource for current tricks, tips and hacks – if you need them. The content is updated often and is usually on the cutting edge of WordPress development.

wordpress codex

The WordPress Codex is probably the best resource for learning everything WordPress. Its WordPress under the hood. The Codex is updated all the time with new content to keep you updated and it has hands down the best WordPress user forum. If you’re not using the Codex as you develop, you should be.

wpcandy

WPCandy.com has everything from WordPress news to tutorials to blogging tips to reference charts… pretty much everything you need to kow about WordPress.org or WordPress.com. WPCandy is also a great place to learn everything BuddyPress as well, if you’re into that kind of thing.

wpdesigner

WPDesigner.com is great resource for any WordPress designer or developer, whether you are a beginner or expert. The topics range from hosting to theme development and they also have their own little free theme marketplace if you need a good WordPress theme.

wordpressmax

WordPressMax.com, “WordPress Guides for the Geek Impaired” is a great place for the WordPress beginner. Most posts are tips and tricks for improving your WordPress site or blog. More centered for the WordPress webmaster, WordPressMax also has some really great development tips and tricks.

wordcamps

WordCamps are awesome. WordCamps are live conferences in your local area with your local WordPress experts. Generally WordCamps are a one or two day event focused on everything WordPress.com or WordPress.org. Because talks are generally from your local neighborhood experts its also a great place to meet WordPress experts and also network with other WordPress designers in your area. Check out WordCamps central page to see when and where your local WordCamp is being held.

Since its Friday, its time for another kick ass site of the week. This week I’ve picked Zennaware.com/cornerstone, a app development website. This site has got a really nice clean, Apple-ish layout and style. It has a lot of content but the use of negative space and type make it easy to consume and navigate. Plus, its got a couple little extras like animated tooltip hovers. Pretty cool site, go check it out. Zennaware.com/cornerstone

App Preview

Store

Blog

This weeks kick ass snippet of the week is purely just a fun and simple one. Using CSS transition and text-shadow you can create a nifty little CSS hover blur effect on hover:

<h1 class="blur">Hover to watch the blurring magic happen</h1>

.blur{
color: #444;
font-size:24px;
font-family: sans-serif;
/* set the transition */
transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-webkit-transition: all 0.25s ease-in-out;
}

.blur:hover{
color:transparent;
/*set the amount of blur with text-shadow */
text-shadow: #555 0 0 5px;
cursor: pointer;
}

Hover over me to watch the blurring magic happen right before your very eyes