Skip to content

To access WordPress, login (using the credentials that were emailed to you) at:

These short videos will show you the basics of using WordPress.

Keep in mind that the content in posts, pages, events, and other content areas such as the footer, can all be edited in a similar fashion, using content blocks as shown in the videos.

Creating a New Page

Adding Media

Managing the Banner Area

Explaining Content Blocks

Adding a New User

Creating an Event Post

Creating an Update Post

Managing Menus

Creating Forms


For further questions using WordPress, email Nicole Moore.

How to prevent grid images from distorting when linked to other content

In text editor, find:

<a href=””><img class=” size-full wp-image-1088 aligncenter” src=”” alt=”children-ALL ARE WELCOM” width=”420″ height=”180″ /></a>

I bolded the width and height attributes that are automatically created by WordPress. If you simply delete these parameters, the image distortion problem should go away. So the code should instead look like this:

<a href=””><img class=” size-full wp-image-1088 aligncenter” src=”” alt=”children-ALL ARE WELCOM” /></a>

How to create a styled button

Here is all the text (html) for the buttons. Remember to switch to “text” mode in the editor when inputting these. After you input these codes, switch back to “visual” to finish the rest. The button will only look like a link the editor, but when you publish, it will look like a button.

Default (grey) <a class=”btn btn-default” href=”#” >Link Text</a>
Primary (gold) <a class=”btn btn-primary” href=”#” >Link Text</a>
Primary Inverse (white on gold) <a class=”btn btn-primary-inverse” href=”#” >Link Text</a>
Hollow (white outline) <a class=”btn btn-hollow” href=”#” >Link Text</a>
PS: insert the full URL where there is a “#” in the above button text.
You need to add a button class to the link. Compare the following links, yours first and then Ben’s:

<p style=”text-align: center;”><a href=””>Email Kate</a></p>
<p style=”text-align: center;”><a class=”btn btn-primary” href=””>Email Sarah</a></p>

As you can see in bold, a button class is applied to the second link. You can add this class to achieve the same style.

How to create a full separation line between content

If you click the Section Background tab, you will see that you can check a box to override the default styles. Once this is clicked, you can add a border “below”. The rest of the border styles should default correctly to “solid”, “1px”, and with a color of “#eeeeee”.


Front Page Hero Banner – 1920 x 450


Exporting Data from a Form

> Sign in with WordPress username and password
> Go to Forms (on the lefthand column)
> Go to Import/Export option beneath Forms
> Select the form you’d like to export
> Select fields for the data you wish to export (you can also select a date range)
> Click “Download Export File” button at bottom

An excel document will automatically download.