Creating a Marquee in WordPress with jQuery

with Chris Converse
please wait ...
Creating a Marquee in WordPress with jQuery
Video duration: 0s 1h 9m Intermediate Updated Nov 25, 2014


Leverage the power of WordPress and some custom jQuery to create and manage a promotional homepage marquee for your website. Chris Converse covers creating custom content types, uploading graphics, and producing an interactive, animated marquee that shows different captions on smaller screens. The exercise files and code snippets for this course are free to all members, so it's easy to recreate this project for your own WordPress site.

This course was created by Chris Converse. We're honored to host this training in our library.

Topics include:
  • Adding photos to the Media Library
  • Creating a custom post type
  • Adding custom CSS to your theme
  • Retrieving data from the custom post type
  • Injecting HTML and navigation
  • Styling the large and small marquees
  • Reordering the marquee panels
jQuery WordPress

Preview the final project

Hi, I'm Chris Converse and in this course I'm going to teach you how to create a responsive download optimized promotional home page marquee for WordPress. We're going to start by creating a custom post type so that you or your site editors can create content specifically for the marquee. We'll explore an optional free plug-in that will allow you to reorder the Marquee panels in a visual way inside the admin area. And then we'll cover how to retrieve all of the content from these custom post types on your site's home page. With the mark up that we get from WordPress, we'll then create some custom CSS and JavaScript files to transform that HTML into an interactive animated Marquee.

And lastly, we'll manipulate the data for small screens, dynamically changing the caption content to fit on small screen devices. Now throughout this course, I've also created some animated slides that will visually demonstrate the manipulations that we're going to perform in JavaScript so you'll fully understand what these scripts are doing. The exercise files for this course are available to all subscribers of online training library. And just about every line of code is provided in a well organized set of code snippets. So you can simply cut and paste as you follow along. So with that, log into WordPress and let's get started.

Find answers to the most frequently asked questions about Creating a Marquee in WordPress with jQuery .

Expand all | Collapse all
please wait ...
Q: This course was updated on 11/25/2014. What changed?
A: We added one new movie about the dangers of modifying updateable themes.
please wait ...