-
Posts
-
I would like to change the layout of the caption background in fullwidth easy slider, so that the captions background looks like the same as a color section with a special heading and a text block.
Basically I would like one single rectangular caption background in the fullwidth slider, currently it creates one caption background for the title and another for the text.
Provided link in private content which shows exactly how I want the layout of the fullwidth slider captions
Hey belinger,
If you add the following code:
#top #wrap_all .custom-color-heading .av-special-heading-tag { background: #fff; width: 300px !important; margin: 0 auto; }Is that what you want to do?
Best regards,
BasilisI think there is some misunderstanding.
I do not want to change anything in the color section/special heading. It was only there as a reference for how it should look like in the fullwitdh slider.In the fullwidth slider, there should be only ONE grey background box, that looks exactly as in the color section (in the link I provided in my first post).
By default fullwidh slider creates two background color boxes for the captions, one for the title and another for the content.Provided a screenshot in private content, I painted a red rectangular in the fullwidth slider, that is how I want the background color box for the title/content caption. Just ONE single big rectangular box.
Hi belinger,
Well, when you have the slider ready, we could try to make it look like that with css.
If you need further assistance please let us know.
Best regards,
VictoriaThe slider is ready on the page I provided in private data above. The slider images are just temporarily examples.
But it doesn’t matter what images are used in the slider, its the grey captions background color I want to change.I want the caption color box/frames to be a single larger box/frame for both the caption title and caption text, instead of two separate boxes.
In the screenshot provided above I draw an arrow of how I want it to look, and the red rectangular I draw is the slider and how I want the caption box too look like, instead of the default separate boxes.
I added the CSS to our page. Is it possible to make the box smaller?
And also remove the darker colored boxes around title and captions text?Hi belinger,
You can try playing with the numbers here
.slideshow_inner_caption { height: 50%; width: 100%; } .avia-caption-title, .avia-caption-content p { background: rgba(245, 245, 237, 0.02) !important; }If you need further assistance please let us know.
Best regards,
VictoriaThanks, It worked for making the box smaller.
How can I position the box in the middle of the slideshow?
Changing height to 50% made the box smaller by cutting off the lower part of the box.Hi,
The authentication failed for me, I will wait for someone else if they can follow up.
Best regards,
BasilisHi belinger,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
.slideshow_inner_caption { height: 50%; top: 26%; }If you need further assistance please let us know.
Best regards,
VictoriaThanks! It looks great, except in mobile.
In mobile, captions for both color section and full-width slider are not centered/in the middle of the section.
Any CSS code for aligning it better in mobile?Hi belinger,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
#full_slider_1, #full_slider_1 .av_slideshow_full.avia-slideshow, #full_slider_1 .avia-slideshow-inner, #full_slider_1 .avia-slideshow li, #full_slider_1 .avia-slideshow li img { min-height: 200px; } #full_slider_1 .avia-slideshow li img { width: 140%; } .slideshow_inner_caption { height: 36%; top: 10%; }If you need further assistance please let us know.
Best regards,
Victoriawow guys, I was also looking for an answer to this. It’s a simple question really. Slider text in a box – simple. One heading, one subheading in the same box so it looks nice. With the option to change the background colour and text colours. You say you give feedback to development, but nothing ever happens. This has been asked for time and time again. ANY option you give for CSS has to be mobile responsive.
The current theme does not support mobile devices. A full screen slider with buttons displays awful. The buttons go off the page. The buttons do not align central if the caption is right aligned. It’s a complete mess and again we have to find a work around or just stick with bottom alignment and no buttons or centred with buttons.Hi,
The current theme does not support mobile devices.
The slider works fine on mobile view by default as long as the caption or content are within limit as you can see on the demo. Usually, the button goes off the slider because the captions are too long. I don’t think it’s quite fair to say that theme is not responsive at all just because you can’t make something work the way you expect it to, without making any adjustments.
Demo: https://kriesi.at/themes/enfold-2017/elements/fullscreen-slider/
Screenshot: https://imgur.com/a/vtPNqvPBest regards,
Ismael
- You must be logged in to reply to this topic.