Support » Plugin: MaxSlider » Improving dot navigation

  • Resolved Erpol



    I have a request / suggestion:
    The dot navigation (as opposed to the left/right arrows) is very elegant, but it has a settings problem. Specifically, you can define only 1 color (background), which makes them hard to see on different images. Since the arrows already have 2 colors (back/foreground) in the settings, the dots should also use them.
    They could look like the Tabloid theme slider for instance: a circle in the foreground color, inside a bigger circle in the background color.

    And 1 nice-to-have: be able to set their vertical position in the image (like pixels from bottom)

    Thanks for your attention,


Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Vassilis Mastorostergios



    We’d like to keep it simple and plug and play generally, but you can certainly do that with a sprinkle of custom CSS.

    For example

    .maxslider .slick-dots button {
      width: 20px;
      height: 20px;
    .maxslider .slick-dots button:before {
        content: "";
        width: 10px;
        height: 10px;
        display: inline-block;
        background-color: #000;
        border-radius: 50%;
        margin-left: 3px;

    This will add foreground dots to the dot navigation.

    The image position can be changed by applying background-position on the image element you wish 🙂

    Thank you so much for your quick reply Vasili!

    But I must have missed something, if I put your code in the custom CSS I’m not getting 2 concentric circles, I just get bigger dots (20x20px), in a single color which is the one defined in the settings as “navihgation background color” (not #000).

    Am I doing something wrong ?


    Plugin Author Vassilis Mastorostergios


    Hmm, is the website somewhere live so I can inspect it?

    I need to give you credentials in a private email, it’s under construction right now.

    Plugin Author Vassilis Mastorostergios


    You can shoot me an email at vmasto [at] cssigniter [dot] com

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Improving dot navigation’ is closed to new replies.