Tagged: enfold, fullscreen slider
-
AuthorPosts
-
March 24, 2017 at 8:26 pm #766377
I have created a page that uses the Full Screen slider and looks awesome on the desktop and laptop views. In mobile view however, the text gets truncated at the bottom. (BEGINNING WITH SLIDE #2 which contain captions. Slide 1 is only an image.)
I’ve played with .slideshow_caption { width: 80%;} and it made no difference on allowing bottom of page text to remain or not.
I’ve resized the background image (more height) and that didn’t matter either.
Currently I’m using the NO SCALING option.Not sure what to try next to get the mobile version to show all text and still keep the laptop view beautiful.
Please help me solve this mystery…- This topic was modified 7 years, 7 months ago by welswebmaster. Reason: Ismael did not see the text in ALL CAPS so I tagged it BOLD
March 24, 2017 at 8:39 pm #766382!!!!!!!!!!!!!
- This reply was modified 7 years, 8 months ago by Justin.
March 24, 2017 at 8:41 pm #766383Justin Thanks.
- This reply was modified 7 years, 7 months ago by welswebmaster.
March 28, 2017 at 7:14 am #767905Hi,
Thank you for using Enfold.
I checked the page and the caption or text is attach to the image. It’s not actually a caption. Please remove the text from the image then add it as caption.
Best regards,
IsmaelMarch 28, 2017 at 1:39 pm #768124Hi Ismael,
Please see the ALL CAPS in the request. I’m looking for your help with slide 2-19 not slide 1 which I indicated was an image.March 29, 2017 at 8:18 pm #769045Hi welswebmaster,
The following is just a suggestion.
This text is barely readable on big screens, on smaller screens it’s very hard to read. You might want to use a bigger font, bigger line-height, and in this case, this slider will not work for you.
You could use parallax, still having these beautiful images and the sections of text scrolling over each other. The content will be very adaptable to any screen then.>
Best regards,
Victoria- This reply was modified 7 years, 7 months ago by Victoria.
March 29, 2017 at 8:52 pm #769062Hey Victoria – Thanks so much for your response. I switched to Parallyx as you suggested, and the results didn’t change at all.
SEE ATTACHED VIEWS
GOOD – Laptop view is fine.
BAD – Left page control overlaps text.
BAD – Mobile view (3rd slide) text is trucnated top and bottom on my iPhone.
BAD – No page controls appear at all. (Should they?)ALTERNATIVE? If Fullscreen slider isn’t a viable option for mobile, how would one direct just the mobile visitors to a different URL?
See private content links. ALSO See attached views of:- 01 Settings
- 02 Laptop view – Top of page
- 03 Laptop view – Bottom of page (notice the left page control overlaps text block)
- 04 Mobile view – Top of page
- 05 Mobile view – Bottom of page
- This reply was modified 7 years, 7 months ago by welswebmaster.
March 31, 2017 at 6:07 am #769723Hey!
Would you consider adding a “read more” link to the caption or hiding it completely on mobile view? They are a bit too long for the slider so the options are decreasing the font size, hiding the caption on mobile or adding a read more link. I tried to decrease the font size to 11px but some captions are still cut off. If you think of hiding the captions, consider the following css code.
@media only screen and (max-width: 768px) { .caption_framed .slideshow_caption .avia-caption-content p, .caption_framed .slideshow_caption .avia-caption-title, .avia-caption .avia-caption-content p, .avia-caption .avia-caption-title { display: none; } }
Regards,
IsmaelMarch 31, 2017 at 3:17 pm #769994Hi Ismael,
Thanks for the reply. I tried the MORE tag on the last slide. It didn’t work at all – still displaying the next paragraph then truncating.I’ve created a MOBILE ONLY page.
Is there a way to AUTOMATE …
If mobile, then instead display https://christthelight.net/discover-jesus/wij-mobile/That would be best since I’ve spent way to much time trying to get around this.
Thanks for your help
April 3, 2017 at 3:14 am #770843Hi!
The following plugins will let you redirect to another page on mobile view.
// https://wordpress.org/plugins/simple-mobile-url-redirect/
// https://wordpress.org/plugins/equivalent-mobile-redirect/
// https://wordpress.org/plugins/advanced-mobile-redirect/Regards,
IsmaelApril 3, 2017 at 3:17 pm #771171// https://wordpress.org/plugins/equivalent-mobile-redirect/ Is the winner. Thanks! Hopefully in the future the fullscreen slider would just use the background color to accommodate overflow text so that is responsive. For now, color sections are working great for mobile. Thanks.
April 4, 2017 at 3:53 am #771470 -
AuthorPosts
- The topic ‘Enfold: Full Screen Slider Caption truncated on Mobile’ is closed to new replies.