Set custom meta titles and descriptions for CMS items

Learn how to set custom meta titles and descriptions for CMS items in Framer to improve SEO and user experience.

Customizing meta titles and descriptions for CMS items helps improve your site’s SEO and ensures search results better reflect your content.

Adding custom meta titles

Meta titles define how your page titles appear in search results, and they should be concise yet relevant to the content.

  1. Create or use a Title field in your CMS. If it doesn’t already exist, add a Plain Text field dedicated to page titles.

  2. In the Title field of your page settings, enter {{Title}} to dynamically insert the title from the CMS item.

A screenshot of Framer's Page Settings interface showing the Title field containing "{{Title}} - Free AI Startup Website Kit". The dark-themed interface displays configuration options for SEO metadata, with the Title field demonstrating how to use a CMS variable to dynamically insert content titles.

Adding custom meta descriptions

Meta descriptions provide a brief summary of your page content and can encourage clicks from search results.

  1. Add a Description field to your CMS. You can name it “Description” or any preferred name.

  2. Fill the field with the description you want for each CMS item.

  3. In the Page Description field of your page settings, enter {{Description}} to dynamically insert the CMS item’s description.

Screenshot of Framer's Page Settings interface showing how to set a dynamic meta description. The interface displays a text field labeled 'Page Description' containing '{{Description}}' as a CMS variable. Below the field is explanatory text stating that plain text values from the CMS can be used for title and description, with examples of available CMS variables (Title, Slug, Description). The page also shows search engine visibility options with checkboxes for 'Show page in search engines' and 'Show page in Site Search'.

Google’s automated descriptions

Google sometimes replaces your meta description with text it considers more relevant to the search query. You can limit this behavior with accessibility settings.

  1. Select the content you think Google might pick in your canvas.

  2. In Accessibility, click +, choose Google Bot, and set it to Skip.

  3. To prevent Google from picking any text, apply this setting to the outermost frame.

Framer's interface showing the Accessibility panel with Google Bot settings. The panel displays options for text alignment, variable settings, and prominently features the Google Bot dropdown menu set to 'Skip'. This setting prevents Google from using selected content in search result descriptions.

Learn more about how metadata works and how to optimize it in Framer Academy – Metadata.