The Soliloquy Slider has become one of my favorite sliders to use! Follow the tutorial below to setup your Soliloquy Slider.
Note: The Soliloquy Slider plugin is free but it does offer an upgrade if you would like to use it’s additional features such as a Carousel, Lightbox, Scheduling, and more. The upgrade is not required to set it up like the demo site.
1. The first thing we will need to do is install this plugin, if you haven’t already. To do this, click on “Plugins” then “Add New”.
2. In the search box type in “Slider by Soliloquy“. Click on “Install Now” then “Activate”.
3. Now click on “Soliloquy” on the left hand side near the bottom. Then click on “Add New”.
4. Give your slider a Title (such as “Homepage Slider”) then upload or choose the pictures you would like to use in your slider.
5. After the pictures have been added you can now click on them and drag them up or down to rearrange them.
6. Next we need to configure the slider settings. Click on “Config” then change the numbers 960 and 300 to the correct size for your theme listed below.
- Her Exclusive – change 960 to 1280 and 300 to 400
- Beyond Madison – change 960 to 1280 and 300 to 400
- Ellie Jane – change 960 to 1280 and 300 to 500
- Exquisite – change 960 to 1240 and 300 to 500
- Kate Marcado – change 960 to 2400 and 300 to 700
- Emmy Blake – change 960 to 2400 and 300 to 900
- Hailey Wells – change 960 to 1280 and 300 to 500
- Kylee More – change 960 to 400 and 300 to 600
- Classy Ink – change 960 to 1280 and 300 to 500
Please note: you can change the height (the second number) to any number you prefer but the width needs to stay as listed above.
7. Click “Publish” then you will see some code under “Soliloquy Slider Code”. Copy the first code (called a short code).
8. Now we can add it to your homepage. Click on “Appearance” then “Widgets”.
- Her Exclusive Theme – Add the short code you copied in step 7 to the “Custom HTML” widget you added in Front Page 2. Place the code, in the widget, below your content/testimonial.
- Kylee More Theme – Click on “Custom HTML” widget then choose Front Page 1. Add the short code you copied in step 7 to this widget.
- Ellie Jane Theme – Click on “Custom HTML” widget then choose Front Page 1-Slider. Add the short code you copied in step 7 to this widget.
- Beyond Madison Theme – Click on “Custom HTML” widget then choose Front Page 1. Add the short code you copied in step 7 to this widget.
- Classy Ink – Click on “Custom HTML” widget then choose Front Page 1. Add the short code you copied in step 7 to this widget.
- All Other Themes – Click on the “Custom HTML” widget and choose “Home Slider” from the drop down options. Add the short code you copied in step 7 to the Content box.
9. Click “Save” then view your site.
Adding a Text Box to your Image
1. If you would like to add a text box to your picture go back to “Soliloquy” then click “Edit” for your slider.
2. Next click on the blue pencil icon to edit your pictures information.
3. Fill out the information in “Title” and “Caption”. If you would like your slider to link to a specific page then enter the URL of that page too. Click on the picture below to see a bigger image.
4. If you would like to add a clickable call-to-action link in the text box this is how. Under caption add this code:
- Where it says “Place Your Text Here.” change that to your own text.
- Where is says “https://studiomommy.com” change that to the link of a page on your site.
- Where it says “Read More” change that to your own call-to-action like “Let’s Go!”.
7. Click “Save Metadata”. Then click on the “x” to close this window.
8. One more important step. After you click the “x” button to close the window… you will be taken back to the Soliloquy slider setup. Be sure to click “Update” on that page or your new text box will not appear.