title: Use dots in WooCommerce FlexSlider instead of thumbnails on mobile
body: <p>I want to change the the WooCommerce FlexSlider to use dots in the gallery instead of the thumbnails. But on Desktop I want to show the thumbnails.</p>
  <p>I found a solution to use dots or thumbnails but not both of them in different viewports.</p>
  <p>Here's what I do to use thumbnails:</p>
  <pre><code>add_filter( 'woocommerce_single_product_carousel_options', 'custom_update_woo_flexslider_options' );
  function custom_update_woo_flexslider_options( $options ) {
  
      $options['controlNav']      = 'thumbnails';
      
      return $options;
  }
  </code></pre>
  <p>And for the dots I'm changing the code to this:</p>
  <pre><code>    $options['controlNav']      = true;
  </code></pre>
  <p>But in this case I have to use one of them for all viewports.</p>
  <p>Is there any way to use both? Or one per viewport?</p>