WordPress website designed with a little jQuery
I have just made another website using WordPress as a CMS for an international internet service provider.
I worked for quite a while on the design stages with the client. We went through 14 visuals for the home page before I started to work on coding the WordPress theme. Here is one of the last of them:
jQuery and the power of blogging
One of the most exciting parts of the website for me was creating an image slider with jQuery. The client was particularly keen on having clickable sliding panels like the ones that can be seen at BarackObama.com. So how was I going to find out how to do that?
The answer was already on my own website in the shape of a comment by Jaitra Gillespie on a post about JavaScript I’d written a while ago. In it he posted a link to a jQuery coda slider that had a particularly good accompanying tutorial and screencast. This is what I used for the panels beneath the top navigation.
If you click the above image to go to the website you’ll see that not only do the buttons beneath the panels operate them but also the links in the text below.
I’m grateful to both Remy Sharp for the excellent tutorial and Jaitra Gillespie for putting me on to it.
Designing and developing the website with WordPress
After I did the theme and the image slider there were still other things to do.
I used NextGEN gallery for the image gallery. There was a slight conflict between the JavaScript calls in the head for the jQuery coda slider and the NextGEN plugin which caused the Shutter and Thickbox image presentation effect not to work. I moved the (and therefore the NextGEN JavaScript calls) to after the jQuery JavaScript calls in the head and this seemed to get it to work.
I created different categories in the blog section, one being “Latest News”, and had the 10 most recent posts of that category listed in the sidebar. I also added a contact form with Contact Form 7 plugin, a chat room, various static pages and a site-wide social bookmarking and networking link.
What do you think?
Have you ever used WordPress as a CMS to create a site? Have you ever used jQuery to create a coda slider? What do you think of the way I did it?
Hey nice work Rob, glad to see that my jQuery slider link proved to be of some use.
On a related topic, in recent months I finally got around to putting together a WordPress based portfolio website, with a slider in place to feature content, although in this case I didn’t take my own advice and rather used jcarousellite—mainly because I started development before the jQuery for Designers approach you employed came to my attention:
http://www.specialops.co.nz
Funnily enough, although this is typical with the fast paced world of web development, I probably would use a different slider approach if I was starting over—jQuery Cycle Plugin.
From one designer to another, I would also preface showing my website by saying that it is still in development, and yet to have any of my best work added
Hi, Jaitra, I’ve had a look at your website with the slider and it looks really good. I really thought that slider I used was fantastic though – thanks for the link originally.
And as with everything with WordPress, just after you do something really difficult you realize there’s a plugin that does it for you. WP Featured Content Slider looks pretty good maybe that could be adapted.
But anyway, I look forward to seeing you add to your site. Please pop back here sometime as I regularly give advice about WordPress and web publishing in the blog. All the best!
Hi. I’m french. Your post can interest lot of people in France. So, if you re ok, i can copy it on a french blog.
Obviously, Malus, you would have to provide a link back to this site with a proper credit. Please get back to me about this.