Skip to main content

Introduction to the Styled Text Page

The Styled Text page is one of the most commonly-used page types in RapidWeaver. It’s flexible enough to enable you to style content with rich text formatting, but extensible enough to allow the more code-savvy among us to place in HTML if you need it (e.g. pasting in an embedded YouTube video).

Getting started

Let’s get started by adding some text. You can write in RapidWeaver, or paste in content from other apps. If you’re pasting in from Microsoft Word, we recommend you use the Edit menu’s Paste as Plain Text option. This will ensure that any unusual formatting from Word is not transferred to your website.

Working with images

Styled Text pages support JPEG, PNG and GIF images, which can be added to your page via Drag and Drop or via the Site Resources Browser (available on the View menu). 

You can also search for images via Unsplash in the Site Resources browser, it's super handy.

If you need to make some adjustments to the image, open the Media Inspector by double-clicking on the image, where you can scale, rotate, and rename the image.

We recommend you give each image a non-cryptic filename such as “realmacsoftware- logo”, and ensure that you fill in the Alternate text field. This alternate field will be shown to visitors who may have images turned off (or are viewing your site on a slow connection), and is a great way to improve the accessibility of your website.

Using HTML code in Styled Text Pages

RapidWeaver’s Styled Text pages, and any other page types that use the styled text areas available to plugins, also allow you to paste in HTML. To ensure your code appears as you expect, you should identify blocks of code as such by choosing Format > Ignore Formatting. By using this option, you’re telling RapidWeaver not to alter or stylise the content.

So what should you do if you’ve got code that you want to show as an example on your website? Highlight the block of code and then use the Format > HTML > Code. This will apply the appropriate HTML tags to ensure the code is displayed properly when previewing and publishing the site.