Scripts

These scripts extend the functionality of Webflow.

Add spans to rich text

This Finsweet code adds a span to rich text when the class is wrapped in angle brackets on both sides of the text intended to be styled. The effect will not appear in the Webflow Designer, but will appear on the live site.

Tip: Webflow automatically changes class names to lowercase & replaces spaces with hyphens in the CSS stylesheet, so Text - Primary would actually be text---primary in the stylesheet. This script requires the stylesheet format of classes referenced, rather than the display format.

Tip: Another workaround for cases where you need a class applied within a rich text block is to create a standard text block, create a span within that text block, add a class, & then copy & paste that text into the rich text block. This approach will be appear as intended in the Webflow Designer.

Example

This is some <text---primary>primary color<text---primary> text.</text---primary></text---primary>

Current year replacement

This code, created by Sam Liew, will fill any div or span with the class Copyright Year with the current year.

Tip: Since this effect doesn't show in the Webflow Designer, it's good to use 20xx as the content of the div/span so that it can be easily identified on the live site where the Copyright Year class hasn't been added.

Note: This method is preferred to other methods because it will replace multiple dates on the same page.

Example
The year is 20xx.