Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1234632

    Hi, is there a way to add text above the animated scroll down arrow in the color section or fullscreen slider?

    Please see screenshot example in link provided.

    I found the code below in an old thread (https://kriesi.at/support/topic/add-some-text-above-the-scroll-down-arrow-on-fullscreen-slider/) but it doesn’t work as it REPLACES the arrow with the text, which is not what I want.

    #top .scroll-down-link:before {
    content: ‘click here’;
    font-size: 12px;
    }

    #1234874

    Hey Kaionel,

    Please do the following:
    1. Use a child theme (skip this if you have one). You can download and find instructions here: https://kriesi.at/documentation/enfold/child-theme/
    2. In the child theme’s functions.php file, please add this code at the bottom:

    function scrolldown_text(){
        ?>
        <script>
            (function( $ ) {
                $( ".scroll-down-link" ).append( "<span>Text Here</span>" );
            }(jQuery));
        </script>
        <?php
    }
    add_action('wp_footer', 'scrolldown_text');

    Please replace Text Here with the text you want to use.
    3. Then add this CSS code in Quick CSS:

    #top .scroll-down-link span {
        display: block;
        font-size: 18px;
        width: 200px;
        position: relative;
        left: -50%;
        margin-left: -16px;
        top: -100px;
    }

    Best regards,
    Nikko

    #1234984

    or you can use the pseudo container after:

    #top .scroll-down-link:after {
      content:"click here";
      font-size: 15px;
      text-align: left;
      line-height: 10px !important;
      position: absolute;
      top: 0;
      left: 8px;
      color: cyan;
    }

    on slider you need to shift the avia-slideshow-dots

    #1235124

    Hi Guenni007,

    Thanks for helping out and giving a simpler solution :)

    Best regards,
    Nikko

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.