Image sliders

This page shows how to create the image slider used in the header ———^

Note: a slider is a collection of images organized in slide categories, so we need to create a new category first.


Create a category

In your dashboard, look for “Slides” and click on “Slides Categories.”
All slides
Give it a name, a slug (e.g. – the underlined part of http://publish.uic.edu/campus-architecture/) and a short description. The description is optional, but it may help with organizing large amounts of sliders. Click the blue “Add New Category” button at the bottom.
Add a new category

Add a slide

Now that we have a category, let’s add a slide. Click “Add New” in the dashboard menu.
Add new slide

Give your slide a title, a short caption, and a description. The description is optional. The description can be set as white text on a dark background or black text on a white background. To choose your setting. Go to Appearance > Theme Options > Slider Settings > Slide description block color.

Clicking on the image will take the user to the link.

Add a new slide
(This is what the caption and description will look like when you place the slider on your page. Please note the name of the slide does not appear.)
What the caption and description look like
Be sure to select a category for this slide, or it won’t appear anywhere. In this demonstration, the slide will go in Campus Architecture.
Slide categories

Add an image to the slide

Click “Set featured image” to add an image to this slide.

To keep the page from adjusting and resizing to accommodate different image heights, we recommend using images cropped the same way for each category.

Recommended image dimensions:

1000×200 pixels
1000×300 pixels
1000×400 pixels

Slide featured image
If you want to save it privately, click “Save Draft” in the Publish block to the right. Otherwise, click the blue “Publish” button.
Publish your slide

 


Add the slider to a page

Select the page that will host the slider.

 Select a page

On the right of the page edit interface will be a block titled “UICNetwork Page Settings.”

Set “Slider” to “on” and choose your Slides Category. In this case, it’s “Campus architecture.”

 Add a slider to a page


Adjust slider settings

You can adjust slider settings such type and speed of slider animation from Appearance > Theme Options > Slider Settings. Remember to “Save all Settings” before navigating away from the settings page or you will lose the changes you make.