Slider Pro (Free Edition) Image Borders

Resolved shukero
(@shukero)

1 year, 7 months ago

Hello,

First off – THANK YOU for making such an outstanding FREE plugin for image carousels! I’ve been looking for several hours straight, trying to find a carousel plugin that actually works, and yours is the BEST BY FAR.

Onto my question though – is there a way to add a boarder around all of my slides within the carousel? I’ve tried using CSS / html to each individual slide with no luck. (It would be amazing if this was an option within the slider settings itself)

Thanks in advance for your help!
~Mike

Viewing 5 replies - 1 through 5 (of 5 total)

Plugin Author bqworks
(@bqworks)

1 year, 7 months ago
Hi Mike,

Thank you for the compliment!

If you want the border to be around the whole slider/carousel, not just individual slides, you can use this CSS:
```
.sp-mask {
    border: 5px solid red;
    box-sizing: border-box;
}
```
If you want to add it around individual slides, you can use this:
```
.sp-image-container {
    border: 5px solid red;
    box-sizing: border-box;
}
```
Best,
David
- This reply was modified 1 year, 7 months ago by bqworks.
Thread Starter shukero
(@shukero)

1 year, 7 months ago
Hello David,

Thank you for the quick reply! Sorry to bother you again, but I’m pretty new to CSS so I have a few additional questions based off the answers provided above:

1) Where would I apply each of the snippets of CSS code above in each case?
a) I can’t find the spot to apply a border around the entire carousel

b) I’ve tried to apply the code above for “each slide” within both the “DIV” layer of the slide as well as the raw html aspect of the slide without any success.

2) Off topic, I’ve been creating some layers for one of my slides; in essence creating a “text over image” slide with animations; however, I can’t get paragraphing to work within the “div” layer. I’ve added the below into two separate “div” layers so that I can have a heading slide in, then have some text slide in afterwards which contains several paragraphs marked out in the code, but for some reason; the preview shows the paragraphs splitting / line breaking correctly, but the slider on the actual page does not have the paragraphing / line breaking correctly displayed:

Heading code: <h3 style="color:white; font-size:14px"">Testing Header</h3>
Text code: <p style="color:white; font-size:11px">This is the first paragraph I want to add in with a blank space underneath it</p> <p style="color:white; font-size:11px">This is the second paragraph I want to add in with some <b>bold text at the end</b></p>

I want the coding above to look something like this:
“Testing Header

This is the first paragraph I want to add in with a blank space underneath it.

This is the second paragraph I want to add in with some bold text at the end.”

Again – I really appreciate all of the help!
~Mike
- This reply was modified 1 year, 7 months ago by shukero.
- This reply was modified 1 year, 7 months ago by shukero.
Plugin Author bqworks
(@bqworks)

1 year, 7 months ago

Hi Mike,

You can add the CSS code in Appearance -> Customize -> Additional CSS.

Regarding the layers, differences between the preview and the published slider might be due to external CSS that affects the slider, but I can confirm this only if I take a look. As an alternative to using a DIV layer you could add the paragraphs into two separate paragraph layers.

Best,
David

Thread Starter shukero
(@shukero)

1 year, 7 months ago

Hi again David,

Thanks for all of the help. I can confirm that adding the CSS to the Additional CSS section of the customization menu did the trick.

I really appreciate all of the help; and you taking a look at the DIV problem. I can confirm that I don’t believe that their is any additional / external CSS (That I know of anyway) outside of the theme I’m using, which in “Nirvana”.

Thanks again for all the help!
~Mike

Plugin Author bqworks
(@bqworks)

1 year, 7 months ago

You’re welcome, Mike!

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Slider Pro (Free Edition) Image Borders’ is closed to new replies.

Views