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

Clients Carousel Arrow

clients carousel arrow mobile
    • 9 years ago RalphB
      Participant

      Expired

      Hello,

      I’d like the arrows on the clients carousel to always be visible on desktop, if possible.

      Also, on mobile, is there a way to either have more clients shown or have the arrows visible? At the moment it only shows one client and there’s no way to show more.

      Example: https://genoa.1docway.com/

       

      Thank you,

      Ralph

    • 9 years ago Mirela
      Participant

      Hello,

      1-To make clients arrows always visible, please add this code into your custom css box:
      .clients_el .pagination a { opacity: 1;}

      2- To display all clients in mobile please add this code:

      @media (max-width: 767px) {
      .caroufredsel_wrapper .clients_caro {
         width: 300px !important;
          height: 1200px !important;
      }}

      Let us know.

      Best regards!

    • 9 years ago RalphB
      Participant

      Expired

      Thanks Mihaila!

      Regarding 1 – is there also a way to make the arrows constantly on the hover way? (Otherwise it’s on top of the images, ex: https://i.imgur.com/PS6neLZ.png)

      Regarding 2 – the arrows are on top of the icons as well (like #1). Example: https://i.imgur.com/yhcy5zg.jpg

       

      Is there a way to increase the padding in between the icons and the arrows, make the arrows smaller, or make the icons smaller?

       

      Thank you!

       

    • 9 years ago RalphB
      Participant

      Expired

      Maybe the solution is to have them always be on the hover mode? That would definitely work on desktop, not sure about mobile, though.

    • 9 years ago Ruco
      Keymaster

      Hello,

      Please add this css code:

      .clients_el:hover .pagination a.next {
          right: 0px;}
      .clients_el:hover .pagination a.prev {
          left: 0px;}
      .clients_el .pagination a.prev {
          left: -60px;
      }
      .clients_el .pagination a.next {
          right: -60px;
      }
      
      @media (max-width: 979px){
      .clients_el:hover .pagination a.next {
          right: -60px !important;
      }
      .clients_el:hover .pagination a.prev {
          left: -60px !important;
      }
      }

      at custom css box.

      If it doesn’t work, add ‘!important’ after each style.

      best regards!

    • 9 years ago RalphB
      Participant

      Expired

      Hey Ruco,

      Thanks for the help, but this has caused the arrows to move in on hover.

      Also, on mobile, the arrows are slightly cut off, is there a way to move them a bit closer?

       

      Thank you!

    • 9 years ago Mirela
      Participant

      Hello,

      1-Just edit the values of the first code to your wish. Example:

      .clients_el:hover .pagination a.next {
          right: -60px !important;}
      .clients_el:hover .pagination a.prev {
          left: -60px !important;}

      Will set them in the same position as the hover.

      2-Same here. You only need to test out the best values fit your wish. Example:

       @media (max-width: 979px){
      .clients_el:hover .pagination a.next {
          right: -40px !important;
      }
      .clients_el:hover .pagination a.prev {
          left: -40px !important;
      }
      }

      Will move the arrows in mobile more inside the content.

      Best regards!

    • 9 years ago RalphB
      Participant

      Expired

      Looks amazing! Thanks!

Viewing 7 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