1. Open the CSS panel

    • Pages > Scroll down > Custom Code > Custom CSS or

    • Typing forward slash ( / ), then “CSS”

  2. Copy the Block IDs of the elements you want to animate.

  3. Paste the Block ID into the //FLOATING ANIMATED IMAGES section, separated by commas.

  4. Choose your speed: add your IDs under either the “Quicker float” or “Slower float” section — whichever effect you prefer.

A transparent, greenish glass pyramid with reflective surfaces and water droplets on it, isolated on a black background.
TUTORIAL VIDEO
Close-up of a clear glass with a black liquid inside, with bubbles on the surface and a slight greenish tint, isolated against a black background.

Float animations

Set emphasis font in italics

Step 1: Choose your emphasis font

  • Go to Site Styles (paint brush icon, top right).

  • Click Fonts > Assign Styles.

  • Pick a text style you’re unlikely to use. In this template, I used Content Links Block to assign Instrument Serif as the italic font. (See Fig. 01 below)

  • Swap it for any font you prefer and make a note of the font family name.

Step 2: Open the CSS panel

  • Go to Pages > scroll down > Custom Code > Custom CSS, or

  • Simply type / then search for “CSS.”

Step 3: Update the CSS

  • Scroll to the section titled SET ITALIC FONT. (See Fig. 02)

  • Replace 'Instrument Serif' with the font family you chose in Step 1.

  • Keep the name inside the apostrophes (‘ ’).

Fig. 01
Screenshot of a website or app interface showing instructions on assigning styles to page elements, with labels such as Site Title, Mobile Site Title, Site Navigation, Header Button, and Custom. 
Fig. 02
Screenshot of a webpage titled "Custom CSS" with instructions about modifying code and a button to open in a new window, displaying CSS code with comments and font-family setting.