Codeless
  • Support Home
  • Themes
  • Support
  • WordPress Tutorials
    • How to Start a Blog
    • Best Website Builders
    • Best Small Business Hosting
    • Email Marketing Services
    • Cheap WordPress Hosting
  • Video Tutorials

Community Forums

Change Pagination on client logo section

#clients #pagination #logo-scroll
    • 9 years, 8 months ago Erginus
      Participant

      Expired

      How can we change pagination of client logo section . I want move four logo on one click rather than single logo slide .
      When click on next button scroll to next screen not next logo. can we change this .

    • 9 years, 8 months ago Mirela
      Participant

      Hello,

      Please go to file js/main.js and find these lines:

      /*------------------------------ Clients Carousel ------------------------ */ 
      
      function clientsCarousel(){
      	"use strict";
      
      	var $self = $('.clients_caro');
      	if($self.length){
      		$self.css('display', 'none');
      		$self.imagesLoaded(function(){
      			$self.css('display', 'block');
      			$self.carouFredSel( 
      			{
      						items:4,
      						auto: false, 
      						scroll: { items : 1 },

      Edit the scroll: { items : 1 } value to your wish. if set to 4 it will scroll 4 items at one time.

      Best regards!

    • 9 years, 8 months ago Erginus
      Participant

      Expired

      Hi Mihaila ,

      Can we rewrite above function in child theme .I don’t want to change in parent theme .

    • 9 years, 8 months ago Mirela
      Participant

      Hello,


      @Erginus
      ,
      Yes, you can.

      Best regards!

    • 9 years, 8 months ago Erginus
      Participant

      Expired

      where we can write above function in child theme . i write function in custom js in tower => general option but not working .

    • 9 years, 8 months ago Mirela
      Participant

      Hello,

      This is Specular support forum. The above solution is tested in Specular theme.
      Please be careful to write at your theme’s forum. So there will not be misunderstanding that could waste your time and ours.
      Add the function just any other normal in child theme files (read more here). not in custom js box.

      Best regards!

    • 9 years, 7 months ago Erginus
      Participant

      Expired

      Thanks @Mihalia ,

      I solve the problem . write Above function in visual composer editor Using “raw js” option on page .

    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      That’s a very good choice too. Thanks for sharing!

      Best regards!

    • 9 years, 7 months ago Erginus
      Participant

      Expired

      Hi Mihaila
      Previously i change in client logo pagination . but there is problem in responsive resolutions.
      Like it show :
      Tab : show 3 logos on single row and i click on next icons ,pagination scroll 5 logos .
      Mobile View : show 1 logos on single row and i click on next icons ,pagination scroll 5 logo .
      what to do now . please help me .

    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      Can you please post a link of your site? So we can give it a closer look.

      Best regards!

    • 9 years, 7 months ago Erginus
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      Please add this code into your custom css box:

      @media (max-width: 480px){
      .clients .item { 
          width: 232px !important;
          margin-top: 8px !important; 
          padding: 0px 68px !important;
      }
      section.row.clients.clients_caro {
          width: 300px !important;
          height: 585px !important;
      }
      .caroufredsel_wrapper { height: 585px !important;}
      }
      @media (max-width: 676px){
      .clients_el:hover .pagination a.prev { opacity: 0;}
      .clients_el:hover .pagination a.next { opacity: 0;}
      .clients .item { 
          width: 232px !important;
          margin-top: 8px !important; 
          padding: 0px 160px !important;
      }
      section.row.clients.clients_caro {
          width: 300px !important;
          height: 585px !important;
      }
      .caroufredsel_wrapper { height: 585px !important;}
      
      }

      It will display clients as a block in mobile. Screenshot.

      Best regards!

    • 9 years, 7 months ago Erginus
      Participant

      Expired

      @media (max-width: 676px){
      .clients_el:hover .pagination a.prev { opacity: 0;}
      .clients_el:hover .pagination a.next { opacity: 0;}
      .clients .item {
      width: 232px !important;
      margin-top: 8px !important;
      padding: 0px 160px !important;
      }

      In above media query , i don’t want hide pagination icon .Pls provide another solution .
      can u give reason why pagination not working .

    • 9 years, 7 months ago Mirela
      Participant

      Hello,

      This is a customization not included in support service (since it’s a personal preference edit made to theme) Please read more regarding our Support Policy.
      I helped you do that, but fixing the pagination for this new situation requires more code editing. This is all i can do for this case. If you must have the pagination too, then i suggest you to hire a developer to help you with that or do it yourself.

      Best regards!

Viewing 13 reply threads

You must be logged in to reply to this topic.

Login

Log In
Register

Renew Support

  • Renew Specular Support
  • Renew Tower Support
  • Renew Folie Support
  • Renew Handel Support
  • Renew June Support
  • Renew Picante Support
  • Renew Thype Support
  • Renew Regn Support

Search Forums

Forums

  • Bygge – Construction Theme
  • Converta – Software Theme
  • Folie – The WordPress Website Builder
  • Handel – Responsive Multi-Purpose Business Theme
  • June WooCommerce WordPress Theme
  • Livecast – Podcast Theme
  • Picante – Restaurant & Food WordPress Theme
  • Regn | Agency & Business WordPress Theme
  • Remake – Minimal Portfolio & Agency Theme
  • Specular – Multi-Purpose WordPress Theme
  • Suggest us Features
  • Tower – Business-Driven Multipurpose WP Theme
  • Vibrance – Photography Theme

Site Links

  • Support Policy
  • Specular Support Forum
  • Video Tutorials
  • Knowledge Base
  • Guides and Reviews

Useful Articles

  • Build a Website
  • Web Design & Development
  • Hosting
  • WordPress

Login

Log In
Register Lost Password