Back to Top Widget

Create Your Own Back to Top Button in Seconds for Your Website

Improve navigation on long web pages with a customizable back to top button. Choose its icon, colors, size, position, scroll trigger, and device visibility to create a smooth scrolling experience that fits your website.

Create Your Back to Top Widget ā€” Itā€™s Free!
Create Your Own Back to Top Button in Seconds for Your Website Hero Bg Image

How to embed Back to Top Widget to WordPress

1Get your embed code

After customizing your Jotform website widget, click Try it on your website for free, and copy the generated embed code.

2Open the page editor

Go to the WordPress post or page where you want to display the widget, then add a new block.

3Add a Custom HTML block

Select Custom HTML and paste your Jotform Website widget embed code into the HTML field.

4Update and view

Click Update or Publish, then open the page to check your embedded widget.

Learn more

Simplify Navigation Across Long Website Pages

Give visitors a convenient way to return to the beginning of lengthy pages without manually scrolling. The floating back to top button remains easy to access as visitors explore articles, product collections, landing pages, documentation, and other content-heavy sections.

Useful for:

Long landing pagesBlog articlesProduct pagesDocumentation pagesFAQ pages
Create Your Button
Simplify Navigation Across Long Website Pages

Bring Visitors Back to Key Content

Help visitors quickly revisit important content located near the top of your page, such as navigation menus, product filters, contact options, and calls to action. This creates a more direct browsing path without interrupting how visitors explore your content.

Help visitors return to:

Header navigationPrimary calls to actionProduct filtersContact optionsPage menus
Improve Page Navigation
Bring Visitors Back to Key Content

Design a Button That Fits Your Brand

Customize your scroll-to-top button so it looks like a natural part of your website. Adjust the background and icon colors, button size, corner radius, and shadow to complement your branding and remain visible against your page design.

Design controls include:

Background colorIcon colorButton sizeCorner radiusButton shadow
Customize Your Button
Design a Button That Fits Your Brand

Control When and Where It Appears

Choose where the button sits on the screen and how far visitors scroll before it appears. Enable smooth scrolling and manage visibility across desktop and mobile devices to keep the button helpful without distracting from your website content.

Behavior controls include:

Screen positionScroll thresholdSmooth scrollingDesktop visibilityMobile visibility
Configure Button Behavior
Control When and Where It Appears