I have setup 3 nectar sliders on a one page site and each slider has a description and comment. Where the comment is large I have set the sliders for those with a fair amount of comment text to 2000-3000px high with the settings as shown in the attached screen shots. Seems that there is a height limit so not all text will appear if there is too much. Am I doing something wrong or is there a way to increase this limit?
This still didn\'t make a difference, please check my iPhone 6 plus mobile screenshots and proof of Theme upgrade. Do Nectar sliders have a height limit? How do I make them lager than they are so the text isn\'t cropped top and botttom?
The fullscreen slider option will always constrain the slider to a max height of the browser window - if you disable that you\'ll see the height you\'ve set go into play but it\'s too large. I\'d simply recommend using this in the custom css box located in your Salient Options panel to allow enough space with your current settings on mobile:
@media only screen and (max-width: 690px)
html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2 {
font-size: 26px!important;
line-height: 37.5px!important;
}
Thanks, I tried but it puts an red X in custom css. I tried by placing from .nectar... but made no difference. Seems strange go have an option in the theme to choose slider height when there is a height limit, is this a bug in the theme? Is that what you are trying to offer with this css code, an override of the height limit?
Whoops, there was some missing brackets on the last post - kindly change that to this:
@media only screen and (max-width: 690px) {
html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2 {
font-size: 26px!important;
line-height: 37.5px!important;
}
}
And to clarify what you said about the height limit, there\'s only a height limit for the fullscreen option, if you disable that it will allow you to use any height you desire - the fullscreen option itself is indeed a a height constraint so it\'s simply overriding the other height you have set
Hi, thanks but I\'m afraid that doesn\'t work, it makes it less high. Seems all the code you gave me refers to the width not the height. Just to be clear, if I take it of Fullscreen Slider and there is a lot of description text it becomes too small which was the issue I was having in ticket ID 477946 that lead to this issue of having too little height for all descrption text.
Hey, you\'re great people and we are teh tiniest bit closer but its not right. I saw you duplicated some custom code, you had it like this:
@media only screen and (max-width: 690px) { html body .nectar-slider-wrap[data-full-height=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-height=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2 { font-size: 20px!important; line-height: 26px!important; } html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content p { font-size: 11px!important; line-height: 18px!important; } html body .nectar-slider-wrap[data-full-width=\"true\"] br { display: none; } }
@media only screen and (min-width: 1000px) and (max-width: 1300px) { html body .nectar-slider-wrap[data-full-height=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-height=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2 { font-size: 40px!important; line-height: 46px!important; } html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content p { font-size: 14px!important; line-height: 20px!important; } html body .nectar-slider-wrap[data-full-width=\"true\"] br { display: none; } }
I removed the second which resolved the font sizw issue and made some font size and lining tweaks so it is now:
@media only screen and (max-width: 690px) { html body .nectar-slider-wrap[data-full-height=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-height=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2 { font-size: 40px!important; line-height: 50px!important; } html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content p { font-size: 14px!important; line-height: 22px!important; } html body .nectar-slider-wrap[data-full-width=\"true\"] br { display: none; } }
Problem I have is I can\'t see what determines the height and I have only the first slider high enough, the last 2 are still short. Even if I change the Slider Height and Minimum Slider Height it seems to make no difference. The backgrouds images jpgs are sized to the Slider Height and Minimum Slider Height but makes no differene either. How can I set them to be high enough individually?
The only way your height selection would take effect is if you unchecked the box for fullscreen as that will simply set the height of the Nectar Slider to match whatever the height of the browser is at the time, overriding any other height settings you have. However I\'m curious why at this point you\'re using a Nectar slider for these sections? If you used a row set to full width content and placed a heading tag/paragraph and some nectar buttons in you\'d end up with the same result but it would never clip your text. Would you like me to set up one of your sections like that as an example?
Thanks so much for the reply and sorry again for being pushy! The problem with not setting it to fullscreen is the font size becomes too small on a mobile. If you are able to show me an example of the alternative I would be much appreciated as I\'m not entirely sure what you mean.
I tried to compromise on header and descroption text size and line height but they never even up well and making it work on a phone portrait then means it is cropping in landscape.
What would be ideal is to have full screen unchecked but font size is not then minature on a mobile, this for me is a bug in the theme.
If this can\'t be sorted with custom code then if you coudl please show me an alternative liek you mentioned in your last reply asap I\'d be so appreciative as we had to launch with the font size and line height compromise which only works in portrait.
I worked on the alternative you suggested, trial and error and I finally figured it out. Thanks for your help! Sorry agian for pushing, just a panic on launch dates.
Hi
I have setup 3 nectar sliders on a one page site and each slider has a description and comment. Where the comment is large I have set the sliders for those with a fair amount of comment text to 2000-3000px high with the settings as shown in the attached screen shots. Seems that there is a height limit so not all text will appear if there is too much. Am I doing something wrong or is there a way to increase this limit?
http://mygorilla.org/wp-admin/
user: Salient
pass: gbft5F$%!78B!
Thanks
Hey ,
Auto update the theme to Salient 6.0.1 using this plugin http://premium.wpmudev.org/blog/how-to-update-themeforest-themes-with-the-envato-wordpress-toolkit/
See changelog: http://themenectar.com/changelogs/salient.html .
Thanks
ThemeNectar Support Team
Hi
This still didn\'t make a difference, please check my iPhone 6 plus mobile screenshots and proof of Theme upgrade. Do Nectar sliders have a height limit? How do I make them lager than they are so the text isn\'t cropped top and botttom?
Thanks
Hey!
The fullscreen slider option will always constrain the slider to a max height of the browser window - if you disable that you\'ll see the height you\'ve set go into play but it\'s too large. I\'d simply recommend using this in the custom css box located in your Salient Options panel to allow enough space with your current settings on mobile:@media only screen and (max-width: 690px) html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2 { font-size: 26px!important; line-height: 37.5px!important; }CheersHi
Thanks, I tried but it puts an red X in custom css. I tried by placing from .nectar... but made no difference. Seems strange go have an option in the theme to choose slider height when there is a height limit, is this a bug in the theme? Is that what you are trying to offer with this css code, an override of the height limit?
Any varaition to the code that might work?
Thanks!
Whoops, there was some missing brackets on the last post - kindly change that to this:
@media only screen and (max-width: 690px) { html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2 { font-size: 26px!important; line-height: 37.5px!important; } }And to clarify what you said about the height limit, there\'s only a height limit for the fullscreen option, if you disable that it will allow you to use any height you desire - the fullscreen option itself is indeed a a height constraint so it\'s simply overriding the other height you have setHi, thanks but I\'m afraid that doesn\'t work, it makes it less high. Seems all the code you gave me refers to the width not the height. Just to be clear, if I take it of Fullscreen Slider and there is a lot of description text it becomes too small which was the issue I was having in ticket ID 477946 that lead to this issue of having too little height for all descrption text.
Any other solutions?
Thanks
Hey,
I logged in and added more media queries to ensure it will display on mobile/smaller screens - how\'s it looking on your end?
Hey, you\'re great people and we are teh tiniest bit closer but its not right. I saw you duplicated some custom code, you had it like this:
@media only screen and (max-width: 690px) {
html body .nectar-slider-wrap[data-full-height=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-height=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2 {
font-size: 20px!important;
line-height: 26px!important;
}
html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content p {
font-size: 11px!important;
line-height: 18px!important;
}
html body .nectar-slider-wrap[data-full-width=\"true\"] br {
display: none;
}
}
@media only screen and (min-width: 1000px) and (max-width: 1300px) {
html body .nectar-slider-wrap[data-full-height=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-height=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2 {
font-size: 40px!important;
line-height: 46px!important;
}
html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content p {
font-size: 14px!important;
line-height: 20px!important;
}
html body .nectar-slider-wrap[data-full-width=\"true\"] br {
display: none;
}
}
I removed the second which resolved the font sizw issue and made some font size and lining tweaks so it is now:
@media only screen and (max-width: 690px) {
html body .nectar-slider-wrap[data-full-height=\"true\"] .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-height=\"boxed-full-width\"] .swiper-slide .content h2, html body .full-width-content .vc_span12 .swiper-slide .content h2, html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content h2 {
font-size: 40px!important;
line-height: 50px!important;
}
html body .nectar-slider-wrap[data-full-width=\"true\"] .swiper-slide .content p {
font-size: 14px!important;
line-height: 22px!important;
}
html body .nectar-slider-wrap[data-full-width=\"true\"] br {
display: none;
}
}
Problem I have is I can\'t see what determines the height and I have only the first slider high enough, the last 2 are still short. Even if I change the Slider Height and Minimum Slider Height it seems to make no difference. The backgrouds images jpgs are sized to the Slider Height and Minimum Slider Height but makes no differene either. How can I set them to be high enough individually?
Thanks!!
The only way your height selection would take effect is if you unchecked the box for fullscreen as that will simply set the height of the Nectar Slider to match whatever the height of the browser is at the time, overriding any other height settings you have. However I\'m curious why at this point you\'re using a Nectar slider for these sections? If you used a row set to full width content and placed a heading tag/paragraph and some nectar buttons in you\'d end up with the same result but it would never clip your text. Would you like me to set up one of your sections like that as an example?
Thanks so much for the reply and sorry again for being pushy! The problem with not setting it to fullscreen is the font size becomes too small on a mobile. If you are able to show me an example of the alternative I would be much appreciated as I\'m not entirely sure what you mean.
Thanks again!!
Hi
I tried to compromise on header and descroption text size and line height but they never even up well and making it work on a phone portrait then means it is cropping in landscape.What would be ideal is to have full screen unchecked but font size is not then minature on a mobile, this for me is a bug in the theme.
If this can\'t be sorted with custom code then if you coudl please show me an alternative liek you mentioned in your last reply asap I\'d be so appreciative as we had to launch with the font size and line height compromise which only works in portrait.
Thanks!!