I am proud to announce an all new version of the venerable Independence Day WordPress theme:

http://imjtk.com/Independence-Day/

When Luke and I asked Google the other day it had over 150,000 links for the old theme, so it is by far my most popular free wordpress theme, but it was starting to show its age. So I have created an all new version.

Version 3 is a semantic, Fixed Width, HTML5, All American WordPress Theme. It features custom-menu, sticky-post, microformats, rtl-language-support, translation-ready, post-formats, and custom thumbnails.

Everything is vibrating constantly, even things that seem solid (nothing is really solid…) – and with our eyes, ears, touch, etc we take in these vibrations.

This is not new-age mumbo jumbo, this is physics, science. So be it wavelength’s of light we can interpret with our eyes, or sound waves we can interpret with our ears – we are are constantly bombarded with vibrations.

Things like wood that appear solid are not, but rather highly organized sea’s of energy that we interpret, with the tools that we have, as solid.

What makes us who we are, individually, is how we decide to deal with these vibrations – by a large measure that is the only thing that we are really free to do, to decide how we want to deal with the vibrations that we are exposed to.

Of course our reactions produce yet more vibrations, and this is where the new-age mumbo jumbo starts

You can either send out (with apologies to Brian Wilson..) good vibrations or negative vibrations, freedom is really just the ability to choose what kind of vibrations you produce – but if you *do* anything, you are (this is science again…) creating vibrations that will be there for other people to experience.

Everyone chooses how they react to the vibrations they are exposed to. Most people do so without being aware of it – but the human condition, being what it is, means that no-one is exempted. We all have a choice, each day, each hour, each minute. We can either consciously decide how to react to this constant bombardment of vibrations or we can pretend that we don’t have control of the only thing that we actually are afforded control over.

I just wrapped up a new custom wordpress theme for 5 Minds Computing. The client had a very specific idea about how he wanted it to look, sort of a retro-tech vibe. The client is happy with the results, and I think all things considered it turned out well. As simple as it looks there are some very cool features under the hood including the css rollovers for the WordPress menuing system that I wrote about previously.

As always, if you are interested in a custom wordpress theme for your site, just click on over to the contact page and drop me a line, I’ll be more than happy to read over what you are looking for and we can discuss how we can implement a winning wordpress solution for you.

The first thing that you will want to do is familiarize yourself with WordPress’ query posts. As with most things WordPress there are a myriad of ways that you can use query posts, the simplest of which is something like this:

query_posts( 'posts_per_page=5' );

Which simply means to show only 5 posts. Obviously this is not very useful, but like I said, this is the most basic implantation. What query posts is really doing is telling the database to alter what it spits out when we ask it to display WorPress posts. This has its drawbacks as it alters main loop and once you use it it changes everything else after it – which is what you want for showing a featured post, but may not be what you want once the featured post section ends. One way to get around this is to say:

 wp_reset_query()

when you’re done with the section of the theme that you are altering.

Building upon the earlier example, there are other variables that you can feed query posts, ala:

query_posts('cat=3&year=2004' )

This tells query posts to ask the database for only the posts that are in the category with an ID of 3 and published in 2004. Again this is very simple but will get the job done, but I prefer to build a query in a variable. This gives you much more flexibility and is more readable imho, so without further ado here is how I create a custom posts section.

<?php $my_query = new WP_Query('category_name=Featured&showposts=1&offset=4');
       while ($my_query->have_posts()) : $my_query->the_post();
       $do_not_duplicate = $post->ID; ?>

What this means is that I am filling the variable my_query with the parameters that I want for my featured post area, in this case only posts that are in the category named Featured, and I only want to show 1 post from that category, and I am giving it an offset which means dont give me just the latest post in that category but the 5th latest. So if you wanted the latest post in that category you would leave the offset parameter out all together and if you wanted the 2nd newest the offset would be 1, etc.

After this bit of code would be where you include your loop ( yes the entire loop, this code will make sure you only display what you are asking for ). After the loop, make sure you close the while that we started at the beginning of the example, like:

<?php endwhile; ?>

And that will do it. Remember to reset the query as explained earlier after all this so that anything after the featured post will work as expected.

