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

New from ReadyTalk - Quick Share My Desktop

New from ReadyTalk - Quick Share My Desktop Hot off the press - we've just released an enhancement to our Quick Launcher product (available on Windows today and Mac next week). The...

Internet-wide Security Risk: How ReadyTalk is Addressing “Heartbleed”

It’s been all over the news: a major vulnerability in the encryption technology used across much of the Internet was recently discovered. The vulnerability causing these issues is...

Webinars: The Gateway Drug to a Video Marketing Strategy - Q&A Session Review

We recently hosted a webinar with the video marketing gurus over at Vidyard to dive into the idea of launching a video marketing strategy with the materials most of us already have...

Nobody is Watching Your Webinar and How to Fix It

Content is everywhere and in every form – videos, tweets, blogs, forums, whitepapers. I recently read an article that said by 2020 the amount of information on the Web is expected...

New from ReadyTalk - Modern meeting controls and VoIP enhancements

You may have noticed more frequent changes from ReadyTalk lately. In an effort to keep our controls fresh and functional for all of our different users we are continuously...

Comparing the Value of Webinar Leads vs. Email List Leads

Over time, marketers have innovated and refined many online avenues for lead generation, but the legacy email list continues to remain a top favorite. Viable alternatives, such as...

Feature Friday: How to Upload Your Video Clip

  Why Use this feature? I think it is safe to say that everyone hates when they see the word “download”. And the last thing someone wants when hosting a web conference is to lose...

The 8 Most Common Audio Conferencing Issues

Audio conferencing affects every area of business. From customer service to investor relations, poor audio quality is associated with a lack of professional competence. In order to...

Feature Friday: Promoting to Co-Presenter vs. Granting Control...What's the Difference?

Visit the ReadyTalk blog every Friday to learn more about a ReadyTalk feature.   We get a lot of questions on the difference between granting control and promoting someone...