FlexSlider Dot Navigation

  • Resolved jdaldana

    (@jdaldana)


    7 years, 1 month ago

    Hi,

    We are using FlexSlider with Dot navigation on our website.
    We recently updated our Metaslider plugin from 3.6.6 to 3.6.8.
    After updating, the “dot” navigation is missing and the black bar is moved halfway to the right.
    Below are links to screenshots before and after:

    Before update (3.6.6) https://d.pr/FREE/hO0FMo
    After update (3.6.8) https://d.pr/FREE/mQCXhD

    For now, we have disabled the dot navigation so you wont actually see it live.
    Can you please advise a possible solution?
    Please let me know if you need additional information.

    Thanks,
    -JD

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

  • Hi @jdaldana,

    Sorry for the inconvenience. I’m not sure but if you could create a test page with a slideshow that has the dots then I can take a look at it.

    Thread Starter jdaldana

    (@jdaldana)

    Hi @kbat82,

    We have enabled the FlexSlider with the dot navigation.
    It is still moved to the right but hopefully it will help on analyzing the problem.
    I’m not sure how to bring it back to the one with working dots.

    Please let me know if you need anything else.

    Thanks,
    -JD

    Hi JD,

    Looks like your theme has some styles that are altering the MetaSlider. If you look on main.css on line 386. However, to fix it you can add your own custom CSS styles. This should work, but depends on what you want it to look like.

    .metaslider .flex-control-nav {
    background: none;
    left: 0;
    width: 100%;
}
    Thread Starter jdaldana

    (@jdaldana)

    Hi @kbat82,

    Thank you for the code.
    I was managed to bring back the dot navigator.
    I will just probably play around with the code to make the bar bigger.

    Thanks again for your help!

    Hi JD, glad you worked it out. I just took a look and it looks like you want to change it up a bit. Try this:

    .metaslider .flex-control-nav {
    background: #000;
    left: -50%;
    width: 200%;
    padding: 1rem 0!important;
    bottom: -2.5rem!important;
}

    Good luck! By the way, if you’re enjoying the MetaSlider plugin please leave us a 5-star review. They really help us out. Thanks!

    https://www.ads-software.com/support/plugin/ml-slider/reviews#new-post

    Thread Starter jdaldana

    (@jdaldana)

    Hi @kbat82,

    Thank you for the follow-up.
    I applied the code you included and our slider looks much better now.
    I appreciate your help on this.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘FlexSlider Dot Navigation’ is closed to new replies.