How to Install and Setup the WP Slick Slider

The WP Slick Slider has become one of my new favorite sliders to use! Follow the tutorial below to setup your WP Slick Slider.

A Quick Note Before We Get Started
You will need about 3-5 images all the same size.

Install WP Slick Slider Plugin

Step 1. The first thing we will need to do is install this plugin. To do this, click on “Plugins” then “Add New”.

Step 2. In the search box type in WP Slick Slider. Click on “Install Now” then “Activate”.

Create Photo Slides with WP Slick Slider

Step 1. You should see Slick Slider on the left of your screen. Please click on “Slick Slider” then click “Add Slide”.

Step 2. Fill out the info as shown in the picture below.

Please Note: the Description and Read More Link are optional. You do not have to link your images unless you want to.

This slider works best if you use the same size for your photos. The photos on the Editorial Avenue demo site are 600×600.

Step 3. Click “Publish” when done.

Step 4. Click “Add Slide” again to create more photo slides. Follow the same steps as before.

Add the Carousel to Your Site

The following steps will show you how to add the Carousel slide that you see on the Editorial Avenue’s demo site. If you would prefer to show only one full width photo at a time… please see the other tutorial below.

Step 1. Click on “Appearance” then click “Widgets”.

Step 2. Click “Custom HTML”, choose “Photo Slider” from the dropdown, then click “Add Widget”.

Step 3. Add this code in the widget then click “Save”.

Step 4. Your widget should look like this:

Customize

You can change the height (not the width) of your photos by changing the number 450 to a bigger or smaller number depending on how tall you would like your photos.

Add a Full-Width Photo Slide to Your Site

You also have the option to show one full width photo instead of the carousel. This option will also allow you to include a title, description, and a Read More button if you like.

Step 1. If you would like to display a Title, Description, and a Read More button on your photo slide… be sure that your photo slides include a description and the “Read More Link”. To do this click on “Slick Slide” (left side of your screen) then click on one of your slides. All fields should be filled out like the following image.

Step 2. Click on “Appearance” then click “Widgets”.

Step 3. Click “Custom HTML”, choose “Photo Slider” from the dropdown, then click “Add Widget”.

Step 4. Add this code in the widget then click “Save”.

Step 5. Your widget should look like this:

Remove Title, Description, and Read More Button

If you would prefer to not show the title, description, and read more button… simply remove design=”design-2″ from the code in the widget.

Customize

You can change the height of your photos by changing the number 450 to a bigger or smaller number depending on how tall you would like your photos.