Archived topic

Adding Slider in Element or Home Hero

5 replies · Started by kadek on January 29, 2019

Viewing posts 1–6 of 6

January 29, 2019 at 11:01 pm #796224

Dear Team,

I Would like to add slider in my website using the peak site library.
I follow tutorial https://generatepress.com/forums/topic/insert-background-images-slider-effect-in-page-hero-element-without-plugin/ but no luck. The text i put below the image, not in front of it.

Please Advise,

Best Regards,

January 30, 2019 at 5:35 am #796430

Hi there,

so as your site is now.
In the Header Element > Element Classes field remove the hero-title class and add hero-overlay. Leave your HTML as is and then add this CSS:

.hero-overlay .inside-page-hero {
    position: relative;
}

.hero-overlay .hero-title {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
}

You may want to consider making sure all your slider images are the same size to stop the vertical movement of the content.

January 30, 2019 at 2:06 pm #797051

Hi David,

Thanks. It Works!
Now how to remove the image title from the slide?
Remove this Title

This is GP related issue or the slider plugin issue?

Best Regards,

Kadek

January 30, 2019 at 5:31 pm #797175

Hi there,

If you're not able to turn it off via the plugin settings, you can use this CSS:

.msacwl-gallery-caption {
    display: none;
}

January 30, 2019 at 8:13 pm #797239

Dear Tom,

Thanks, it's works!

Best Regards,

Kadek

January 31, 2019 at 7:55 am #797753

You're welcome :)

This archived topic is closed to new replies.

Start building better websites today.