Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
  • #430775

    Hi there,

    I would really like to use a fullwidth easy slider and add a scroll down button at the bottom just like it is available in the color section or fullscreen slider. How do I do that?

    Also, it would be great to see different button down design options as well as the ability to pace it everywhere on the site.



    Hi gentlemansgazette!

    Try the fullscreen slider instead. It pretty much has the same look as the fullwidth slider and it has an option for a scroll down arrow.

    You could add this to a codeblock element if you want to limit it’s height.

    <style type = "text/css">
    #fullscreen_slider_0 .avia-slideshow {
      height: 300px !important;

    If you want to limit it’s height.

    Best regards,


    Well, the problem is I want to use the full page slider one some pages and the full width on others.

    If I choose a fixed height, it will not scale across devices… So I would really appreciate an arrow down option for the full width one. It seems like it was forgotten for that element…



    It would take a lot of time and code to implement. Consider creating a feature request here,, and if it gets enough interest we will probably see an option get added in a future update.




    This topic is one year old but today I was also looking for a solution for that problem.
    Here is my solution:

    1) Change the min-height of a section to a small number (e.g. 20px). I did it in the custom.css.
    .avia-section {min-height: 20px;}

    2) Add a color-section after the slider
    no min-height
    no padding
    no border
    with scroll down arrow

    The arrow is diplayed in the slider ;-)

    look here

    • This reply was modified 4 years, 2 months ago by  baucks.


    @baucks Thank you for sharing your solution! We appreciate it :)

    Best regards,


    Baucks, this solution is just briljant … Thanks man!



    Thanks @baucks for sharing :-)



    @baucks Thanx for sharing!



    Glad you got it working @kassiezandstra :-)

    Best regards,


    @baucks, thanks for sharing. I had done the same earlier but didn’t change the minimum height of the section. So I went ahead and gave the section’s Custom CSS Class a name and used it. This way only the sections with the custom CSS class would change. So, if you gave your section Custom CSS Class the name special-section, the code changes to:

    .special-section.avia-section {min-height: 20px;}


    • This reply was modified 3 years, 10 months ago by  Tameez.


    Thanks for sharing @Tameez :-)

    Best regards,


    baucks, thank you so much for sharing this! I know that this post is quite old but it worked perfectly for me, too :)


    Hi webWahine,

    Thanks for confirming that the solution posted here still works :)

    Best regards,

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.