This section is a valuable resource for managing your new website. Below, you’ll find several topics to explore at your own pace, which will help you gain a better understanding of how to utilize your website.
This document is intended to navigate you through the different features on your website, and how to edit or create each of them.
For ease of use, all sections (layouts) currently built on the site, and shown on the Page Blocks Library page, have been saved into the templates.
When editing or creating new pages, if your page or section is not looking as it should, go to the layout examples and reference the styles and formatting that we’ve used on the comparable widget.
To create a new page, go to: Pages > Add New
To edit an existing page, go to: Pages > find the page you’d like to edit > Edit
Enter a title in the field that says “Add Title.” This will be the administration title for your page. It will also be used as the H1 for your hero page block unless the content is overwritten in the hero page block.
Edit the permalink field under the title field to change the URL for the page. The Parent Page can be assigned under “Page Attributes” in the right hand sidebar.
If you assign a page to a parent page it will change the URL structure of the page.
EXAMPLE: If “Our Values” is assigned to “Home” its URL will change from looking like this: www.(your site).com/our-values/ To looking like this: www.(your site).com/about/our-values/
NOTE: If your parent page is included in any menu you now want to navigate to Appearance > Menus. See menus below for further instructions.
WATCH: How to Write and Add Title Tags & Meta Descriptions to Pages and Posts in WordPress
Scroll to the bottom of the page to the “Yoast SEO” section. Here you should see options to edit the SEO title and meta description.
NOTE: For consistency, we recommend leaving in the “Separator” and “Site Title” variables in the SEO title field.
There are three ways to hide pages in WordPress — hiding the page from the sitemap, setting a page as a draft, and deleting a page completely.
To enable the Elementor builder: Click on the blue “Edit with Elementor” button
Once your page is set up, and the Elementor builder is on, you can begin adding in page blocks to build out the page. Refer to the Page Block Library for all of your page block options.
Entering content into the content editor:
Once your copy is in the WYSIWYG, you can continue to style the copy as needed. There are a few tools at your disposal to do this. To see all content styles available on your site, check out your Content Styles page.
NOTE: When applying header text to your content, keep accessibility in mind.
WATCH: How to apply accessible header styles
NOTE: WYSIWYG stands for “What You See Is What You Get”
To create a new post, go to: Posts > Add New
or
Go to: (in the WordPress Toolbar) + New > Post
To edit an existing post, go to: Posts > find the post you’d like to edit > Edit
or
Go to: Find the post you’d like to edit on the front end > Edit Post (in the WordPress Toolbar)
NOTE: Avoid changing URLs on existing blog posts unnecessarily to avoid creating broken links throughout the site.
WATCH: How to Write and Add Title Tags & Meta Descriptions to Pages and Posts in WordPress
WATCH: How to Embed a Video in WordPress
WATCH: How to troubleshoot content styles in the WYSIWYG editor and paste as plain text
To edit menus, go to Appearance > Menus
Go to the “Select a menu to edit:” dropdown, and pick the menu you want to edit. This will take you to the menu editor which you can use to organize, nest, and rearrange how you want your pages to display in your menus.
NOTE: The social media menu in the footer is in a different location. See below.
NOTE: If a field you’re expecting to see in WordPress is not visible to you, it might be hidden under Screen Options. Go to “Screen Options” in the upper right corner of your screen, make sure that the field you want to see is selected. Close out of “Screen Options” and the field should now be visible.
To edit the mega menus, go to: Appearance > Menus > filter for Primary Menu
NOTE: The layout of pages that you place in this view is going to be the way these pages/links appear in the menus on mobile devices.
NOTE: If you decide to add a page to a Mega Menu later, you will see it added in a separate bottom row. Drag and drop that page into the desired column and remove the now empty row by hitting the red trash can in the white and gray sections.
The menu items on your site use the following CSS classes to change how they are displayed to the user:
Question: What happens to the pages in a menu if I delete a page?
When a page (or any other post type detail page) is deleted, it will disappear from the menus entirely. The next time you navigate to Appearance > Menus, you will see this page in its original spot in the menus, highlighted in red.
Question: What happens to the pages in a menu if I change a page’s URL?
If you update a page’s URL, it will update automatically within the menus to match the new URL. This happens because WordPress’s menus use page ID to add pages to menus instead of just the URL. If a page has been added as a custom link instead of as a page, the URL will be broken in the menu.
To view the Media Library, go to: Media > Library
If you need to access the media library while entering content, you can click the “Add Media” within a WYSIWYG text editor or click an “Add Image” button within page blocks that have image fields. These buttons will take you to the Media Library dashboard. On the left-hand side, you will see any folders you have created, and in the center you will see any uploaded images.
NOTE: All images should be cropped and compressed before adding to the media library. It is recommended that images be no larger than 250kb (though sometimes this is unavoidable). You will want to crop the image to the appropriate dimension prior to compressing. This site, tinypng.com, can be helpful in compressing file sizes for images.
WATCH: How to Manage Files in the Media Library & Add Image Alt Text
WATCH: How to crop and save an image for web and reduce page load times
When you click on an image or PDF, you’ll see a popup preview of the image and its associated metadata:
NOTE: For more information about alt text, check out our accessibility tips page.
NOTE: Orbit’s recommended best practice for image metadata is to add any relevant alt text and leave all other fields blank, unless otherwise required by the design.
Images used for means other than decoration should have include alt text to describe the image so a screen reader can inform the user of the contents of the image (e.g. Woman using phone at desk). Image alt text should describe the image and should not use special characters.
NOTE: For more information on how to add alt text, read our accessibility tips page.
WATCH: How to Manage Files in the Media Library & Add Image Alt Text
WATCH: How to Embed a PDF Link into a Page or Post in WordPress
In addition to images, you can also upload and manage PDFs in the Media Library.
Uploading PDFs works the same way as images, the only difference is linking to/adding PDFs to a block.
If you need to link a PDF, the “File URL” field is the link you will use for linking directly to the PDF. Simpy click “Copy URL to clipboard” or manually copy the URL and then use that URL to link to the PDF in a CTA link or button, like you would for a page or external site.
Question: Can I crop and edit photos in the media library?
No. You want to crop and edit your photos somewhere outside of WordPress. We don’t recommend cropping or editing photos in WordPress.
Question: Will alt text be on all my images?
Alt text only appears on images where you’ve purposefully placed alt text. See more about Orbit’s alt text best practices on our accessibility tips page.
Question: What file types should I use for my images?
Orbit recommends uploading your images as .jpg/jpeg whenever possible. This is typically the best file type for things like stock photography or background images. For images that need to be higher resolution (like infographics or maps) it’s acceptable to use a png. For icons we recommend a png or an svg.
To create & edit forms, go to: Ninja Forms > Dashboard
WATCH: How to Manage Existing and Create New Webforms in WordPress Ninja Forms
Go to the “Form Fields” tab – In this tab, you can edit the forms and the submit button on the form.
NOTE: This button will always say “Publish,” even if the form has already been published.
Go to the “Email & Actions” tab – In this tab, you can edit the thank you page redirect, email admin, and email user settings for each form
NOTE: The Email & Actions tab contains a list of all actions that occur when the user clicks the “Submit” button on a form
NOTE: You can access and export data from Ninja Forms submissions by going to Ninja Forms > Import / Export > Select the form > Click “Export Form”
WATCH: How to Create or Manage a Thank You Page Redirect in WordPress Ninja Forms
NOTE: The Advanced Settings below the html window allow for additional email parameters to be added. If an auto Reply email, CC or additional email addresses need to be added to the form. Can be done here versus creating new email addresses.
Go to the “Advanced” tab – In this tab, you can set other miscellaneous settings for the form.
Once the form is complete, copy the short code and paste into a content editor on the page where you want the form to live.
For any additional information around Ninja Forms, check out the Ninja Forms official documentation.
Applied Tech Headquarters
6662 Ronald Reagan Ave.
Madison, Wisconsin 53704
MADISON | MILWAUKEE | WAUSAU | DENVER
Phone: 608.729.1300
Fax: 608.268.6007
What We Do
Company