We have preset certain styles for the website in order to achieve a level of consistency and read-ability on all the pages. The page title above is an h1 and there should only be one h1 per page, so you will never need to select h1 as a style. You will use the “paragraph” dropdown in the text editor toolbar to select the desired text style. Please refer to your training packet for more information.
Format Text Using Pre-set Styles (This is an h2)
When to use a blue h2 as shown above (This is an example of an h3 style)
H2 style should be used to announce the most important sections of the text (see blue text above). If you have 3 or more paragraphs, you typically have enough content to break it into two sections. Incorporating headings into your content is a best practice for reading on the web (people like to scan to find out what’s on the page) and for SEO purposes as well.
When to use an h3 style (This is an h3)
If there are subsections that need to be highlighted within the h2 section, you would want to use an h3.
When to use a blockquote (This is an h3)
The blockquote icon in the toolbar above can be used to draw attention to specific text from the page. It’s also a nice feature to use if there are no photos on the page in order to add some visual interest.
This is an example of a blockquote. Blockquotes don’t actually have to be “quotes.” They can simply be important text you want your visitors to notice.
Using an h6 style to show a “Button Link” (this is an h3)
There may be occasions when you would like to have some brief text and then direct site visitors to another important page. We have created a specific “style” that you can use which will help to make your important link stand out. These will work best at the end of a paragraph or at the end of the page. To get the button style, select “h6” from your paragraph formatting option above, and then use the link icon as usual to add your link. See example below.
My important link
Formatting Pictures & Graphics (this is an h2)
For consistency and optimal viewing throughout the website, certain image sizes have been established. See below for examples and more information.
Horizontal photos (this is an h3)
For consistency and optimal viewing, small horizontal photos should be sized to 300 px wide by 200 px tall. In most cases, you will want to either left or right align the photos so that the text wraps nicely around the photo. Refer to your training packet for further instructions.
An example of a left-aligned horizontal photo is shown to the left.
Vertical Photos (this is an h3)
Vertical photos are also an option to add some visual interest to the page. Vertical photos
should be size to 250px x 300 px. As a reminder, to add photos to a page, you will need to click the “add media” tab in the upper left of the text editor tool bar.
Once inserted, you can click on the photo itself to choose the alignment you desire. The vertical example photo on the right is “right-aligned”.
Full Width Photo (this is an h3)
There may be times when you want to insert a photo that fills basically the full width of the text area. These photos should be sized to a maximum width of 620px. The height can vary as needed. Please see example photo below. We have chosen to “center-align” this photo. If the photo does not show its full size when inserted, you may need click the photo, choose “edit” and then select “full size” from the sizing dropdown menu.
Please refer to this page as needed to remind yourself of the various styling options. If you need additional assistance, we’d be happy to help. Call 704.375.0831.