{"id":194703,"date":"2024-06-30T12:08:31","date_gmt":"2024-06-30T12:08:31","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/top-down-scroll\/"},"modified":"2026-10-10T15:48:13","modified_gmt":"2026-10-10T15:48:13","slug":"top-down-scroll","status":"publish","type":"plugin","link":"https:\/\/ml.wordpress.org\/plugins\/top-down-scroll\/","author":22049994,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"1.3.7","stable_tag":"1.3.7","tested":"7.1.3","requires":"6.0","requires_php":"7.4","requires_plugins":null,"header_name":"Top-Down Scroll \u2013 Customizable Scroll to Top Button","header_author":"Nitya Saha","header_description":"This plugin provides Scroll to Top and Scroll to Down functionality to your website.","assets_banners_color":"395e63","last_updated":"2026-10-10 15:48:13","external_support_url":"","external_repository_url":"","donate_link":"https:\/\/buymeacoffee.com\/nityasaha","header_plugin_uri":"","header_author_uri":"https:\/\/nitya.codesocials.com\/","rating":5,"author_block_rating":0,"active_installs":60,"downloads":2446,"num_ratings":1,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.3.1":{"tag":"1.3.1","author":"nityasaha","date":"2024-06-30 12:12:34","revision":3109970},"1.3.2":{"tag":"1.3.2","author":"nityasaha","date":"2025-01-05 13:29:15","revision":3217192},"1.3.3":{"tag":"1.3.3","author":"nityasaha","date":"2025-03-24 19:29:46","revision":3261072},"1.3.4":{"tag":"1.3.4","author":"nityasaha","date":"2025-11-26 18:19:24","revision":3403613},"1.3.5":{"tag":"1.3.5","author":"nityasaha","date":"2026-01-19 19:57:33","revision":3442784},"1.3.6":{"tag":"1.3.6","author":"nityasaha","date":"2026-09-05 10:43:54","revision":3682359},"1.3.7":{"tag":"1.3.7","author":"nityasaha","date":"2026-10-10 15:48:13","revision":3738300}},"upgrade_notice":{"1.3.7":"

New border and spacing settings. Existing settings are preserved.<\/p>"},"ratings":{"1":0,"2":0,"3":0,"4":0,"5":1},"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3261047,"resolution":"128x128","location":"assets","locale":"","width":128,"height":128},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3261047,"resolution":"256x256","location":"assets","locale":"","width":256,"height":256}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":3261047,"resolution":"1544x500","location":"assets","locale":"","width":1544,"height":500},"banner-772x250.png":{"filename":"banner-772x250.png","revision":3261047,"resolution":"772x250","location":"assets","locale":"","width":772,"height":250}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":["1.3.1","1.3.2","1.3.3","1.3.4","1.3.5","1.3.6","1.3.7"],"block_files":[],"assets_screenshots":{"Screenshot-1.png":{"filename":"Screenshot-1.png","revision":3109967,"resolution":"1","location":"assets","locale":"","width":1345,"height":765},"Screenshot-2.png":{"filename":"Screenshot-2.png","revision":3682359,"resolution":"2","location":"assets","locale":"","width":1104,"height":1288}},"screenshots":{"1":"The scroll to top and scroll to bottom buttons on the front end of a site.","2":"The plugin settings screen under Appearance \u2192 Top-Down Scroll."}},"plugin_section":[],"plugin_tags":[10418,10423,1791,147336,8500],"plugin_category":[],"plugin_contributors":[229017],"plugin_business_model":[],"class_list":["post-194703","plugin","type-plugin","status-publish","hentry","plugin_tags-back-to-top","plugin_tags-go-to-top","plugin_tags-scroll-to-top","plugin_tags-scroll-to-top-button","plugin_tags-smooth-scroll","plugin_contributors-nityasaha","plugin_committers-nityasaha"],"banners":{"banner":"https:\/\/ps.w.org\/top-down-scroll\/assets\/banner-772x250.png?rev=3261047","banner_2x":"https:\/\/ps.w.org\/top-down-scroll\/assets\/banner-1544x500.png?rev=3261047","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/top-down-scroll\/assets\/icon-128x128.png?rev=3261047","icon_2x":"https:\/\/ps.w.org\/top-down-scroll\/assets\/icon-256x256.png?rev=3261047","generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/top-down-scroll\/assets\/Screenshot-1.png?rev=3109967","caption":"The scroll to top and scroll to bottom buttons on the front end of a site."},{"src":"https:\/\/ps.w.org\/top-down-scroll\/assets\/Screenshot-2.png?rev=3682359","caption":"The plugin settings screen under Appearance \u2192 Top-Down Scroll."}],"raw_content":"\n

