How to Use the Carousel Section

Latest revision as of 04:36, 2 April 2012

The Carousel Section is a powerful section that allows you to easily showcase your posts and pictures. You can use it to display thumbnails of all of your posts starting with the most recent, or you can select specific post categories. When showcasing pictures, a user can easily scroll through thumbnails, click on one, and view the picture in full screen. You can choose between hosting the images on your site using the NextGEN Gallery plugin, or you can display your images on a Flickr.com account.

To view some examples of a Carousel, click on our Core demo site.

Enable Carousel

There are different ways to set up the Carousel section.

Create a new page using the "Carousel Page" template

Create a new page

From your WordPress Administration Panel:

1. Select the "Pages" panel, then "Add New"
2. Enter a title for your new page
3. Under "Page Attributes" click the "Template" dropdown
4. Select "Carousel Page"
5. Click "Publish"
6. Click "View Page"

You will now see an empty Carousel on your new page

Enable Carousel on existing page

Enable on existing page

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Templates"
2. Select the Template Area that you want the Carousel to go
   1. If you select the "Page Templates" area, by default the Carousel will be displayed on every page that is assigned to the Page Template you choose
   2. If you select "Header" "Morefoot," or "Footer" areas, by default the Carousel will be displayed on every page regardless of the Page Template
3. Drag the "Carousel" section from the "Available/Disabled Sections" over to the "Displayed Default Page Sections"
4. The Section Order will save automatically

You will now see an empty Carousel on every page that the Carousel is active on

Hide Carousel on individual pages

Using Section Control, you can control whether or not to show or hide an Active section on a page to page basis

Hide Carousel

From your WordPress Administration Panel:

1. Select the "Pages" panel, then "All Pages"
2. Click to edit the page that you wish to hide the Carousel
3. On the "Meta Panel," click the "Page Setup" tab
4. Under "Individual Page Section Control," click "Hide Carousel"
5. Click "Save Meta Settings"

Because the Carousel section is displayed by default when you enable it, you will need to use this method for every page that you do not want the Carousel displayed

Show Carousel on individual pages

Hide Carousel by default

You can also hide the Carousel section by default, and choose the pages you want to show it on

From your WordPress Administration Panel:

1. Select the "PageLines" panel, then "Templates"
2. Make sure you have the correct Template Area selected for the type of pages you want to hide
3. Under the "Displayed Default Page Sections," click "Carousel Options"
4. Click "Hide This By Default"
5. Click "Save Options"

Now the Carousel section will be hidden by default until you select to show it on the individual page

Show Carousel

1. Select the "Pages" panel, then "All Pages"
2. Click to edit the page that you wish to show the Carousel
3. Under "Individual Page Section Control," click "Show Carousel"
4. Click "Save Meta Settings"

Carousel Meta

These setting with control your Carousel display settings as well as options depending on the Mode that you choose.

Carousel Meta

From your WordPress Administration Panel:

1. Select the "Pages" panel, then "All Pages"
2. Click to edit the Page that will display the Carousel section
3. On the MetaPanel, click "Feature Meta"
   1. Max Carousel Items
      • This option sets the maximum number of items/thumbnails to show in the carousel
      • Default is 30
   2. Carousel Image/Link Mode
      • The Carousel has three modes
        • Flickr Mode
        • Post Thumbnails Mode
        • NextGen Gallery Mode
   3. NextGen Gallery ID For Carousel
      • If you are using "NextGen Gallery" mode, enter the ID number of your gallery
   4. Carousel - Post Category Name
      • If you are using "Post Thumbnails" mode, by default your most recent posts will be displayed. This setting will limit the display to a specific post category
   5. Displayed Carousel Items
      • This option sets the number of images that will be displayed in the carousel at any given time
      • Default is 9
   6. Scrolled Carousel Items
      • This option sets the number of images that will scroll when a user clicks the next & previous buttons
      • Default is 6
   7. Carousel Animation Speed
      • The speed of the scroll animation as string in milliseconds
      • Default is 800
      • If set to 0, animation is turned off
   8. Carousel Image Dimensions
      • If you are using "Post Thumbnails" mode, enter the size for your post images
      • Default is 70x70 pixels
      • For the "Flickr" and "NextGen Gallery" modes, image sizes are set by Flickr thumb sizes and the NextGen Gallery plugin respectively.

Carousel Modes

Flickr

Uses the FlickrRSS Plugin to view images stored on a Flickr.com account.

Download, install, & activate the FlickrRSS plugin

• By default, the Carousel will display random "Community" photos

Flickr

Change flickrRSS settings

From your WordPress Administration Panel:

1. Select the "Settings" panel, then "flickrRSS"
2. Choose your Display number & Group/User/Set ID
3. Click "Save Settings"

Post Thumbnails

Uses links and ‘featured image’ thumbnails from your blog posts

• All of your settings for this mode can be changed in a page's Carousel Meta

NextGen Gallery

Uses an image gallery from the NextGEN Gallery Plugin

Download, install, & activate the NextGEN Gallery plugin

Create a Gallery

NextGen

From your WordPress Administration Panel:

1. Select the "Gallery" panel, then "Add Gallery/Images"
2. Enter a name for your new galley
3. Click "Add Gallery"
   • Remember the new Gallery ID#. You will need to enter it in the Carousel Meta
4. Click "Browse" and select images to upload
5. Choose the gallery you want to upload the pictures to
6. Click "Upload images"