Things From the Net » Web Development

WordPress Navigation Menus

Jonathan Volks — Fri, 19 Aug 2011 02:28:58 +0000

While working on a large project today at work, I came across something that I have not done before within WordPress, create a navigation menu where the client (with no programming experience) would be able to easily add, update or delete navigation links. Previously I have always just hand coded a navigation menu within the header.php file and if something needed to be changed then I would just change it in the code. But now the client will be adding their own pages and needed this ability.

Spending a half hour or so on WordPress Codex site, I figured out the very easy to implement navigation menu system. Below is a very quick, very basic how to, if you have any questions leave them in the comment field and I’ll see what I can do to answer them.

Step 1) Register the menus with the theme. In your functions.php file add:
add_action('init','register_my_menus');
This will tell your WordPress theme it should be using Menus and will add “Menus” link under “Appearance”.

Step 2) Register menu(s) with the theme. Also in functions.php file add:
function register_my_menus() { register_nav_menus( array( 'header-navigation' => __( 'Categories Menu' ), 'pages-menu' => __( 'Pages Menu' ) ) ); }
This is going to add 2 menu options to your theme locations, Categories Menu and Pages Menu.

Step 3) Add menu output to your theme code.
'header-navigation' ) ); ?>
This goes to your header.php, footer.php, etc. By default it will output in an unordered list.

Step 4) Create your menus and assign them to your theme locations. Creating a menu if simple, just go to the menu link within the admin and follow the forms. There is many options to add navigation links. Also assign the menu you created to the correct theme location.

That is it. There is a lot of options that can be done with menus, for a full list of them visit the WordPress Codex.

Creating a Mobile Website

Jonathan Volks — Sun, 12 Dec 2010 08:35:39 +0000

A few months ago I was tasked with building a mobile website for a client at work. Even though I have been building websites for many years now, I haven’t had the opportunity to build a mobile website. Now the site I was building wasn’t a full replica of the main website but just a small portion that only had a search function. So I didn’t need to mess around with different style sheets.

After talking with co-workers and doing some research online, I actually found out that it is much simpler than I had thought. Now the biggest thing is to create a site that works in all major phones, iPhone, Android and Blackberry. All three major phones have different widths and how do you accommodate when you turn the phone sideways. The first part to handling this is a simple meta code within the tag.

Adding this to your mobile website will allow for your site to auto adjust to the correct size. Without this code, you will have to use the zoom button in order to look at the site. With the code it will appear to look normal.

Now that is just the first step, after that comes the hard part. Playing with your CSS to make it look nice. I’m not going to go into a lot of detail on it but some things that you will need to keep in mind is that a lot of your widths will need to be 100%. If you specify a certain width, especially the main layout then it will look different on different phones. Good luck and have fun.

Keeping Session Alive with jQuery

Jonathan Volks — Fri, 12 Feb 2010 05:16:22 +0000

A while ago I wrote a Coldfusion application that essentially was just a multi-page form. A scenario popped up where users might sit on a page for a long time to answer questions. Specifically more than 20 minutes. Unfortunately, I was unable to change the session timeout within the Application.cfc file due to other conflicts it may cause.

I was stumped on what to do until a colleague just happened to stumble across a blog posting by Brandon Purcell. To resolve my dilemma, jQuery is going to be used to keep the session open as long as the user keeps the page open.

The first step is to create an empty Coldfusion page. Why empty? Just to be sure nothing on the page causes it to hang up. Next, we setup jQuery to call this page every X amount of seconds (just make sure its under your session timeout). The only thing you will need is jQuery. Note that some people like to refresh variable into their scripting language variable but I left it out of this as I wanted to make it friendly to any programming language.