ReadyTalk

Meet with Confidence

Creating a New Website: Integrating a jQuery carousel in to Drupal

Posted by Daniel Linn on
Share this Post:

In ReadyTalk’s new website design, we’ll provide up-to-date, dynamic information to our customers in a number of ways. One of those will be a carousel on the front page of the website. We want to load data asynchronously on to the front page to reduce loading times and we want it to load from Drupal nodes for easy maintenance. We originally went to find a Drupal carousel plugin, but none existed that met our needs.

We decided to use jQuery Tabs since Drupal comes with jQuery installed. It was easy to integrate in to our theme files using the great documentation provided by jQuery Tools. We also installed the jQuery Update module for Drupal to bring jQuery up to speed.

jQuery tabs offers a slideshow plugin for Tabs that makes for a great carousel with some useful features, such as navigation elements, smooth transitions and pause on mouse hover. The only hurdle we encountered with this setup was pulling nodes cleanly in to the carousel.

Loading a node would also pull all the page layout data with it – any associated blocks or theme data would be pulled in to the carousel – not what we want. This solution is simple and works great for loading the content of a node and nothing else. Appending any address with ?ajax=1 will automatically grab the node content by itself, exactly what we want for loading via jQuery. This solution is also applicable to any circumstance where node data might be pulled asynchronously.

So, long story short:

 

All done!

Have you done something similar? How did it work? What are other ways to do this?

This is the third post in the “Creating a New Website” series. See posts one and two for other web site ideas.


Name: Shawn Michaels
Time: Tuesday, September 18, 2012

Thanks for taking the time to discuss this, I feel strongly about it and love learning more on this topic. If possible, as you gain expertise, would you mind updating your blog with more information? It is extremely helpful for me. BY - Drupal Web Design

Comments for Creating a New Website: Integrating a jQuery carousel in to Drupal

blog comments powered by Disqus

Recent Posts

Mobile Optimization Explained

How to Better Market to a Mobile Audience Yesterday, we had the pleasure of sponsoring an AMA Webinar, “Conversion Optimization in a Multi-Device World.” Led by Chris Goward, CEO...

Try out ReadyTalk Video Lab for Your Next Meeting!

Ready to try something new? Check out ReadyTalk Video Lab, an experiential video conferencing and VoIP solution that's ideal for small, interactive meetings. We are asking...

Want One-Click Meetings?

Want One-Click Meetings?   Phone number. Access Code. #. Press *2. Pin number. #. Listen to recording of options. Meeting begins. The traditional method of starting a conference...

Love Your Mobile Phone? So do we.

Love Your Mobile Phone? So do we. You probably spend more time with your mobile phone than you do with your significant other. After all, it’s with you at work, your commute and at...

Stop. Collaborate and Listen.

Stop. Collaborate and Listen. ReadyTalk plays an important role for teams who want to collaborate during meetings. Unlike webinars with only one or two presenters, collaborative...

Meetings! Meetings! And More Meetings! How Much are They Really Costing You?

Are you running from meeting to meeting? Are there clear agendas, action items and decisions being made in all these meetings?  Do you even know why you were requested to attend?...

Technology Tools for Remote Workers

Technology Tools for Remote Workers Telecommuting, remote work and flex schedules are rising in popularity. On a recent webinar, Out of the Office: Tips and Best Practices for...

Improving Your Remote Work Experience

Improving Your Remote Work Experience Being a remote employee can be both rewarding and challenging. You’re often reliant on in-office colleagues to communicate important details,...

How to break up with your provider in 7 steps

Last week, I wrote about how, if you're in a bad vendor relationship, there's no time like the present to break up (see: Valentine's Day is Coming. Time to Rethink Those...