Create a semantic structure

Create a meaningful, marked up hierarchy in preparation for styling                                                                                               

Adding content

There are lots of ways to get started in Typecast, so take your pick. You can:

Structuring content

Next, make sure each block of content is marked up appropriately. You can:

  • Change the HTML markup on blocks of content, e.g. change a paragraph (p element) to a heading (h1 element).
  • Create and assign custom classes for unique styles, e.g. create a custom paragraph class (p.intro) for the first paragraph.

Change the markup on a block of content

If you want to change a p element to a heading, simply click the element pill to open the element menu, and select from the list.
Switch to a different element by clicking it in the elements menu

In the example above, we pasted in content that already had a custom class set on the main heading, "h1.main". We want to switch this to a regular heading, so we need to select "h1" from the element menu.

Create and assign a custom class

Create custom classes through the element menuThe element menu includes a button to create a custom class. Doing so will create the class and apply it to the element that is currently active. As soon as you apply a style to it, it will also appear in your CSS. Easy!

Assign an existing custom class to a block of content

Click anywhere within the block of content and open the element menu. Then select the custom class you want to apply to this content from the menu.

The styles set for the custom class will immediately be applied to the block, and any style changes will take effect on all blocks with that custom class.

Find out more in the Add & structure content section.

Have a question?
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
Invalid characters found