Mobile layout – logos to small

  • Resolved mouwb

    (@mouwb)


    4 years, 9 months ago

    Hi there!

    I’m using your plugin and it works well on desktop. But on the mobile version, logos get so tiny, that you can barely see or understand. I think the logo quantity should be cut at the half on mobile or something like that. I understand that logos are tiny because it’s trying to fit 6 logos of the slider on the small screen. Or could be an option of how many images on the slider for the mobile version.

    Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Igor Benic

    (@ibenic)

    Hi @mouwb, I do plan to include a breakpoint option in the shortcode so you can decide how much logos you can show on each breakpoint, but I have still to check how to make that.

    I plan to release a new version of this plugin in 2-3 weeks so it should include that there as well with a lot more options for the slider.

    Thread Starter mouwb

    (@mouwb)

    Thank you for your VERY fast reply.
    It sounds great but I really need to make it today. Could you tell me where should I put the mobile validation and change the number of slides?

    Plugin Author Igor Benic

    (@ibenic)

    Hi @mouwb,

    you will need to go into the wp-sponsors plugin and find the file under wp-sponsors/includes/class-wp-sponsors-shortcodes.php

    Then, you need to scroll down and find $slickSettings['slidesToScroll'] = absint( $atts['slidestoscroll'] );

    Once you have found that, under that code, add this one:

    
$slickSettings['responsive'] = array(
 array(
  'breakpoint' => 600,
  'settings'   => array(
    'slidesToShow' => 2,
    'slidesToScroll' => 2,
   )
 ),
 array(
  'breakpoint' => 480,
  'settings'   => array(
    'slidesToShow' => 1,
    'slidesToScroll' => 1,
  )
 ),
);

    Here is a screenshot of the code as well (just tried it out). Just be sure there are not errors in the code which you typed because you could end up into a fatal error on your site. I would recommend you to test it locally of in a staging site if possible.

    https://www.wpsimplesponsorships.com/wp-content/uploads/2020/02/Screenshot-2020-02-18-at-01.34.37.png

    The biggest “issue” here for me will be to find a way to include that setting into attributes of shortcode ??

    • This reply was modified 4 years, 9 months ago by Igor Benic.
    • This reply was modified 4 years, 9 months ago by Igor Benic.
    Plugin Author Igor Benic

    (@ibenic)

    Hi @mouwb, I have finally made it available in 3.3.0.

    Check the documentation page in the admin or here on the plugin description more information on it.

    The attribute is “breakpoints” and here is a short introduction to it:

    [sponsors style=slider arrows=1 image_size=full slidestoscroll=3 slidestoshow=3 breakpoints=480;1;1|640;2;2]

    The attribute breakpoints uses format “screen_px;images_to_show;images_to_slide”. Then for multiple breakpoints, we separate them by “|”.
    In the above example we have separated 2 breakpoints 480px and 640px.
    For 480px, we set 1 for images to show and 1 for images to slide.
    For 640px, we set 2 for images to show and 2 for images to slide.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Mobile layout – logos to small’ is closed to new replies.