MEET SITKA | A super-customizable modern WP theme!

Okay
  Print

Use Redwood's Slider as an Image Gallery

Redwood's featured area slider allows you to highlight posts and/or pages of your choosing. If you would prefer to use the slider as an image gallery instead of a featured post/page element, it's very possible to do! 




1 ) CREATE PAGES FOR YOUR IMAGE(S)

Because the slider only recognizes posts or pages, we'll create a series of "dummy" pages. For each image you'd like to feature in the slider, you can create 1 dummy page. 

Give the pages any title you'd like. 
Assign one of your desired images as each of the page's "Featured Image". 
To learn how to assign one, check out: How do I add a Featured Image?

When finished, publish each page. Don't worry, these pages won't be visible to your visitors unless you add them to your navigation menu. 


2 ) DETERMINE YOUR PAGES' ID NUMBERS

Next, we'll need to determine the unique ID numbers of each dummy page you just created. Every time you publish a post or page, WordPress assigns it a number. We will use our newly-created dummy pages' ID numbers to target them for the slider. 

To learn how to determine a page's ID number, please check out: How to determine a post, page, or category ID

Note down each of your dummy page's ID numbers. 


3 ) ADD YOUR IMAGES TO THE SLIDER

Navigate to WP Dashboard > Appearance > Customize > Featured Area Settings

Where it says "Select featured post/page IDs", enter your pages' ID numbers into the field. 
Please be sure to separate each page ID with a comma. 

Your dummy pages should now be displaying in your slider. 


4 ) HIDE THE SLIDER'S TEXT & HYPERLINK OVERLAY

To then hide the text overlay and the hyperlink function that covers the slider's image (so visitors can't click through to your dummy page), you can navigate to WP Dashboard > Appearance > Customize > Custom CSS, and copy & paste in the following code:

.feat-overlay {display: none;}


If you would also like to hide the left and right arrow icons that appear when you hover over your slider, you can copy & paste the following into your Custom CSS box as well:

.featured-area .bx-controls-direction {display: none;}


5 ) ADJUST YOUR SLIDER'S AUTO-ROTATE SPEED

Lastly, if you'd like to adjust the speed at which your slider auto-rotates through the different images, you can reference the following article for the necessary steps: Adjust Redwood's Slider Speed