Skip to main content

Back Button

A lightweight hack for adding a "Go Back" button to any Webflow page. Style the button however you like in the Designer, then wire up the click behaviour with a single-line HTML embed — no external scripts needed.

How it works​

Webflow doesn't expose browser history natively, but an HTML Embed element can inject any valid HTML. Placing onclick="history.back()" on a <button> triggers the browser's native back navigation — identical to pressing the back arrow.

Setup​

StepAction
1Design a button in the Designer with your desired classes (e.g. glob-cta white outline back).
2Do not use a Webflow Button element for this — use an HTML Embed component instead so the onclick attribute is preserved on publish.
3Paste the embed code below, replacing the class names with your own.
4Publish. The button will navigate back one step in browser history on click.

Embed code​

Paste into an HTML Embed component wherever the back button should appear:

<button class="glob-cta white outline back" onclick="history.back()">Go Back</button>

Replace glob-cta white outline back with your own button classes and update the label text as needed.

Notes​

  • Why an Embed and not a Button element? Webflow strips onclick attributes from its native Button and Link elements on publish for security reasons. An HTML Embed preserves raw attributes.
  • The button inherits no styles by default — apply your global button classes (or inline styles) directly in the class attribute.
  • history.back() behaves identically to the browser's back arrow: it does nothing if the user arrived directly (no history entry). If you need a fallback URL, use:
<button class="glob-cta white outline back" onclick="history.length > 1 ? history.back() : window.location.href='/'">Go Back</button>

This redirects to the homepage when there is no history to go back to (e.g. direct link, new tab).