So – I had to let go of my crutch and figure it out on my own, and, after much Knight Ridering ( another inside joke, I love you P. ) I finally figured it out. Jenny was there for this whole process – and at the end I said – and you know what the best part of this is – and my smart gf said “You can write about it and be the first result in Google for WordPress menu with sliding door css” – is there any doubt why I love her so?

So, without further ado, here is how it works.

If you don’t know what “sliding doors” is, it is a css technique where you use 2 different background images that slide back and forth under some text so that a background image can stretch to fit the text on a button with variable length of text. Basically it is a slick way to create buttons with css and background images.

The problem with doing this in WordPress is that you have the WordPress menuing system that you include with a few lines of php code instead of building an un-ordered html list like all of the sliding door examples. Most examples of sliding doors include wrapping the link inside of a span as well as the a ref link – the span for one door, and the list item link for the other door.

So – the first step is to get the wordpress menu links wrapped in a span:

     <?php wp_nav_menu( array(
	'menu' => 'primary' ,
	'link_before' => '<span>' ,
  	'link_after' => '</span>' ));
?>

This code replaces the standard wp menu call. It will not break anything even if you don’t use the rest of this code, all it does is wrap the link text in a span.

So we now have the output that looks like the examples of the sliding doors, what we will do now is style it. No matter what you call your menu or the id for the menu wordpress will add a list called menu-primary-container to it so we’ll use that:

.menu-primary-container{
   overflow: auto;
  display: block;
  float: right;
    height: 134px;
    width: 100%;
}

.menu-primary-container* {
  padding:0;
  margin:0;
  font-size: 13px;
  text-transform: uppercase;
}

.menu-primary-container ul {
  display: block;
  float: right;
  padding: 10px 0 0 0;
  margin: 90px 70px 0 20px;
}

.menu-primary-container ul li {
  list-style: none;
  float: left;
  margin: 0 0 0 5px;
}

That is the set up, now we’ll style the list items and the spans:

.menu-primary-container ul li a {
  background: url(images/nav_right.png) top right no-repeat;
  display: block;
  padding: 0 13px 0 0;
  color: #c42b1c;
  text-decoration: none
}
.menu-primary-container ul li.hover a, .menu-primary-container ul li a:hover {
  background: url(images/nav_selected_right.png) top right no-repeat;
  color: #fff;
}

.menu-primary-container ul li a span {
  background: url(images/nav_left.png) top left no-repeat;
  display: block;
  padding: 5px 10px 10px 23px;
}
.menu-primary-container ul li.hover a span, .menu-primary-container ul li a:hover span{
  background: url(images/nav_selected_left.png) top left no-repeat;
}

When you cut your images for the buttons you will want just the corner of the right side and everything else of your button will be for the left side. Of course the selected images will be the same – just for the roll over.

And there you go – sliding door css with the WordPress menu, turns out I didn’t need google to figure this out, I just need Jenny

I’ve been posting about the Shopp WordPress plugin lately, so I thought that I would post the first project that I completed with it and the new framework I have been using – so here it is Neurvana Edge. The code is just a pretty as the site itself . As flexible as Shopp is, I still had to hack it a little to make it do exactly what the client wanted, but in the end I think his custom e-com wordpress theme came out very well indeed.

Hey Now! I have completed the first new custom WordPress theme with the new framework – It was difficult giving up my venerable old framework that took me years to create but it was time for something new, clean, and modern. The results are impressive – it took some time to get up to speed but I am very comfortable with it now and my WordPress themes will now all be fresh and state of the art.

More importantly the client says: “It looks great, Great Job! – The CSS is excellent, I am not going to have any problem if I need to make changes. Your work is excellent. ~ J”

From time to time i get to do some pure design work, and today I got to design some online ads for a carpet cleaner in New Jersey. I used to design banner ads allot, back in the hey-day of banner ads, so this was like a trip down memory lane for me.

If you are interested in hiring me to create some ads for you, or for some design work in general – not to mention a custom wordpress theme, just click on over to the contact form and get in touch with me.

I’ll discuss it with the first person that asks me about it