Owner’s Manual

Table of Contents

Last Updated: January 16th, 2019

Let’s take a step-by-step tour through your WordPress site and see how the different functions work and how to make your new site your own. During the first part of this tutorial, please don’t change anything within the program unless it is part of the tutorial. After following these steps, you’ll soon be changing everything.

Accessing Your Website

Follow the steps below to access the dashboard of your WordPress website and begin managing your website.

Log Into Your Website

Begin by logging into the “administration area” or the back end of your website. Visit your site’s login page by placing “wp-admin” after your domain name (e.g. https://talentrewire.org/wp-admin).

If for whatever reason you do not remember your username and password, you can recover this information by clicking Lost your password? in the login prompt screen.

Two-Factor Authentication

Two-factor authentication adds another layer of security to your site that requires not only a password and username when logging in but also a passcode that you can only generate on your smartphone. Using a username and password together with a piece of information that only you can access makes it harder for potential hackers to gain access to your website.

For more information on two-factor authentication, check out the entry in the WordPress Codex.

Enabling Two-Factor Authentication

Navigate to your profile page to enable two-factor authentication, as well as sync their account with the Google Authenticator app. Scroll to the bottom and click Enable.

You’ll then see this screen:

Follow the steps by downloading Google Authenticator for your phone, scanning the barcode, and entering the six digit passcode that the Authenticator app generates.

Click Verify and you’re all done!

Using Two-Factor Authentication

Next time you log into your website after you enter your username and password, you’ll be asked to enter a passcode. Just fire up the Google Authenticator app on your phone and enter the passcode.

Media Library Basics

The Media Library is where you can manage your images, audio, videos, and documents all in one place.

Uploading + Link to Media

If you would like to upload a graphic, such as adding a picture to your post, then you must first upload the content to the Media Library.

  1. Go to the Media section in the left sidebar.
  2. Upload your image to the Media Library by clicking on Add New, by choosing Select Files, or by dragging and dropping an image into the browser window.
  3. Once the file uploads completely to the list below, open a new window.
  4. We recommend including “alt text” with an image uploaded to the site (include a description of the content in the image)
  5. Copy the URL listed on the right side.
  6. Copy and paste that URL into the appropriate page, wherever you may need to use it.

Editing Images

This section will describe how to use WordPress’ image editor to update the size of images uploaded to your Media Library. 

NOTE: If an image is saved in the media library and already in use, do not update this image. It will also update it in other sections of the site. Add a duplicate and resize from there.

  1. Go to the Media section in the left sidebar.
  2. Upload your image to the Media Library by clicking on Add New, by choosing Select Files, or by dragging and dropping an image into the browser window.
  3. Once the image has uploaded, it will appear in the list of media. Click on the image you wish to edit.
  4. Below the image, click on the Edit Image.
  5. Use the buttons above the image on the left side to rotate or flip the image.
  6. If you wish to crop, drag your cursor over the image, to the proportions you would like, then click the crop button in the top left. NOTE: if you do not like the change you have made, click the back or forward arrows on the right.
  7. If you would like to change the size of the image, update the dimensions in the right column under Scale ImageNOTE: this will automatically scale your image proportionally and you cannot scale images up, only down.

Featured Image Basics

A featured image is the representative image for posts, pages, or custom post types.

  1. In the right sidebar you also need to set your featured image
    • “Featured Image” is the image displayed for the blog post on the topics page
      1. Click “Set featured image” to add the image. We recommend including “alt text” with any image uploaded to the site
      2. When uploading an unformatted image as the featured image, WordPress will pan into the image and size it according to what they believe is the most important section of an image. Note: we suggest sizing each featured image to the optimal dimensions: height - 630px fixed + width - 1200px. This will also pull through on search engines and social media link shares

Managing Content

Blog Posts

Posts allows you to manage and edit your posts usually this is where your blog posts are. These are used similar to how you create/edit pages.

  1. Click "Posts" in the left sidebar and then “Add New”
  2. Add a title
  3. If the "Classic editor" is enabled
    • Fill out your content using the WYSIWYG (What You See Is What You Get) editor. This is a text editing dashboard built into WordPress. For more on the functionality of each of these icons, check out this in depth breakdown of the WordPress WYSIWYG.
  4. If the "Swift Page Builder" is enabled

Team Members

Team Members allows you to add blog author contributors and customize their profile

  1. Go to the “Team Members” category on the sidebar and click “Add New”
  2. Add the team member’s name in the heading
  3. Add all of the body content (bio) into the text editor if you want
  4. In the “Team Categories” Section check off the appropriate team category
  5. In the “Team Members Details” Section add several factors:
    • Company Position
    • Email Address
    • Phone Number
    • Any social media accounts like Twitter or LinkedIn
  6. Set the “Featured Image” to display the contributor’s profile picture. Note: The dimensions for the headshots should be 600px x 600px
  7. Click “Update” or “Publish” to save in top right column


Resources allow you to add and manage resources

  1. Click or hover over “Resources” in the left sidebar and click “Add New”.
  2. Enter the Resource title
  3. Use the Swift Page Builder elements to make your page
  4. Add the appropriate tags
  5. Add your featured image
  6. Add your author in the “author section” by typing in the user name or guest name. Note: If you need to add the author learn more here
  7. In the “Resource Meta” add the appropriate attachments in a PDF format for the “Resource File” and add the name of the “Button Text”

Innovation Stories

Innovation Stories allow you to add and manage your company case studies

  1. Go to “Innovation Stories” in the left sidebar and click “Add New”.
  2. Under “Title”, enter the Company Name.
  3. Use Swift Page Builder to add the Innovation Story content. Click on the “Swift Page Builder” button. Click on “Saved Items” and then “Page Templates”. Select the “Innovation Story Template” to populate the pre-made page builder elements. Replace the appropriate text and images for the company.
  4. To display Testimonials for a particular company, edit the Testimonial Carousel and under Testimonial category, select the company name.
  5. In the right sidebar, add all of the “Categories, Industry and Tags.” Select if this company should be featured on the Employer Community page. The featured employers will appear in a three-card feed at the top of the Employer Community page. Up to three employers can be displayed at one time. And add a “Featured Image.” This is the image that will appear in the content feed on the Employer Community page.
  6. Add an “Excerpt” for the “Innovation Story”. This is the text that will display under the company logo in the feed on the Employer Community page. If no text is entered in the “Excerpt” field, Wordpress will automatically generate a summary using the first 20 words of the “Innovation Story”.

Additional Testimonial Information

Additional information to be added to testimonials

  1. Under “Title”, add the name of the person.
  2. Under “Testimonial Information”, add the person's title/position, company and headshot (if applicable).
  3. In the right sidebar, add a “Testimonial Category”, this will determine what page the testimonial(s) will appear on.

Update Page Header Images

Page header images are located on the Employer Community and Annual Event pages.

  1. Go to “Pages” in the left sidebar and click “All Pages”.
  2. Navigate to the page that needs to be updated and click on “Edit”.
  3. The Header Image is located under “Heading Options” in the “Background Image” section.
  4. If there is not a Header Image, click on the “Add Image” button to select an image from the Media Library.
  5. If there is already a Header Image uploaded, hover over the image thumbnail. Two buttons will appear, an “Edit” (pencil) icon and a “Remove” (close (x)) icon. Click the “Remove” icon to remove the image and bring up the “Add Image” button, where you can select an image from the Media Library. Clicking the “Edit” icon will allow you to change image details such as the alt text.
  6. The image should be 1200px wide and 800px high.

Re-ordering Content

Use the instructions below to re-order posts and team members in feeds.

  1. To re-order “Team Members” or “Resources”, go to “Team Members” or “Resources” in the left sidebar and click on “Re-order”.
  2. Drag and drop the team members or resources into the desired order.


You will be able to add tags + categories for each of the content types that are applicable to your site (exp. News, Team Members, Events, etc.)

  1. In the right sidebar, there are 5 ways to tag content:
    • “Categories” are connected to the front-end categories and are used in feed logic
      • Check off the categories the post fits or add a new category if necessary
    • “Tags” are to be used for meta content that will not appear on the front-end but will assist the onsite search
      • Type in your own tags or click the most used tags to add them to the post

Content Previews

If you want to edit the preview text that will be pulled into the auto-feeds on the front end use the excerpt field. This functionality can be in the post types of News, Team Members, Events, Resources + Events, etc.

  1. Edit the post you want
  2. Scroll down to the bottom to find the “Excerpt” field
      • If the excerpt is hidden scroll up and click the "Screen Options" tab and check the box labeled "Excerpt" and the Excerpt field will appear

  3. Add your custom preview text here
  4. Save + Publish your work

Footer Content

  1. In the dashboard go to Appearance -> Widgets
  2. Under “Footer Logos" you will find the FSG and Shared Value Initiative logos and text. To change the image, upload the image to the Media Library. Click on the Image in the Media Library and copy the image URL  from the Attachment Details screen. Replace the URL in the “Footer Logos" widget. Paste the URL inside of the img HTML tag for the correct logo.
  3. Under “Footer Content" you can edit the email, contact link and social media.
  4. Under “Footer Newsletter" you can edit the elements for the newsletter signup

Swift Page Builder

Accordions and Toggles

Toggles are very similar to Accordions. They only use one drop-down versus an accordion which allows you to have several drop-downs.

  1. To add an Accordion, click “+ Elements” then “Accordion” or “Toggle”.

  2. Change the name of a section by clicking on the pencil button on the first box. To add the content contained within the first accordion drop-down, click the pencil button on the second box.
  3. The pencil button will lead you to “Edit Text Block”. Use the WYSIWYG editor in the “Text” section to update any language or styles contained within the expanded section.
  4. Click the “+” button to add additional expand-collapse pieces


Blank Spacers

Blank Spacers allow you to add space in between elements horizontally. You can customize the space size (px) by screen resolution as well

  1. To add a Blank Spacer, click “+ Elements” then “Blank Spacer”.
  2. If needed, click the pencil button to edit the spacer.
  3. You customize the space height based on what device or browser size the user is on


Button allows you to add different based on size, color and other customize features.

  1. To add a Button, click “+ Elements” then “Button”.
  2. Click the pencil button to edit.
  3. There are several options you can choose from to customize your button element:
    • To change the text that appears in the button, fill out the “Button Text” field.
    • There are two style options: “Small” and “Large” - choose this from the drop-down menu
    • You can also add a link location and chose where the link opens (same or new window).
      • If you would like the button to link to a PDF, image, etc., follow the instructions for adding the item to the Media Library  first and then add the link here.

Code Snippets

Code snippet lets you to add HTML or CSS code to the page without WordPress changing the format. 

  1. Click “+ Elements” and “Code Snippet” to create a line above, in between, or below each element.
  2. Click the pencil button to edit
  3. Add your code in the text block + select the language for that code block (options: HTML, CSS, JS, PHP)


The divider element can be used as a visual separator of content

  1. Click “+ Elements” and “Divider” to create a line above, in between, or below each element.
  2. Click the pencil button to edit.
  3. Choose the top and bottom margins (we recommend 0px above and 30px below) + if you want the divider to expand the full width or not 


Image Blocks

The image element does exactly what it sounds like - allows you to add images

  1. To add an “Image”, click “+ Elements” and “Image”.
  2. Click the pencil button to edit.
  3. Add a “Widget Title” if you would like text to appear above the image.
  4. Click “Add Image” and upload files or select a photo from your media library.
    • NOTE: Images can also be added directly in the “Text Box” through the WYSIWYG editor by clicking “Add Media”. This will enable you to wrap text around the images.
  5. If you would like the image to link out, then add the URL to the “Add link to image” field.
  6. If you would like to add an image caption, scroll down to the “Image Caption” field and then choose how you would like it to display: hover or below.

Raw HTML and JavaScript

Raw HTML & JS allows you to add code straight into the page through this Page Builder element

  1. Click “+ Elements” and “Raw HTML" for HTML or "RAW JS" for Javascript.
  2. Click the pencil button to edit.
  3. Add your code in the text box.

Team Feeds

The Team element is a feed for the team content type. You can filter the feed through categories if you wish.

  1. Click “+ Elements” and “Team”.
  2. Click the pen button to edit.
  3. You can change display options such as columns, number of items to display, if you want to link to the team member's individual page (if applicable), etc.
  4. Filter the team feed if you want using "team category" by typing in and selecting the categories you wish to display

Team Member Tiles

The Team Member element allows you to add individual team members to the content. 

  1. Click “+ Elements” and “Team Member”.
  2. Click the pen button to edit.
  3. Make sure that the team member is first added to the Team Member content type (see instructions below)
  4. Choose the correct person from the “Team Member” dropdown menu.
  5. If they will have a bio page, choose “Link to Page” from the dropdown menu. If they do not need a bio page, select “No” from the dropdown menu.
  6. Click “Save” then drag and drop the team member into the appropriate order.



The Text Block element allows you to display plain text or HTML markups on the page

  1. To add Text Block, click “+ Elements” and Text Block.
  2. To edit, click the pencil button.
  3. Add a title to appear above the text block and then add the full body text using the WYSIWYG editor.
  4. If you would like to add an image directly into the text block, click “Add Media”. Then choose an image from the Media Library or click “Upload Files” to choose from your server or desktop.


Video Players

The Video Player allows you to place videos into your content

  1. Click “+ Elements” then “Video Player”.
  2. Click the pencil button to edit.
  3. Add your "video link" for the video to pull through on the front end

Widget Areas

The Widget Area element lets you add any widget element anywhere on the page. Widgets can be found under Appearance -> Widgets. Often this is where your footer content and sidebars are if you have them.

  1. Click “+ Elements” then “Widget Area”.
  2. Click the pen button to edit.
  3. In the dropdown select the sidebar you wish to use

Other Admin Functionality

Navigation Menus

Note: in order for an item to be included in the menu, it needs to be a published page.

  1. Hover over “Appearance” and click on “Menus”.
  2. In the right column, there is a list of the current menu structure.
    1. If you would like to alter the current order of items listed, drag and then drop in the correct location. Note: Items that are tabbed in below other menus are submenus and will appear upon hover in the main menu.
  3. The left sidebar has a list of all the pages currently added on the site.
    1. Check the page you would like to add to the menu then click “Add to Menu”. Note: It will automatically be added to the bottom of the right sidebar list as a main menu item. Drag and drop to change the position in the menu or create as a subpage.
  4. Click the drop-down arrow next to the name of the page to change how it will appear in the menu.
  5. In this expanded view, you can also remove a menu item by clicking “Remove”.
  6. Always have “Main Menu” and “Mobile Menu” checked in the “Menu Settings” section.
  7. You must click “Save Menu” for these changes to pull through on the live site.

Advanced Forms with Gravity Forms

Create and Manage your Gravity Forms

  1. Go to “Forms” in the left sidebar
  2. Click “Add New” on top left corner
  3. Enter your “Form Title” (description is optional)
  4. Follow the directions with this tutorial here
    1. Select the fields you would like to appear in your form using the options to the left, customizing as necessary.
    2. Follow the tutorial that pops up or https://www.youtube.com/watch?v=VNt_QKIC83U + choose what you want to do based on the timing outline below
      1. 2:42 - 7:10 - creating form
      2. 7:10 - 9:56 - basic form settings
      3. 9:56 - 11:00 - creating dropdown field
      4. 13:33 - 14:38 - form confirmation settings
      5. 14:38 - 18:29  - form notification settings
    3. Add a form to a page use the following shortcode. Replace “15” width the ID of the form that can be found next to the title when editing the form.

      Oops! We could not locate your form.

    4. If you want more information about Gravity forms go here: https://docs.gravityforms.com/category/user-guides/getting-started/
  5. After you have edited the Form Settings and added your desired Form Fields, click the Update Form button at the bottom of the form editor to save your new form.

Adding your Gravity Form to your content

  1. If you are using the Classic editor 
    • Click "Add Form" and select the form you wish to form you wish to use
    • You can choose to display the "form title", "form description" by checking or unchecking the boxes
  2. If you are using the Swift Page Builder
    1. Go to “Forms” in the left sidebar
    2. Find the form you wish to use and hover over the title to make the option "preview" appear and click this. Note: this will give you your form id which you need for the code
    3. Select a "Text Block" element toggle to the "text" tab
      • create your gravity form code snippet with these parameters
        • Email Signup (long)

          • This field is for validation purposes and should be left unchanged.
        • This gravity form means:
          •  form id=2
          • title = true which means you want your form title to show
          • description = true which means you want your form description to show
      • paste your gravity form code snippet with these parameters in the "text" tabs like in the example below

301 Redirects with EPS Redirects

Adding a Redirect rule will allow you to set a custom domain URL that will forward visitors to another URL

  1. Hover over the “Settings” category on the sidebar and click “EPS Redirects”
  2. Add the URL (minus “https://thesite’surl..org/”) you want visitors to be forwarded from in the “Redirect From” field
  3. Add the URL you want visitors to be forwarded to in the “Redirect To” field
  4. Click “Save” to save the redirect rule

Managing Tracking Code Pixels

This allows for the collecting of user activity on the site.

Tracking code can be added in the Settings > Tracking Code Manager plugin page

  1. Enter a title for the code. Note: for clarity, this should reference the name of the service and/or its location. “Google Analytics Head” or “Facebook Body”
  2. Paste the appropriate code in the text field body
  3. In the “Position inside the code” dropdown, select the location where the code should run. Note: this should be described in the company’s instructions for their tracking code use. If not, select the first option, “Before </HEAD>”
  4. If needed to display only on certain device types, use the filters in the “Show only on device” field
  5. Click the save button

More specific information based on the tracking code provider can be found at the following:
Facebook Pixel: https://www.facebook.com/business/help/952192354843755
Google Analytics: https://support.google.com/analytics/answer/1008080?hl=en
Google Tag Manager: https://developers.google.com/tag-manager/quickstart

SEO with Yoast

SEO is an extremely important aspect of your site and something to consider whenever you update or add any new site content. We’ve installed a tool called “Yoast SEO” which will help guide you towards matching your site content with important keywords.

Using Yoast SEO

Content (Tab that looks like a traffic light)

  1. The Snippet Editor previews what your page looks like in a Google search result. Click “Edit Snippet” to update the SEO title, slug (also known as the URL), and the meta description.
  2. Focus keyword: chose the main keyword or phrase that matches the content on the page.
  3. Meta keywords: additional keywords that pertain to the page content
  4. Content analysis: Based on your focus keyword, the content analysis will analyze the page content based on a benchmark of checks to ensure the focus keyword makes sense. This includes appearance in the URL, meta description, title length, etc.

Social  (Tab that looks like sideways “v”)

This section enables you to personalize the social media title, description and image representation for Facebook and Twitter should you choose. For images, be sure to pay attention to the recommended sizes listed in the descriptions.

On-page Optimization

Title Tag

  • Avoid duplicate title tags
  • Keep title tags at 55 characters or less in length, including spaces.
  • Your title tag should be written like this: Primary Keyword – Secondary Keyword | Brand Name
  • Use a dash in between your keyword phrases and a pipe at the end before your brand name

Meta Description

  • Write compelling meta descriptions (for CTR)
  • 150 to 160 characters is the recommended length
  • Avoid duplicate meta descriptions
  • Do not use quotes or any non-alpha characters
  • Use Target keywords in description

H1, H2, H3

  • Use H1 Tag for Page title
  • Use your keyword phrase once in your H1 tag
  • Use H2, H3 tags for subheadings if there are multiple sections

Anchor Text

  • When linking to another page on the same site from within content, select good anchor text (keywords) to use in the actual link and do this often. For example: “We offer *target keywords* services,” rather than “Click here.”

Image ALT tags and filenames

  • Include your keyword phrase in the name of your image. Name all of your images in a way that describes what they are.
  • Do not use non-alpha characters in your image or file names (no %, &, $, etc)

Managing WordPress Users

  1. Go to “Users” in the left sidebar and click on “Add New”.
  2. In the “Add New User” section, create a username, enter their email and assign them a role.
    1. Learn more about the different roles in WordPress.
  3. Do not click “Skip Confirmation Email”.
  4. Click “Add New User”.