Top-Down Scroll adds a scroll to top button<\/strong> to your WordPress site, plus an optional scroll to bottom button<\/strong>, so visitors can jump to either end of a long page in a single click.<\/p>\n\n

Long posts, documentation pages, product listings and endless-scroll archives all leave readers stranded at the bottom of the page. A back to top button fixes that, and this plugin adds one without you touching a single line of code.<\/p>\n\n

Everything is configured on one screen under Appearance \u2192 Top-Down Scroll<\/strong>. There is no shortcode to place and no template file to edit: switch a button on and it appears across your whole site.<\/p>\n\n

Why use Top-Down Scroll?<\/h4>\n\n
    \n
  • Two buttons, controlled separately<\/strong> \u2014 turn on the scroll to top button, the scroll to bottom button, or both.<\/li>\n
  • Shows only when it is useful<\/strong> \u2014 the top button appears once a visitor has scrolled past 10% of the page, and the bottom button hides as they approach the end, so neither button sits on top of your content when it is not needed.<\/li>\n
  • Smooth scrolling<\/strong> \u2014 clicking a button glides the page to the top or bottom instead of jumping there.<\/li>\n
  • Use your own icon<\/strong> \u2014 pick any image or SVG from your media library, or keep the built-in arrows.<\/li>\n
  • Match your brand colors<\/strong> \u2014 choose a background color and a separate hover color with the built-in color picker.<\/li>\n
  • Left or right<\/strong> \u2014 place the buttons on whichever side suits your layout.<\/li>\n
  • Adjustable icon size<\/strong> \u2014 set the size in pixels to suit your design.<\/li>\n
  • Shape the button<\/strong> \u2014 set the corner radius, inner padding, and an optional border with its own width and color.<\/li>\n
  • Control the spacing<\/strong> \u2014 choose how far the buttons sit from the bottom of the screen and from the side of the page.<\/li>\n
  • Works with any theme<\/strong> \u2014 the buttons are output through wp_footer<\/code>, so block themes, classic themes and page builders are all supported.<\/li>\n
  • Translation ready<\/strong> \u2014 every piece of interface text can be translated.<\/li>\n<\/ul>\n\n

    How it works<\/h4>\n\n

    Once activated, the plugin renders a fixed-position button in the corner of your site. As the visitor scrolls, the button appears; clicking it smooth-scrolls the page back to the top. If you also enable the scroll to bottom button, a second button sits beside it and jumps the visitor to the end of the page.<\/p>\n\n

    You stay in control of how the buttons look. Upload a custom arrow, a chevron, a logo mark or any icon you like, set its size, and give it a background and hover color that fits your design.<\/p>\n\n\n

    From your WordPress dashboard<\/h4>\n\n
      \n
    1. Go to Plugins \u2192 Add New<\/strong>.<\/li>\n
    2. Search for Top-Down Scroll<\/strong>.<\/li>\n
    3. Click Install Now<\/strong>, then Activate<\/strong>.<\/li>\n
    4. Go to Appearance \u2192 Top-Down Scroll<\/strong> to configure your buttons.<\/li>\n<\/ol>\n\n

      Manual installation<\/h4>\n\n
        \n
      1. Upload the top-down-scroll<\/code> folder to the \/wp-content\/plugins\/<\/code> directory, or upload the zipped folder via Plugins \u2192 Add New \u2192 Upload Plugin<\/strong>.<\/li>\n
      2. Activate the plugin through the Plugins<\/strong> menu in WordPress.<\/li>\n
      3. Go to Appearance \u2192 Top-Down Scroll<\/strong> to configure your buttons.<\/li>\n<\/ol>\n\n\n
        \n

        How do I add a scroll to top button in WordPress?<\/h3><\/dt>\n

        Install and activate Top-Down Scroll, then go to Appearance \u2192 Top-Down Scroll<\/strong> and switch on Scroll to top<\/strong>. The button is added to every page of your site straight away, with no shortcode or theme editing required.<\/p><\/dd>\n

        Where do I find the plugin settings?<\/h3><\/dt>\n

        Under Appearance \u2192 Top-Down Scroll<\/strong> in your WordPress dashboard. There is also a Settings<\/strong> link next to Top-Down Scroll on the Plugins screen.<\/p><\/dd>\n

        Can I show only the scroll to top button?<\/h3><\/dt>\n

        Yes. The scroll to top and scroll to bottom buttons are independent, so you can enable either one on its own or use both together.<\/p><\/dd>\n

        Can I use my own icon or image?<\/h3><\/dt>\n

        Yes. Click Select icon<\/strong> next to either button and choose any image from your media library. SVG and PNG both work. Leave it empty to use the built-in arrow.<\/p><\/dd>\n

        Can I change the button color?<\/h3><\/dt>\n

        Yes. The settings screen has a color picker for the button background and a second one for the hover color, so the button can change color when a visitor points at it.<\/p><\/dd>\n

        Can I move the button to the left or the right?<\/h3><\/dt>\n

        Yes. The Position<\/strong> setting places both buttons on either the left or the right side of the screen.<\/p><\/dd>\n

        How do I change the size of the button icon?<\/h3><\/dt>\n

        Set a value in the Icon size<\/strong> field. The default is 20px, and 18\u201325px works best when both buttons are enabled at once.<\/p><\/dd>\n

        Can I round the corners or add a border?<\/h3><\/dt>\n

        Yes. Border Radius<\/strong> rounds the corners of both buttons, and Border Width<\/strong> adds a border once it is set above 0. The border color is picked in the Colors<\/strong> section, next to the background and hover colors.<\/p><\/dd>\n

        Can I change how far the buttons sit from the edge of the screen?<\/h3><\/dt>\n

        Yes. Bottom Spacing<\/strong> controls the gap from the bottom of the screen and Side Wall Spacing<\/strong> the gap from the left or right edge. When both buttons are enabled the top button is positioned automatically so it always clears the bottom one, whatever padding, icon size and border you have chosen.<\/p><\/dd>\n

        When does the scroll to top button appear?<\/h3><\/dt>\n

        The top button appears once the visitor has scrolled past roughly 10% of the page, so it stays out of the way at the very top. The bottom button hides once they are within the last 10% of the page.<\/p><\/dd>\n

        Does it work with my theme?<\/h3><\/dt>\n

        Yes, as long as your theme calls wp_footer()<\/code>, which every properly built theme does. Block themes, classic themes and page builder layouts are all supported.<\/p><\/dd>\n

        Does the button work on mobile?<\/h3><\/dt>\n

        Yes. The buttons use fixed positioning and stay in the corner of the screen on phones and tablets just as they do on desktop.<\/p><\/dd>\n

        Does clicking the button scroll smoothly?<\/h3><\/dt>\n

        Yes. Both buttons use native smooth scrolling, so the page glides to the top or bottom rather than jumping instantly.<\/p><\/dd>\n\n<\/dl>\n\n\n

        1.3.7<\/h4>\n\n
          \n
        • New settings for button padding, border radius, bottom spacing and side wall spacing<\/li>\n
        • New settings for button border width and border color<\/li>\n
        • Border radius, padding and the border now apply to the scroll to bottom button as well, not only the scroll to top button<\/li>\n
        • Fixed the top button overlapping the bottom button when a custom padding, icon size or bottom spacing was used<\/li>\n
        • The media library is no longer loaded on the front end, or on admin screens that do not need it<\/li>\n
        • SVG uploads are now left alone when another plugin already allows them, and are limited to administrators<\/li>\n
        • Fixed SVG uploads being rejected on hosts where the server reports the file as plain text<\/li>\n<\/ul>\n\n

          1.3.6<\/h4>\n\n
            \n
          • Redesigned the settings screen: card-based layout, toggle switches, a segmented position control and clearer icon previews<\/li>\n
          • Added a \"Settings saved\" confirmation notice<\/li>\n
          • Added input sanitization for the icon size setting<\/li>\n<\/ul>\n\n

            1.3.5<\/h4>\n\n
              \n
            • Compatabillity<\/li>\n<\/ul>\n\n

              1.3.4<\/h4>\n\n
                \n
              • Compatabillity<\/li>\n<\/ul>\n\n

                1.3.2<\/h4>\n\n
                  \n
                • Compatabillity<\/li>\n<\/ul>\n\n

                  1.3.1<\/h4>\n\n
                    \n
                  • Security and optimization<\/li>\n<\/ul>\n\n

                    1.3<\/h4>\n\n
                      \n
                    • Bug-free<\/li>\n<\/ul>\n\n

                      1.2<\/h4>\n\n
                        \n
                      • All required features added<\/li>\n<\/ul>\n\n

                        1.1<\/h4>\n\n
                          \n
                        • First release<\/li>\n<\/ul>","raw_excerpt":"Add a scroll to top button and an optional scroll to bottom button to any WordPress theme. Custom icon, color, size and position.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/194703","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=194703"}],"author":[{"embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/nityasaha"}],"wp:attachment":[{"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=194703"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=194703"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=194703"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=194703"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=194703"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/ml.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=194703"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}