Can Webflow allow for the addition of a stroke to text for an editable CMS title?
TL;DR
- Add a custom class to the text element and apply CSS in the Project Settings to create a text stroke effect.
- Ensure the CMS is linked correctly and publish the site to confirm the changes.
You can add stroke to text in Webflow for a CMS title by using custom CSS. Here’s how you can achieve it.
1. Add a Custom Class
- Select the Text Element you wish to style with a stroke.
- In the right panel, go to the Selector field and add a specific class name (e.g., .title-stroke).
2. Apply Custom CSS
- Go to the Project Settings and navigate to the Custom Code tab.
- In the Head Code section, insert the custom CSS:
```css
<style>
.title-stroke {
-webkit-text-stroke: 1px black;
color: transparent;
}
</style>
```
- Save changes and publish the site for the styles to take effect.
3. Ensure CMS Compatibility
- Check that your CMS collection is correctly linked to the text element with the stroke class added.
- Publish the site again after linking to ensure everything displays properly.
Summary
To add a stroke to a CMS title in Webflow, create a custom class for your text element and apply CSS for text-stroke effects in the Project Settings. Validate the changes by publishing the site.
