Who We Are

Formatting Demo

Sample Text Formatting and Image Embedding with the Editor Toolbar

Formatting Guidelines

Here are a few suggestions on formatting guidelines when creating and editing site pages. Several of these topics are covered in the Content Entry Guide, I also included some additional suggestions based on reviewing the other pages I edited. Hope these suggestions are helpful!

Headings

Always use a heading tag when creating a heading. Do not just use the bold and/or italic button to style the text.
For heading sizes remember to use heading hierarchically on the page. If there is just one level of headings on the page I would use the medium size (Heading 3) for all headings. If there are two levels of headings I would use the medium size (Heading 3) and the small size (Heading 4). If there are three levels of headings use the large size (Heading 2), the medium size (Heading Three), and the small size (Heading 4).
Don’t use italics in headings (either on single words or the entire heading).
Limit punctuation other than text in headings. Avoid using exclamation points and dashes. If you need to segment the heading use a colon and commas (for example “Mystic Choral Concerts: 3 Seasons, 6 Concerts a Year”).
Capitalize each word in headings except for prepositions and articles. Do not use all caps. On capitalization one exception would be for FAQ style pages (https://mysticchorale.org/faqs-for-singers/) where you should treat each heading as a sentence with a question mark and only capitalize the first word.
Don’t use numbers in heading in effect to create a numbered list out of your headings. For example: 1) Rehearsal Guidelines.

Bulleted and Numbered Lists

Don’t create nested lists, use only a single level. As an alternative try to use subheadings and split the list up into multiple lists. For an example of this see the Ticket Sales and Contest page (https://mysticchorale.org/ticket-sales-and-contest/).
If you need to segment one of the bullet points in a list use a colon and make the first part bold (essentially creating a label).

Outbound Links

Remember to set any outbound links pointing away from the Mystic site to open in a new browser window/tab. See the Content Entry Guide for more on how to use the link options.

Tables

Avoid creating and/or importing HTML tables into the editor field. Tables are not friendly for mobile devices as they cannot be collapsed via CSS to fit the width of the screen. As an alternative to tables present the content using subheadings and bulleted and/or numbered lists.

Pasting Content from Other Sources

When pasting content from other sources (Word Processing programs etc) be sure to use the Paste as Text button in the editor to remove any embedded formatting. In particular any <div> tags accidentally pasted into the editor from another source can mess up the spacing in the content column.

Though somewhat tedious whenever I paste something from an outside source I paste in the text one paragraph at time using the paste as text option, then I go back and apply the formatting needed with the editor toolbar. This method in particular helps in avoiding pasting in unwanted <div> tags.

Dead White Space

Try to avoid leaving dead white space in the content editor (empty paragraph tags). It is particularly easy to do this a the bottom of the page. Between sections/headings and at the bottom of the page make sure to backspace to ensure you aren’t leaving dead white space.

Other General Suggestions

Limit the use of exclamation points in the text copy. Use only single exclamation points, do not use multiple exclamation points.
Do not use all caps to emphasize text. Use bold text to emphasize text, however I would recommend using this sparingly. For example on the General Singer Info page there is so much bold text used that the emphasis effect is somewhat minimized.
I would stay away from using dashes to segment text content, try to use colons and commas instead.
Be consistent in using commas in terms of the final comma and the word and. I’m a big fan of the Oxford comma but either is fine, just be consistent.
Be consistent with abbreviation use particularly for things like for example. I would recommend using for example with a colon rather than e.g.

Heading One

Nunc sed aliquet nisi. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. In ornare tristique turpis consequat fringilla. Quisque non sollicitudin risus, vestibulum venenatis neque. Ut eu posuere quam, eu commodo odio. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu maximus risus. Sed convallis leo at libero consectetur rutrum. Sed tristique fringilla lorem id pulvinar. Etiam consequat libero vel mauris tempor, nec auctor velit condimentum. Vivamus iaculis lacus vitae nisl pellentesque maximus. Suspendisse potenti. Mauris eleifend nisi sit amet turpis posuere, sollicitudin lobortis lorem imperdiet. Donec vel mattis ipsum. Cras ut felis at arcu porttitor maximus sed vel justo. Fusce tempor lacus purus, nec consectetur sem porttitor quis.

Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis iaculis nec mauris nec porttitor. Duis aliquet eros eu nisi pellentesque, quis congue eros luctus. Aenean nisl risus, porttitor sit amet tellus vel, commodo dictum justo.

Heading Two

Ut sit amet metus vel turpis sollicitudin dapibus varius vitae metus. Sed blandit dictum diam nec eleifend.
Maecenas pretium dolor purus, ac vestibulum tortor faucibus luctus. Cras et facilisis nisl.
Sed eget gravida tellus. Nulla suscipit pharetra lorem, eleifend tempus elit porttitor id.

Suspendisse ultricies finibus augue, vel auctor mauris auctor in.
Nulla suscipit pharetra lorem, eleifend tempus elit porttitor id.
Maecenas pretium dolor purus, ac vestibulum tortor faucibus luctus.

Heading Three

Aenean quis lorem mollis, lobortis lectus condimentum, ultricies neque. Nunc id ex nec purus bibendum viverra eu in risus.

Image Embedding

Bobby McFerrin

Billy Novick playing clarinet

Bill Staines leads the Mystic Chorale in a performance of River