Exemple of sliders with animations

contact's Avatar

contact

07 Dec, 2018 05:54 PM

Hello ,
I am a wordpress user and my coding ability are quite... limited. I can handle simple html, but I don't know other languages.
That said I believe If I have access to severals sliders mades in wordpress I should be able to use them.
So, I was wondering if you could share some exemple of Sliders made with wordpress , including slides with animation and deep linking. Even some screen shoot of the wordpress's dashboard code would work well! For exemple the ones in demonstrations on your website ?

What I am trying to do, is a slider with multiple text slides.
The slide 1 would be a kind of Menu with links to each other slides.
The others slides would be the slides called by slide 1. And also I would like, if possible, that each slide is deep linked with the 1.
ex http://www.aaaa.com/#1 http://www.aaaa.com/#2 http://www.aaaa.com/#3

I bet it's not usual request, so I would understand if it's not possible.
Thanks
Alex

  1. Support Staff 1 Posted by Dmitry Semenov on 07 Dec, 2018 06:17 PM

    Dmitry Semenov's Avatar

    Hello,

    What I am trying to do, is a slider with multiple text slides. The slide 1 would be a kind of Menu with links to each other slides.

    Such customizations require both HTML and CSS knowledge. For example, to create an element that links to the slide #7 enable deeplinking option and use HTML code:

    <a class="my-link" href="#image-7">Link text</a>
    

    Then you'll need to use CSS to style it how you need, for example:

    a.my-link {
      position: absolute;
      left: 0;
      top: 0;
      padding: 10px;
      background: black;
      color: white;
    }
    

    (css can be added to your theme style.css or custom CSS option)

  2. 2 Posted by contact on 08 Dec, 2018 05:35 AM

    contact's Avatar

    Thanks Dmitry.
    What I don't understand is how/where should I create the anchor of div
    <div id="image7">...</div>

    Indeed, I tried to put it in a html block inside Slide B , and to call it from slide A (with <a class="my-link" href="#image-7">Link text</a>)
    and it doesn't seams to work.

  3. Support Staff 3 Posted by Dmitry Semenov on 08 Dec, 2018 02:32 PM

    Dmitry Semenov's Avatar

    It can be added either to "Slide HTML" tab in edit slide dialog, or to Block Editor.

    Indeed, I tried to put it in a html block inside Slide B , and to call it from slide A (with Link text) and it doesn't seams to work.

    If you won't be able to resolve - please link to the page with this slider.

  4. 4 Posted by contact on 08 Dec, 2018 04:32 PM

    contact's Avatar

    I got it ! Thank you very much Dmitry !

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac