Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • #611243

    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,

    #611265

    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

    #611320

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

    #611326

    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

    #611336

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

    #611340

    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

    #611359

    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?

    #611377

    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

    #611394

    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.

    #611409

    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

    #611422

    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?

    #611427

    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

    #611448

    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)

    #611450

    Hi!

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

    Best regards,
    Yigit

    #611462

    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 ago by ac.
    #613433

    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

    #618169

    all sorted now – please close the thread. thanks.

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