Plugin Directory

Changeset 2297698


Ignore:
Timestamp:
05/04/2020 12:42:08 PM (6 years ago)
Author:
clcnl
Message:

Added unique classes to carousel

File:
1 edited

Legend:

Unmodified
Added
Removed
  • clc-products/trunk/clc_product.php

    r2296568 r2297698  
    44Plugin URI: https://clcnederland.com
    55Description: A plugin to show products from clcnederland.com with the affiliate tag
    6 Version: 1.2.2
     6Version: 1.2.3
    77Author: CLC Nederland
    88Author URI: https://clcnederland.com
     
    201201            case 'carousel_large':
    202202                if(isset($options['enable_carousel'])){
     203                    $id = rand();
    203204                    $output .= '<div class="glider-contain">
    204                       <div class="glider">';
     205                      <div class="glider-'.$id.' glider">';
    205206                    $p = 0;
    206207                    foreach($class->Products as $product){
     
    212213                    $dots_html = NULL;
    213214                    if($p < 5){
    214                         $dots_script = 'dots: ".dots",';
    215                         $dots_html = '<div role="tablist" class="dots"></div>';
     215                        $dots_script = 'dots: ".dots-'.$id.'",';
     216                        $dots_html = '<div role="tablist" class="dots dots-'.$id.'"></div>';
    216217                    }
    217218                   
    218219                    $output .= '</div>
    219220
    220                       <button role="button" aria-label="Previous" class="glider-prev">«</button>
    221                       <button role="button" aria-label="Next" class="glider-next">»</button>
     221                      <button role="button" aria-label="Previous" class="glider-prev glider-prev-'.$id.'">«</button>
     222                      <button role="button" aria-label="Next" class="glider-next glider-next-'.$id.'">»</button>
    222223                      '.$dots_html.'
    223224                    </div>';
     
    233234                    }
    234235                   
    235                     $output .= '<script>new Glider(document.querySelector(".glider"), {
     236                    $output .= '<script>new Glider(document.querySelector(".glider-'.$id.'"), {
    236237                      slidesToShow: '.$productsToShow.',
    237238                      slidesToScroll: '.$productsToScroll.',
     
    239240                      '.$dots_script.'
    240241                      arrows: {
    241                         prev: ".glider-prev",
    242                         next: ".glider-next"
     242                        prev: ".glider-prev-'.$id.'",
     243                        next: ".glider-next-'.$id.'"
    243244                      }
    244245                    });</script>';
     
    256257            case 'carousel_small':
    257258                if(isset($options['enable_carousel'])){
     259                    $id = rand();
    258260                    $output .= '<div class="glider-contain">
    259                       <div class="glider">';
     261                      <div class="glider glider-'.$id.'">';
    260262                   
    261263                    foreach($class->Products as $product){
     
    265267                    $output .= '</div>
    266268
    267                       <button role="button" aria-label="Previous" class="glider-prev">«</button>
    268                       <button role="button" aria-label="Next" class="glider-next">»</button>
    269                       <div role="tablist" class="dots"></div>
     269                      <button role="button" aria-label="Previous" class="glider-prev glider-prev-'.$id.'">«</button>
     270                      <button role="button" aria-label="Next" class="glider-next glider-next-'.$id.'">»</button>
     271                      <div role="tablist" class="dots dots-'.$id.'"></div>
    270272                    </div>';
    271273
     
    275277                    }
    276278
    277                     $output .= '<script>new Glider(document.querySelector(".glider"), {
     279                    $output .= '<script>new Glider(document.querySelector(".glider-'.$id.'"), {
    278280                      slidesToShow: '.$productsToShow.',
    279281                      slidesToScroll: '.$productsToShow.',
    280282                      draggable: true,
    281                       dots: ".dots",
     283                      dots: ".dots-'.$id.'",
    282284                      arrows: {
    283                         prev: ".glider-prev",
    284                         next: ".glider-next"
     285                        prev: ".glider-prev-'.$id.'",
     286                        next: ".glider-next-'.$id.'"
    285287                      }
    286288                    });</script>';
Note: See TracChangeset for help on using the changeset viewer.