> For the complete documentation index, see [llms.txt](https://www.wonderly.com/help/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://www.wonderly.com/help/wonderly/wonderlys-navigation/my-business-navigation/website-navigation.md). # Website navigation ### Home **Three dots menu** — Open the **Page SEO** section to improve how your pages appear in search results. * **SEO Metadata** - Metadata is information about your page that search engines read. * **Title** — The page title that appears in search results. * **Description** — The page description is displayed under the title in search results. * **Keywords** — Words and phrases people search for related to your page content. * **Images** — Add images for image search optimization. * **Custom Code** — Add custom code to your website for advanced SEO and tracking. * **Header Code** — Code added to your page's `` section (used for meta tags, analytics, etc.) * **Body Head Code** — Code added at the beginning of your page's `` section. * **Body Footer Code** — Code added at the end of your page's `` section (used for tracking pixels, analytics, etc.) **Site Navigation Bar** — Edit your website's main menu. * **Content Tab** — Edit and manage the actual content and elements that appear in your navigation bar. * **Navigation Links** — Manage the menu links that appear in your navigation bar. * **Logo** — Upload or manage your business logo. * **Alt Text** — Helps search engines understand your image, improving SEO. * **Logo Link Toggle** — Control whether your logo is clickable. When enabled, visitors can click your logo to go to your homepage or any other page you configured. * **Call to Action Section** — Add a button or link that encourages visitors to take action. * **Text** — The button text that appears (e.g., "Book Now," "Contact Us," "Get Started"). * **Style** — Design options for how the button looks: * Solid * Outlined * Text * **Action** — What happens when someone clicks the button: * Navigate to a page. (Services, Contact, etc.) * Open a booking form. * None. * **Design Tab** — Customize how your navigation bar looks visually. * **Navigation Position** — Controls where and how your navigation bar appears on your website. * **Always Visible** — Your navigation bar stays visible at the top of the page as visitors scroll down. They can always access your menu. * **Hidden on Scroll** — Your navigation bar automatically hides when visitors scroll down the page, and reappears when they scroll back up. This saves screen space on mobile devices. * **Link Color Section** - Controls the color of your navigation links. * **Page Sections** — These are the individual content blocks displayed on your website. * **+ Add Section** — Add new content blocks to your website. * **Footer** — Edit the footer of your website. * **Site Design** — Customize the overall visual appearance and styling of your entire website**.** * **Colors** — Controls the color palette for your entire website. * **Color palette** — A selection of pre-designed color schemes. * **Primary** **buttons** — The color of action buttons. (Book Now, Contact, etc.) * **Titles** — Color of page titles and headings. * **Text** — Color of body text and regular content. * **Links** — Color of hyperlinks. * **Background** — Background color of your website pages. * **Borders** — Control the outline or edge styling of design elements on your website. * **Section Spacing** — Controls the padding and spacing between content sections. * **Bar slider** — Allows you to adjust spacing visually. * **Less Padding** — Tighter spacing between sections. (more compact look) * **More** **Padding** — More space between sections. (more spacious look) * **Fonts** — Controls the typography (fonts) used throughout your website. * **Hero Font** — The large, prominent font used for main headlines and hero sections. * **Header** — Font used for page headers and major section titles. * **Heading** — Font used for secondary headings. * **Subheading** — Font used for subheadings and smaller titles. * **Titles** — Font used for various title elements. * **Text** — Font used for body text and regular content. * **SEO & Tracking** — Controls default SEO settings and code that applies across all pages. * **Default SEO Metadata** — Controls the default search engine information for your website. * **Default Title** — The default page title that appears in search results if a specific page doesn't have its own title. This is the main headline shown in Google search results. * **Default Description** — The default page description shown under the title in search results. This is the preview text that helps people decide whether to click your link. * **Default Keywords** — Default keywords and phrases that search engines use to understand your website content and match it to search queries. * **Images** — Default images associated with your website for search results and social media sharing. * **Site Logo** — Your business logo that appears in search results and when your website is shared on social media. * **Default Favicon** — The small icon that appears in browser tabs next to your website name. Helps with branding and recognition. * **Use Default URL Toggle** — A switch that controls whether to use default URL settings across your site or customize per page. * **Custom Code** — Add custom code for advanced tracking and functionality. * **Header Code** — Custom code added to your page's `` section. * **Body Head Code** — Custom code added at the beginning of your page's `` section. * **Body Footer Code** — Custom code added at the end of your page's `` section. ### Website view * **View Options** — Preview your website on different devices. * **Desktop view** (laptop icon) — Shows how your website looks on computers and larger screens. * **Mobile view** (phone icon) — Shows how your website looks on smartphones and tablets. * **Analytics** — View your website performance data. * Total Visitors. * Page Views. * Avg. Views per Visitor. * Form Submissions. * **Pages Dropdown List** — Navigate between different pages on your website. * **Light Indicator** — Color-coded lights that indicate your website status. * **Yellow light** = Work in progress, not yet published. * **Green light** = Published and live for everyone to see. * **Publish** — Control status of your website. * **Draft** — The page is saved but not yet published to the internet. Only you can see it. * **Live** — The page is published and visible to the public on your website. * **Publish** — The action button that publishes your changes from Draft to Live status. * **Website Preview** — Shows how your website looks in real time as you make changes. As you edit your navigation bar, colors, fonts, or content, the preview updates instantly.