How To

• Style Guide
• Content Styles
• Pageblock Examples

The “how-to” page where you will find all sorts of helpful things about your new website.

Table of Contents

• Pages
  • Content Editor (WYSIWYG)
    • Font Styles Selection
    • Block Quotes
    • Links
    • Inline Images
    • SEO Settings
    • Page Attributes
    • Home page
• Adding a Sidebar Widget
• Page Attributes
• Menus
• Page Blocks
  • Page Block Content Options
• Media Library
• FAQ
• Resources
• Team Bios
• Services
• Certificates
• Events
• Posts/News
• Options (social links, events page, footer logos) 
• Forms

Pages

1. In left menu, click ‘Pages’ (This will allow you to view all Pages that are currently built)
2. If you want to build a new page, select ‘Add New’
3. Once selected, you will be requested to ‘Enter title here’ for the page. URL will be auto-generated based upon what is entered into the “Enter Title” field. To change, click the Edit button that appears under field. (Permalink: This is also where you access your URL for draft pages.)
   1. The H1 for the page defaults to the page title, but to overwrite the H1 text enter the desired text in the title field under ‘additional page content’
   2. Add your header image by selecting an image from your media library using the header image field under ‘additional page content’
4. Enter content into wysiwyg (instructions below)
5. Join page blocks to the page (if desired) by clicking name in the left window of Page Blocks box. Anything on the right will appear on the front end. Click and drag to reorder. Click (-) to remove from page. (See Page Blocks section for details on how to build Page Blocks. These need to be built before joining to a page.) 
6. Enter SEO information in the Yoast settings at the bottom of the page. (You will need to add a Meta Title/Meta Description)
7. On each page you will see a ‘Demo Block Toggle’ option. It defaults to yes. Uncheck if you do not want this page block displaying on the page (the content for the demo block is managed in ‘Options’ – directions below)

Content Editor (WYSIWYG)

1. Type content directly into the wysiwyg in HTML Fields Tab or copy/paste from word processor with ease
2. When copying/pasting, ALWAYS use the clear formatting button (small eraser icon) and/or paste as plain text (T on clipboard icon).
3. Use special characters button for all special characters. If not, the coding may be different

Font Styles Selection

1. Different font styles, including headers, are chosen from the Format drop-down menu and are labeled (Header 1, Header 2, etc.) Please see the Content Styles page for reference to your site’s font styles
2. Highlight the text and then select the desired font style

Block Quotes In Content Editor

1. Highlight text to be put into block quotes
2. Select block quote button (“) next to the Italics.

Links

