[PamelaParticipant]

Hi there,

I am using the Icon stack for the first time and have set the main nav to be to the left. I have created a Rev Slider and placed the shortcode in a text box on the page in Cornerstone. I can’t seem to figure out how to have the slider sit all the way to the top and to the left up against the main nav bar on the left.

You can see it here. http://67a.226.myftpupload.com/

I am using wordpress 4.3, X theme version 4.0.7 and Rev slider version 5.0.4.1

Thank you,
Pam

[RupokMember]

Hi Pam,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

[PamelaParticipant]

This reply has been marked as private.

[ZeshanMember]

Hi Pam,

To fullwidth the slider, disable Column Container under your first section row settings (see: http://prntscr.com/7jvwjr) in Cornerstone.

To remove the above spacing, Please add following CSS under Custom > CSS in the Customizer:

.home #x-section-1 .x-text > p {
    margin: 0;
}

Thanks!

[PamelaParticipant]

The custom CSS worked for the top margin but there is still a space on the left after disabling column container. Any other suggestions?

Thank you,
Pam

[FriechModerator]

Hi Pam,

The image layer has an custom layer width, please adjust/increase it. And then set the layer alignment to center.

Or you can also set the images as the slides background, not as a layer.

Hope it helps, Cheers!

[PamelaParticipant]

That did the trick on the desktop view.

Now I have another issue with it. In mobile view the slider is pushed right up against the logo. Also, the slider photos get cut off in mobile view and even small ipad view.

Is this because the custom size is set?

Thank you,
Pam

[RupokMember]

Hi Pam,

Whne you use it as a layer and define the size yourself then it might not looks good on every screen size. In that case you can set it as slide background.

And also if you still face any issue, please try to clarify with a screenshot so that we can understand your issue clearly.

Thanks

[PamelaParticipant]

I cant set it as a slide background because I have 4 images that make up the slider. Is there CSS that can be used to change the size of the slider at ipad and mobile view?

Also the logo is to tight with the slider in mobile view. How do I add more space above and below the logo?

See it here in mobile view:

http://prntscr.com/8ezktc

Here it is in desktop view:

http://prntscr.com/8ezl54

Thank you,
Pam

[John EzraMember]

Hi Pam,

Thanks for updating the thread! You can add this under Custom > CSS in the Customizer or in your child theme’s style.css file.

/* Mobile logo margins */
@media (max-width:979px) {
    a.x-brand.img {
        margin: 20px 0;
    }
}

div#rev_slider_1_1_wrapper {
    height: 100%!important;
}

div#rev_slider_1_1 {
    height: 480px!important;
}

Hope this helps – thanks!

[PamelaParticipant]

hello,
It seems to have worked with the iPad view but the mobile view slider is still cut off.

Do I need to add something like this?

@media (max-width:480px) {
a.x-brand.img {
margin: 20px 0;
}
}

Thank you for your help!
Pam

[ZeshanMember]

Hi Pam,

That CSS code is only for the logo image.

As Revolution Slider is a 3rd party plugin, regretfully, we have limited support for it that only covers its compatibility issues with X. So any question related to transitions, animations or how the certain feature of the slider works, would be getting outside the support we can offer. You may refer to Revolution Slider online documentation: http://revolution.themepunch.com/documentation/

You can review our Kb article on Revolution Slider for more information.

Thank you for understanding. Take care!

[Author]

Posts