Is there a code in Webflow that can automatically redirect an idle page back to the Home page after a certain period of time?

TL;DR
  • Access Project Settings in Webflow Dashboard, select the project, and open Project Settings.
  • Insert JavaScript code in the Footer Code section of the Custom Code tab, which resets a timer on user activity and redirects to the homepage after a minute of inactivity.
  • Save changes and publish the project to apply the code to the live site.

To automatically redirect an idle page back to the Home page using Webflow, you can implement a JavaScript snippet in your site settings. This feature isn't directly built into Webflow, but JavaScript can achieve the desired outcome.

​

1. Access Project Settings

  • Go to your Webflow Dashboard and select the project you wish to modify.
  • Click on Project Settings to open the project configuration pages.

​

2. Insert Custom Code

  • Select the Custom Code tab within the Project Settings.
  • In the Footer Code section, insert the following JavaScript snippet. Ensure the snippet is enclosed in <script> tags:

  ```javascript

  let idleTimer;

  const idleDurationMillis = 60000; // 1 minute

​

  const resetIdleTimer = () => {

    clearTimeout(idleTimer);

    idleTimer = setTimeout(() => window.location.href = '/', idleDurationMillis);

  };

​

  document.onload = resetIdleTimer;

  window.onmousemove = resetIdleTimer;

  window.onkeypress = resetIdleTimer;

  ```

  • This script will redirect the user to the home page ("/") after one minute of inactivity. Adjust the idleDurationMillis value for different time durations.

​

3. Save Changes

  • Scroll down and click Save Changes to apply the JavaScript to your project.
  • Ensure you Publish your project for the changes to take effect on your live site.

​

Summary

To automatically redirect an idle page back to the Home page in Webflow, you'll need to insert a JavaScript snippet into the Footer Code section of your Project Settings. This script listens for user activity and redirects the page after a specified period of inactivity. Make sure to adjust the duration to suit your needs.

Rate this answer

Other Webflow Questions