Using the top buttons in pages

Last updated August 5, 2026

Objective

This guide explains the function of the navigation and utility buttons located at the top of the Recur Website Builder interface. These tools allow you to manage page versions, optimize content for search engines, and preview how your site appears on different devices.

Key Steps

Step 1: Manage Workspace and Version History

  • Expand/Collapse Panels: Use the two opposing arrow buttons above the Components menu to expand the editing area. This allows you to hide the sidebars to see a larger version of your page.

  • Undo/Redo: Locate the Back and Forward buttons on the middle bar to revert mistakes or restore changes during your editing session.

  • Save & Status: The bar indicates whether the page is a Draft or Published. While Autosave is enabled, you can also use the manual Save button to ensure your progress is captured.

Step 2: Test Device Responsiveness

  • Device Toggle: Use the icons in the center of the top bar to switch between Computer, Tablet, and Mobile Phone views.

  • Purpose: This allows you to verify that your layouts and content look professional and remain functional across all screen sizes.

Step 3: Utilize the AI Creator Agent

  • Accessing AI: Click the purplish-blue star button to open the AI Assistant.

  • Capabilities: Once you have content on your page, the assistant can provide design suggestions, generate content ideas, and offer advice on how to optimize the layout for better member engagement.

Step 4: Configure SEO and Metadata

  • SEO Metadata: Click the SEO button to use AI-driven optimization. This reviews the page to generate the data search engines need to index your site accurately.

  • Open Graph: Use this section to control how your page looks when shared on social media or via text. You can set the specific image, title, and description that appear in the "preview card."

  • Advanced Settings: Site administrators can use these settings to prevent search engines from crawling or indexing specific pages if they are meant to be private.

Step 5: Preview, Copy, or Delete

  • Preview: Click Preview to see a live-action version of your page as it would appear on the web without officially publishing it. Use the Back button at the top to return to the editor.

  • Copy Page: Use the Copy button to duplicate the current page, which is useful for creating templates.

  • Delete Draft: Click the Delete button in the top right to permanently remove a draft.

Cautionary Notes

  • Permanent Deletion: Use the Delete button with caution; once a draft is deleted, it cannot be recovered.

  • Unpublished Changes: If the publish button indicates "Has Unpublished Changes," it means your live site is currently showing an older version of the page than what is in your editor.

  • AI Dependency: The AI Creator Agent requires existing content on the page to provide specific suggestions or optimizations.

Tips for Efficiency

  • Quick Naming: You can edit the page title directly in the top left bar rather than navigating into the page settings menu on the right.

  • Social Media Readiness: Always configure the Open Graph settings before sharing a new link publicly to ensure your association looks professional when the link is posted on platforms like LinkedIn or Facebook.

  • Reviewing Before Publishing: Frequently toggle between the tablet and mobile views to ensure your text doesn't become unreadable or your images don't get cut off on smaller screens.

Link to Video

https://loom.com/share/2278439ad19f4198838350dcd815ac96