Style Guide

Heading

To produce the heading, you type a paragraph <p> tag with a class=”head.” Here’s an example.

<p class="head">Heading</p>

Sub-heading

To create a sub-heading, you use a paragraph <p> tag with a class of “subhead.” Here’s an example.

<p class="subhead">Sub-Heading</p>

Italicized text for emphasis.

<p><em>Italicized text for emphasis</em></p>

Images with captions

photo
We put images inside a pair of paragraph </p> tags with a class of “caption” when we want to display text beneath them.

<p class="caption"><img src="https://ww1ha.org/wp-content/uploads/2014/06/smboelke.jpg" alt="description"></img></p>

Ordered Lists

  1. item first
  2. item second
  3. item third

<ol>
<li>item first</li>
<li>item second</li>
<li>item third</li>
</ol>

Unordered (bulleted) Lists

  • item first
  • item second
  • item third

<ul>
<li>item first</li>
<li>item second</li>
<li>item third</li>
</ul>

Shortcodes – making columns

[two_third last=”no”]

Here’s the left column. I have set it to take up two thirds of the page. This division of the page into an initial two-third column and a second sidebar type column taking up one third of the page is typical of the site.
[/two_third]

[one_third last=”yes”]

And this second column is set to take up the remaining one-third of the page. Notice that in WordPress, we set up new pages as ‘full-page width’ and then use these shortcodes to make our own columns in the editor.
[/one_third]

Shortcodes – Events Listings

To create a list of events on the Activities page, we use a shortcode to create a list of events grouped by month.

[events_list_grouped mode=”monthly” scope=”future”]
#_CATEGORYNAME #_EVENTLINK – #_EVENTDATES at #_EVENTTIMES. Location: #_LOCATIONNAME

[/events_list_grouped]

Shortcodes – Events for a Particular Chapter

To create a list of events for a particular Chapter, you assign the event an Event Category and then use a shortcode to show all events in a particular category. Here is the list of events for the SF Bay Chapter.

[events_list scope=”future” category=”90″]
#_EVENTLINK – #_EVENTDATES at #_EVENTTIMES. Location: #_LOCATIONNAME
#_EVENTNOTES

[/events_list]

Comments are closed.