1. Highlight the word/s which you want to create as a link and clicking on the insert/edit link icon.
2. Enter the destination URL directly into the field or performing search.
   1. For internal links, insert page url only after your domain name. IE: www.website.com/about would be: ( /about).
   2. For external links, insert the entire url (http://www.website.com) and click Open in a New Window/Tab box.
      1. For telephone “click to call” functionality add tel:phonenumber, and for email insert: mailto:email@email.com
3. To add a button, highlight the link, and in the format menu, formats: select CTA Button
4. To break a link, highlight linked text and click Remove Link button (broken chain)
5. Click Update
6. To add a button to your link like this, highlight your link and go to the format dropdown at the top of the content editor>formats>button.

Inline Images

1. To add an in-line image, place your cursor on the area where the image should appear, and click Add Media button above wysiwyg
2. Click on the little chart symbol to open the media library
   1. Scroll to find an image or search using field in top right corner, select it, then click Insert Into Page button
   2. Upload and find the image on your computer (EDIT ALL IMAGES IN IMAGE EDITING SOFTWARE BEFORE UPLOADING TO FILEBIN PLEASE) and upload. Then select the image and click insert.
3. Once the image is in place, click on image to reveal edit toolbar. Choose an alignment and add vertical/horizontal space if necessary.
4. Click Update

SEO Settings

1. Search Engine Listing Tab (Yoast settings at the bottom of the page editor)
   1. Enter Title tags (max. 70 characters)
   2. Enter Meta Description (max. 140 characters)
2. Social Networks Listing Tab
   1. (This is the pre-determined information that you want to include if someone were to Share your page or story. Mostly used in blog posts, or articles.)
      1. Enter Title
      2. Enter Description
      3. Upload Image

Home Page

1. The standard content editor that appears just below the page title will overlay on the hero image
2. In the ‘additional page content’ area select a hero image and enter the title text into the content editor that you wish to appear over the image in the home hero area. Add your hero image.
3. Under ‘Additional content – home’ add the image, CTA, and link in the given fields.
   1. Set link type to internal or external.
4. Add content under the image columns in the ‘featured content text area’
5. Enter your SEO info in the Yoast plugin.
6. Join page blocks if desired

Page Attributes

Underneath the publishing tools at the top right is Page Attributes. This is where you can assign a page to a parent page.

1. If you assign a page to a parent page it will change the url structure of the page.
   1. If ‘new page’ is assigned to ‘old page’, its url will change to old-page/new-page
2. Ordering pages in the menus is managed in Menus. (directions below)

Menus

1. To add pages to your menus and to structure sub pages, navigate to Appearance> menus in the left wordpress menu.
2. Select the menu you wish to edit via the dropdown at the top of the page
   1. CTA Menu 1 is the ‘find accredited organizations’ button
   2. CTA Menu 2 is the ‘get accredited’ button
   3. About IAS and Quick links are the menus in the footer
   4. Team Menu shows up on the Board page as a sub menu
3. Find the page you wish to add to your menu from the selection area on the left. Select all applicable pages and add to menu.
4. Once in the menu, drag and drop the pages to reorder or set as sub pages.
   1. To set as a subpage, drag the page so it appears indented underneath the primary page.
5. The menu label defaults to the name of the page but this can be overwritten. Click the arrow that appears all the way to the right of the page label and enter your title in the ‘navigation label’ field. You can delete menu items in this section as well.
6. To add a custom link to your menu (external link or pdf), select custom link from the left options area, enter the link and label, and add to menu.

Adding a Sidebar Widget

1. In Appearance> Widget Areas create and label a new widget area and assign it to the relevant page(s) with the check box fields below. This will create a right sidebar widget area on the desired pages like the example content styles page.
   1. To create a widget area for a product, select the second tab ‘products’ under ‘conditions’. Here you can select a product entry (or entries) to assign your widget area to.
2. Once this is created navigate to the left WP menu and choose OMS Widgets.
3. Create the new content for that specific sidebar. You have options for open content, image, video, or map. Choose the correct type, and complete the entry.
4. Navigate back to the left menu, Appearance > Widgets.
5. Select the widget area you created from the list on the right.
6. Click and drag the ‘OMS persistent widget’ from the options on the left into the corresponding widget area on the left.
7. Choose the entry you completed in OMS Widgets via the drop down menu.
8. If you are adding more than one sidebar element such as text, an image, etc., you only need to create one sidebar area.
9. Drag/drop the OMS Persistent widget into the sidebar multiple times until all of your items have been added. Continue to select the different widget sections from the drop down menu. If you want to reorder them, just drag and drop!

Page Blocks

Page Blocks are created separately from pages, and then joined to the desired page(s). They do not appear on your site unless they are assigned to a page.

1. In left menu, click Page Blocks (This will allow you to view all Page Blocks that are currently built in your CMS)
   1. If you want to build a new Page Block, Select Add New. You can also edit an existing page block.
2. To build a new page block: Enter Title
   1. Please note that the title is not associated with SEO in page blocks, so you will want to name it intuitively (so that you know how to grab it later when joining to a page).
3. Hidden: Select No (recommended) from the drop-down menu
   1. If hidden is set to yes, the page block will not appear on the pages it is assigned to.
4. Header: This field is optional, but any text in here will center above the content area(s)
5. Hide on Mobile option allows you to hide page blocks on mobile devices to increase speed if desired.
6. Layout: Select from the available list based on the type of block being created (full-width, two column, three column) Details below. Refer to available designs on page block styles.

Page Block Content Options

1. Select your layout from the dropdown menu (full-width, two column, three column)
2. With each column in the page block, you will need to select the type of content from the drop down menu next to ‘Column X Type’ (image, text, video, gallery)
   1.  After selecting the content type, enter your text or image in the given fields that appear.
      1. To create a Call to Action button, highlight the desired text, link it, and in the format drop down menu select ‘button’.
      2. Set the background image for the page block using the ‘background image’ button
   2. Video page blocks require an image preview. Enter the url of your video and add the image from your media library.
   3. Reference the style guide for the correct image sizing info
   4. To Create a testimonial, select ‘testimonial’ as the full width page block type.
      1. Create the testimonial separately in the wordpress menu option ‘testimonials’. Name the testimonial and enter your content in the editor.
3. Scroll back up and “Publish” your Page Block. Your new Page Block has been created, however, until it is joined to a page, it will not be visible.
4. To join your page block to a page, go to the page you would like to add it to and select the name of the page block(s) in the Page Block section. For information on building a page, see the Page section above.
5. The order of the page block, once selected, will dictate how they will appear on the page. Blocks can be re-ordered as needed and once complete select the Red Update button to save your changes and Publish.

Resources

1. Name your resource and add your content in the wysiwyg editor.
2. Under ‘resource type’ specify if the resource is a download or a link
   1. If it’s a download, select the PDF file from your media library. If it’s a link provide the link.
3. Enter your sidebar title and content in the fields below
4. Tag the resource to a category(s) using the selection to the right
5. Resources are added to the Documents page

Team Bios

1. In left menu, click Team Bio (This will allow you to view all Team Bio pages that are currently built)
2. If you want to build a new bio, Select Add New you may choose to edit an existing file
3. Enter their name as the title of the team bio entry.
4. Enter Position and add bio image
5. Enter bio content in wysiwyg editor
6. Enter SEO data
7. Add social media links and contact info if desired
8. Under ‘additional page content’ add the header image for their bio page
9. Click red Update button to save your changes and Publish
10. Join the bios to the team page using the ‘team bio join’ at the bottom of the page editor (just like you would with page blocks.
    1. **Make sure this page is set to ‘team landing’ under Page Attributes>template
    2. Reorder the bios on the team bio page by dragging and dropping
11. Edit the content on the top of the team landing page within pages

Services

1. Name your service
2. Enter your content into the editor just like you would with a page
3. Enter your SEO info into the yoast plugin
4. Join pages blocks if desired (these only show up on the overview tab)
5. Tag the corresponding criteria from the options in the right column. Add new criteria using the ‘add new criteria’ button
6. Under ‘Additional page content -services’
   1. Overwrite the h1 if desired using the title field
   2. set your header image
   3. add sub text to overlay on the image in ‘header content’
   4. use the red ‘add button’ button to add a linked button on top of the header image
7. Under ‘important documents’ join all the corresponding documents. These appear under the ‘documents’ tab

Certificates

1. Name the certificate and attach the certificate pdf file from your media library
2. Complete the fields below (name, organization…) These act as sorting filters on the ‘find an accredited organization’ forms.
3. Select the criteria associated with the certificate from the checkbox selections in the right column.

Events

1. Events are auto added to your events page (the content at the top of the events page is edited in ‘Options’)
2. Name the event and enter your content in the editor
3. Add time/Date, location (this generates the map in the sidebar) and price/website if desired.
4. Enter your SEO info
5. Assign the event to a category using the sidebar selector. This enables the user to filter the events on the events landing page.

Posts/News

1. In left menu, click Posts. This is where you manage the content in the blog and news section of your site.
2. Select Add New
3. Enter Title
   1. URL will be auto-generated based upon Title. To change, click the Edit button that appears under field
4. Enter post copy in wysiwyg
   1. If copy contains links to outside sites, be sure to create link as Open in new tab.
5. SEO Settings
   1. Search Engine Listing Tab
      1. Enter Title tags (max. 70 characters)
      2. Enter Meta Description (max. 140 characters)
      3. **If fields are left blank, search engines will use Blog post title for Meta tags and first 140 characters of post for Meta Description
   2. Social Networks listing Tab
      1. Enter Title:
      2. Enter Description
      3. Upload Image
6. Check categories box from list
   1. Anything assigned to the ‘News’ category will appear in the news section, everything else will appear in the blog.
   2. Add New Category by clicking +Add New Category link at the bottom of Categories panel and entering category name
   3. Save by clicking Add New Category button
7. Optional – Set featured image from Media Library
8. When complete, go to Publish panel
   1. you may choose to Save Draft
   2. Click Edit link under Save Draft button to set post as Pending Review
   3. Visibility: default is Public. To change, click Edit link
   4. click OK button to save changes
   5. Publish Immediately: can be changed by clicking Edit link
   6. Enter publish date, click OK button
   7. Preview Draft, or click blue Publish button
9. Ignore the additional page content fields

Media Library

1. Click Media, Library, Add New
2. Drop files into window or click Select Files button
3. To Edit Images or other Media you may view as a list or Media Grid View
4. Inside the Media Grid, media items are displayed in a thumbnail grid for ease of navigation. Click any media item to edit the image directly; however, we recommend that you use photo editing software like Photoshop before uploading images to Media Library. In this view, you may also edit the image metadata or media item metadata.
5. Media library can be filtered by type or date and is searchable by title

FAQs

Similar to Pageblocks, FAQs are created separately and then joined to pages.

1. Select FAQs from the left wordpress menu
2. Add a new FAQ and name it so you can find it when adding it to the page. (this name is fro admin purposes only)
3. Enter your question and answer into the given fields at the bottom.
4. Join your FAQ to the page by using the join tool at the bottom of the desired page.

Options

1. The Options section is where you can edit the social media links in the footer
   1. Add a social media icon by clicking ‘add row’ and selecting your icon and providing the link to the account. This edits the links/icons that appear at the very bottom of your site.
2. Edit the text under ‘Event landing page’ to edit the text that appears on the top of this page
3. Add the logos that appear in the footer
   1. select the image using the ‘add image button’
   2. Use the red ‘add row’ button to add more logos

Forms

1. To create a new Form, select “Add Forms” in the left navigation or “Add New” on the Forms page.
2. On the left side of the screen are all of the form fields that are available to you. Simply click on a form field to have it appear on the right side of the screen. Clicking on the area will open up the field, allowing you to customize the “Label” and set “Restriction Settings” (Required field)
3. Be sure to Name and Save your form.
4. Next select the “Email & Actions” tab
   1. Edit redirect, email admin and email user settings for each form. Click “View all types” to see your available options.
   2. Redirect – redirects to thank you page (You must build a Thank You page in the Pages section, and then add the URL to this action. We recommend this for tracking goals in Analytics.)
   3. Email admin –You can customize the way each submission hits your inbox: from name, address, to email (very important), subject, and fields.
5. Salesforce Integration – If you would like your form fields to automatically be sent to Salesforce, you will need to set that in two places: The Settings Tab and on the form itself. (Each field needs to be mapped to a field in Salesforce)
   1. Under Settings, you need to check the box for “Send this form to Salesforce?”
   2. Then, on the form itself, you will need to map each field from your form to the field that you want it to be in Salesforce. This is done on the “Advanced Settings” tab on each element (ie First Name) – Select the field from the “Salesforce CRM Field Map” dropdown.
   3. 
6. Once the form is complete, publish your form. Then copy the short code for your form and paste into your wysiwyg on the page that you want to add it to. (ie: Contact, Application, etc.)