{"id":2267,"date":"2021-05-20T17:57:37","date_gmt":"2021-05-20T14:57:37","guid":{"rendered":"https:\/\/creativethemes.com\/blocksy\/?post_type=documentation&#038;p=2267"},"modified":"2026-09-02T11:03:45","modified_gmt":"2026-09-02T08:03:45","slug":"scroll-to-top","status":"publish","type":"documentation","link":"https:\/\/creativethemes.com\/blocksy\/docs\/general-options\/scroll-to-top\/","title":{"rendered":"Scroll to Top"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">The <strong>Scroll to Top<\/strong> option adds a convenient button that lets visitors quickly return to the beginning of a page. Once activated, the button appears after the visitor scrolls down and uses a smooth scrolling animation when selected.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">To configure it, navigate to <strong>Customiser \u2192 General Options \u2192 Scroll to Top<\/strong>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Quick Look<\/h2>\n\n\n\n<figure class=\"wp-block-video\"><video autoplay loop muted src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2021\/05\/Screen-Recording-2021-09-14-at-00.06.05.mov\" playsinline><\/video><figcaption class=\"wp-element-caption\">Configuring the Scroll to Top button and previewing its appearance.<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Granular Controls<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-995f960e wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"2240\" src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2021\/05\/Screenshot-2026-09-02-at-11.02.56.png\" alt=\"\" class=\"wp-image-15142\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<h3 class=\"wp-block-heading\">Icon Design<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Blocksy includes six built-in icon designs for the Scroll to Top button. Select the style that best matches the rest of your website&#8217;s interface.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Blocksy Pro also lets you upload a custom icon, giving you complete control over the graphic used by the button.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Button Shape<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The button can use a simple squared presentation or place the selected icon inside a circular container. This lets you adapt its appearance to the visual language used throughout the rest of the website.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Size &amp; Position<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Size and spacing controls let you fine-tune how prominent the Scroll to Top button appears and how far it sits from the edges of the browser viewport.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">These settings are useful for keeping the button comfortably accessible while preventing it from overlapping other interface elements positioned near the edge of the screen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Device Visibility<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The Scroll to Top button can be enabled independently for <strong>desktop<\/strong>, <strong>tablet<\/strong> and <strong>mobile<\/strong> devices.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">This allows you to keep the button available where it improves navigation while hiding it on device sizes where it is not needed.<\/p>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>The Scroll to Top option adds a convenient button that lets visitors quickly return to the beginning of a page. Once activated, the button appears after the visitor scrolls down and uses a smooth scrolling animation when selected. To configure it, navigate to Customiser \u2192 General Options \u2192 Scroll to Top. Quick Look Granular Controls [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"doc_categories":[113],"class_list":["post-2267","documentation","type-documentation","status-publish","hentry","doc_categories-general-options"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":7}},"acf":[],"_links":{"self":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/2267","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation"}],"about":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/types\/documentation"}],"author":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/comments?post=2267"}],"version-history":[{"count":3,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/2267\/revisions"}],"predecessor-version":[{"id":15143,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/2267\/revisions\/15143"}],"wp:attachment":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/media?parent=2267"}],"wp:term":[{"taxonomy":"doc_categories","embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/doc_categories?post=2267"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}