Tagged: ,

Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • April 11, 2016 at 1:44 pm #611243
    ac

    On the home page, the full width slider doesn’t look good on mobile – the buttons cover up the image and it’s not really deep enough, looks very thin.

    Please advise best way of fixing this…

    thanks,

    April 11, 2016 at 2:02 pm #611265
    Yigit

    Hey andrea!

    Please add following code to Quick CSS 

    @media only screen and (max-width: 769px) {
.slideshow_caption {
    width: 85%;
}}
@media only screen and (max-width: 480px) { 
.slideshow_caption a {
display: none; 
}}

    Regards,
    Yigit

    April 11, 2016 at 2:31 pm #611320
    ac

    thanks, that doesn’t seem to have done anything though – the captions are still covering up the image.

    April 11, 2016 at 2:35 pm #611326
    Yigit

    Hi!

    Can you please try changing code to following one

    @media only screen and (max-width: 769px) {
.slideshow_caption {
    width: 85% !important;
}}
@media only screen and (max-width: 480px) { 
.slideshow_caption a {
display: none !important; 
}}

    Cheers!
    Yigit

    April 11, 2016 at 2:55 pm #611336
    ac

    Something has changed, i think it’s a bit better, but the captions are still covering up the images

    April 11, 2016 at 3:00 pm #611340
    Yigit

    Hey!

    I believe hiding captions on mobile would be the best solution 

    @media only screen and (max-width: 480px) { 
.slideshow_caption {
display: none !important; 
}}

    Please let us know if that solution works for you

    Best regards,
    Yigit

    April 11, 2016 at 3:29 pm #611359
    ac

    Thanks Yigit, that works – I can see the images! Is it possible to make the image slider deeper on mobile (i.e. taller) as it looks a bit thin/cramped even without the captions. Is there a way to do that – OR should I make the slider deeper via the page settings and add some white space to the top of all the image jpgs?

    April 11, 2016 at 3:48 pm #611377
    Yigit

    Hey!

    You can refer to this post – http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/ and display different sliders on mobile and on desktop

    Cheers!
    Yigit

    April 11, 2016 at 3:57 pm #611394
    ac

    Thank you, i don’t want to hide it though. I think a deeper header would be better both for desktop and mobile – I’m currently using featured 1500×430. The featured large 1500×630 was better, but too big. Can I set it somewhere to be 1500×500? I have it on don’t stretch option.

    April 11, 2016 at 4:14 pm #611409
    Yigit

    Hi!

    You can go to Appearance > Editor and open functions.php file and find

    $avia_config['imgSize']['featured'] 		 	= array('width'=>1500, 'height'=>430 );						// images for fullsize pages and fullsize slider
$avia_config['imgSize']['featured_large'] 		= array('width'=>1500, 'height'=>630 );						// images for fullsize pages and fullsize slider

    and change the values as needed and then regenerate thumbnails using this plugin – https://wordpress.org/plugins/regenerate-thumbnails/

    Best regards,
    Yigit

    April 11, 2016 at 4:23 pm #611422
    ac

    thank you – will that still work after any theme updates, as I assume you mean the functions.php in Enfold not in the child theme?

    April 11, 2016 at 4:27 pm #611427
    Yigit

    Hi!

    If you are using a child theme, please add following code to Functions.php file of your child theme instead

    add_filter( 'avf_modify_thumb_size', 'enfold_customization_modify_thumb_size', 10, 1 );
function enfold_customization_modify_thumb_size( $size ) {
$size['featured'] = array('width'=>1500, 'height'=>500);
$size['featured_large'] = array('width'=>1500, 'height'=>500);
return $size;
}

    then regenerate thumbnails :)

    Best regards,
    Yigit

    April 11, 2016 at 4:48 pm #611448
    ac

    Thanks, i have done that but it doesn’t seem to have changed the home page slider height (I’ve done ctrl-F5 to check as well)

    April 11, 2016 at 4:53 pm #611450
    Yigit

    Hi!

    Have you regenerated thumbnails as well? https://wordpress.org/plugins/regenerate-thumbnails/

    Best regards,
    Yigit

    April 11, 2016 at 5:10 pm #611462
    ac

    Yes I did and it gave 100% message

    All done! 70 image(s) were successfully resized in 344 seconds and there were 0 failures.

    I’ve now tried it twice.

    However, it has not changed the appearance of the slider on the homepage (desktop or mobile).

    Do I need to actually resize all the jpgs as well? Because when I chose the large slider it just added white space above which looked fine (except it was too deep). So I assumed I wouldn’t need to resize the images it would just add space. Thank you.

    • This reply was modified 8 years, 3 months ago by ac.
    April 14, 2016 at 5:02 am #613433
    Ismael

    Hi!

    Please install the following plugin then go to the Settings > Media panel. Adjust the size, update, save then regenerate the thumbnails: https://wordpress.org/plugins/simple-image-sizes/

    Cheers!
    Ismael

    April 20, 2016 at 11:04 am #618169
    ac

    all sorted now – please close the thread. thanks.

  • Author
    Posts
Viewing 17 posts - 1 through 17 (of 17 total)
  • The topic ‘fullwidth slider on mobile’ is closed to new replies.