anchor.diff:                          <% @products.each_slice(3) do |array_of_3_products| %>
                               <% cache ['entry', array_of_3_products] do %>
                                   <% array_of_3_products.each do |product| %>
  -                                    <% product.title %>
  +                                    
                           <!--First columnn-->
                           <div class="col-lg-4">
   
  
positive.code:             <div class="row">
              <!--Sidebar-->
                  <div class="col-lg-4">
                  <div class="sticky" style="width: 300px">
                      <div class="widget-wrapper">
                          <h4>Categories:</h4>
                          <br>
  
negative.code: 
              </div>
          </div>
          <!--/.Main layout-->
  
  
  
          **********************
  
  
  
          <div class="container-fluid">
  
              <!--Section: Main carousel-->
              <section>
                  <div class="row">
                      <div class="col-md-12">
  
                          <!--Carousel Wrapper-->
                          <div id="carousel-example-2" class="carousel slide carousel-fade" data-ride="carousel">
                              <!--Indicators-->
                              <ol class="carousel-indicators">
                                  <li data-target="#carousel-example-2" data-slide-to="0" class="active"></li>
                                  <li data-target="#carousel-example-2" data-slide-to="1"></li>
                                  <li data-target="#carousel-example-2" data-slide-to="2"></li>
                              </ol>
                              <!--/.Indicators-->
  
                              <!--Slides-->
                              <div class="carousel-inner" role="listbox">
                                  <!--First slide-->
                                  <div class="carousel-item active">
                                      <!--Mask color-->
                                      <div class="view hm-black-light">
                                          <img src="https://mdbootstrap.com/images/slides/slide%20(25).jpg" class="img-fluid" alt="">
                                          <div class="full-bg-img">
                                          </div>
                                      </div>
                                      <!--Caption-->
                                      <div class="carousel-caption">
                                          <div class="animated fadeInDown">
                                              <h3 class="h3-responsive">New Fall / Winter handbags</h3>
                                              <p>Take a look at our Trends and prepare for Fall Season</p>
                                          </div>
                                      </div>
                                      <!--Caption-->
                                  </div>
                                  <!--/First slide-->
  
                                  <!--Second slide-->
                                  <div class="carousel-item">
                                      <!--Mask color-->
                                      <div class="view hm-black-light">
                                          <img src="https://mdbootstrap.com/images/slides/slide%20(26).jpg" class="img-fluid" alt="">
                                          <div class="full-bg-img">
                                          </div>
                                      </div>
                                      <!--Caption-->
                                      <div class="carousel-caption">
                                          <div class="animated fadeInDown">
                                              <h3 class="h3-responsive">Best sweaters for winter</h3>
                                              <p>Choose your favourite one and you're never be cold</p>
                                          </div>
                                      </div>
                                      <!--Caption-->
                                  </div>
                                  <!--/Second slide-->
  
                                  <!--Third slide-->
                                  <div class="carousel-item">
                                      <!--Mask color-->
                                      <div class="view hm-black-light">
                                          <img src="https://mdbootstrap.com/images/slides/slide%20(27).jpg" class="img-fluid" alt="">
                                          <div class="full-bg-img">
                                          </div>
                                      </div>
                                      <!--Caption-->
                                      <div class="carousel-caption">
                                          <div class="animated fadeInDown">
                                              <h3 class="h3-responsive">New arrivals for summer</h3>
                                              <p>Go for holidays with our shirts and sunglasses</p>
                                          </div>
                                      </div>
                                      <!--Caption-->
                                  </div>
                                  <!--/Third slide-->
                              </div>
                              <!--/.Slides-->
  
                              <!--Controls-->
                              <a class="carousel-control-prev" href="#carousel-example-2" role="button" data-slide="prev">
                                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                  <span class="sr-only">Previous</span>
                              </a>
                              <a class="carousel-control-next" href="#carousel-example-2" role="button" data-slide="next">
                                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                  <span class="sr-only">Next</span>
                              </a>
                              <!--/.Controls-->
                          </div>
                          <!--/.Carousel Wrapper-->
  
                      </div>
                  </div>
              </section>
              <!--/Section: Main carousel-->
  
              <!--Divider-->
              <div class="divider-new">
                  <h2 class="h2-responsive">What's new?</h2>
              </div>
  
              <!--Section: Products v.1-->
              <section class="section">
  
                  <!--Section heading-->
                  <h1 class="section-heading wow fadeIn" data-wow-delay="0.2s">Our bestsellers v.1</h1>
                  <!--Section sescription-->
                  <p class="section-description wow fadeIn" data-wow-delay="0.4s">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit, error amet numquam iure provident voluptate esse quasi, veritatis totam voluptas nostrum quisquam eum porro a pariatur accusamus veniam. Quia, minima?</p>
  
                  <!--First row-->
                  <div class="row">
                      <% cache ['store', Product.latest] do %>
                          <% @products.each_slice(3) do |array_of_3_products| %>
                              <% cache ['entry', array_of_3_products] do %>
                                  <% array_of_3_products.each do |product| %>
                                      <% product.title %>
  
                      <!--First column-->
                      <div class="col-lg-4 col-md-6 mb-r wow fadeIn" data-wow-delay="0.2s">
  
                          <!--Card-->
                          <div class="card card-cascade wider">
  
                              <!--Card image-->
                              <div class="view overlay hm-white-slight">
                                  <%= image_tag(product.image_url, class: "img-fluid ", alt: "")  %>
                                  <a>
                                      <%= link_to '', product_path(:id => product.id), class: "mask" %>
                                  </a>
                              </div>
                              <!--/.Card image-->
  
                              <!--Card content-->
                              <div class="card-block text-center">
                                  <!--Category & Title-->
                                  <h5>Shorts</h5>
                                  <h4 class="card-title"><a href=""><%= product.title %></a></h4>
  
                                  <!--Rating-->
                                  <ul class="rating">
                                      <li><i class="fa fa-star"></i></li>
                                      <li><i class="fa fa-star"></i></li>
                                      <li><i class="fa fa-star"></i></li>
                                      <li><i class="fa fa-star"></i></li>
                                      <li><i class="fa fa-star-o"></i></li>
                                  </ul>
  
                                  <!--Description-->
                                  <p class="card-text">T<%= truncate(strip_tags(product.description), length: 50) %>
                                  </p>
  
                                  <!--Card footer-->
                                  <div class="card-footer">
                                      <span class="left"><%= number_to_currency(product.price) %></span>
                                      <span class="right">
                                          <a data-toggle="tooltip" data-placement="top" title="Add to Cart" >
                                          <%= link_to raw("<i class=\"fa fa-shopping-cart\"></i>"), 
                                                  line_items_path(product_id: product), 
                                                  class: "",
                                                  remote: true,
                                                  onclick: "toastr.success('Successfully added to cart!');",
                                                  method: :post %></a>
                                          <a class="" data-toggle="tooltip" data-placement="top" title="Added to Wishlist"><i class="fa fa-heart"></i></a>
                                      </span>
                                  </div>
  
                              </div>
                              <!--/.Card content-->
  
                          </div>
                          <!--/.Card-->
  
                      </div>
                      <!--/First column-->
                          <% end %>
                          <% end %>
                          <% end %>
                          <% end %>
                    
  
                      
  
                  </div>
                  <!--/First row-->
  
              </section>
              <!--/Section: Products v.1-->
  
              <hr class="between-sections">
  
              <!--Section: Products v.5-->
              <section class="section">
  
                  <!--Section heading-->
                  <h1 class="section-heading wow fadeIn" data-wow-delay="0.2s">Our bestsellers v.5</h1>
                  <!--Section sescription-->
                  <p class="section-description wow fadeIn" data-wow-delay="0.4s">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit, error amet numquam iure provident voluptate esse quasi, veritatis totam voluptas nostrum quisquam eum porro a pariatur accusamus veniam. Quia, minima?</p>
  
  
                  <!--Carousel Wrapper-->
                  <div id="multi-item-example" class="carousel slide carousel-multi-item" data-ride="carousel">
  
                      <!--Controls-->
                      <div class="controls-top">
                          <a class="btn-floating btn-small primary-color" href="#multi-item-example" data-slide="prev"><i class="fa fa-chevron-left"></i></a>
                          <a class="btn-floating btn-small primary-color" href="#multi-item-example" data-slide="next"><i class="fa fa-chevron-right"></i></a>
                      </div>
                      <!--/.Controls-->
  
                      <!--Indicators-->
                      <ol class="carousel-indicators">
                          <li class="primary-color" data-target="#multi-item-example" data-slide-to="0" class="active"></li>
                          <li class="primary-color" data-target="#multi-item-example" data-slide-to="1"></li>
                          <li class="primary-color" data-target="#multi-item-example" data-slide-to="2"></li>
                      </ol>
                      <!--/.Indicators-->
  
                      <!--Slides-->
                      <div class="carousel-inner" role="listbox">
  
                          <!--First slide-->
                          <div class="carousel-item active">
  
                              <div class="col-md-4">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(21).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Shoes</h5>
                                          <h4 class="card-title"><a href="">White sneakers</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">69$</span>
                                              <span class="right">
                                              <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                              <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                              </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                              <div class="col-md-4 hidden-sm-down">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(22).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Jeans</h5>
                                          <h4 class="card-title"><a href="">Slim jeans</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing minima veniam elit. Nam incidunt eius est voluptatibus.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">99$</span>
                                              <span class="right">
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                  </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                              <div class="col-md-4 hidden-sm-down">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(24).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Shorts</h5>
                                          <h4 class="card-title"><a href="">Denim shorts</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur adipisci sed velit.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">49$</span>
                                              <span class="right">
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                  </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                          </div>
                          <!--/.First slide-->
  
                          <!--Second slide-->
                          <div class="carousel-item">
  
                              <div class="col-md-4">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(29).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Accessories</h5>
                                          <h4 class="card-title"><a href="">Summer hat</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing minima veniam elit. Nam incidunt eius est voluptatibus.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">39$</span>
                                              <span class="right">
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                  </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                              <div class="col-md-4 hidden-sm-down">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(30).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Shoes</h5>
                                          <h4 class="card-title"><a href="">Black high heels</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur adipisci sed velit.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">79$</span>
                                              <span class="right">
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                  </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                              <div class="col-md-4 hidden-sm-down">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(31).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Outerwear</h5>
                                          <h4 class="card-title"><a href="">Black jacket</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">149$</span>
                                              <span class="right">
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                  </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                          </div>
                          <!--/.Second slide-->
  
                          <!--Third slide-->
                          <div class="carousel-item">
  
                              <div class="col-md-4">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(35).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Accessories</h5>
                                          <h4 class="card-title"><a href="">Gold earrings</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur adipisci sed velit.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">29$</span>
                                              <span class="right">
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                  </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                              <div class="col-md-4 hidden-sm-down">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(3).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Accessories</h5>
                                          <h4 class="card-title"><a href="">Black leather belt</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">89$</span>
                                              <span class="right">
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                  </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                              <div class="col-md-4 hidden-sm-down">
  
                                  <!--Card-->
                                  <div class="card card-cascade narrower">
  
                                      <!--Card image-->
                                      <div class="view overlay hm-white-slight">
                                          <img src="https://mdbootstrap.com/images/ecommerce/reg/reg%20(12).jpg" class="img-fluid" alt="">
                                          <a>
                                              <div class="mask"></div>
                                          </a>
                                      </div>
                                      <!--/.Card image-->
  
                                      <!--Card content-->
                                      <div class="card-block text-center">
                                          <!--Category & Title-->
                                          <h5>Shoes</h5>
                                          <h4 class="card-title"><a href="">Converse sneakers</a></h4>
  
                                          <!--Description-->
                                          <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing minima veniam elit. Nam incidunt eius est voluptatibus.
                                          </p>
  
                                          <!--Card footer-->
                                          <div class="card-footer">
                                              <span class="left">129$</span>
                                              <span class="right">
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Quick Look"><i class="fa fa-eye"></i></a>
                                  <a class="" data-toggle="tooltip" data-placement="top" title="Add to Wishlist"><i class="fa fa-heart"></i></a>
                                  </span>
                                          </div>
  
                                      </div>
                                      <!--/.Card content-->
  
                                  </div>
                                  <!--/.Card-->
  
                              </div>
  
                          </div>
                          <!--/.Third slide-->
  
                      </div>
                      <!--/.Slides-->
  
                  </div>
                  <!--/.Carousel Wrapper-->
  
  
              </section>
              <!--/Section: Products v.5-->
  
  
          </div>