August 2016 Sacred Heart Nativity http://www.shnativity.org Credentials Wordpress Admin Login URL: http://www.shnativity.org/wp-login.php login = sarriola@shnativity.org pw = sent via system email Login = kcordova@shnativity.org pw = sent via system email Bluehost Login http://my.bluehost.com login = shnativity.org pw = Ask Sonya or Garrett Bragalone at M3iworks. gbragalone@m3iworks.com Google Analytics http://analytics.google.com Google ID = UA-80233106-1 Logins = kcordova@shnativity.org and sarriola@shnativity.org 1
Updating a page in Wordpress - 3 How to create a new page in WordPress - 4 Adding Images To a Page - 5.6 Adding Assets Such as PDFs or Word Documents - 6.7 Adding Links - 7.8 Embedding video, widgets, or other html content - 8.9 Adding SEO Tag 8.11 Adding your Page to the Menu structure 9.12 How to Delete or Unpublish a page in WordPress - 10 How to Create/Edit a Faculty or Staff Member 12 How to Create/Edit a Calendar Event 14 How to Create/Edit a Partner Logo 16 How to Create/Edit a Success Story 17 How to Create/Edit a Testimonial 20 How to Change/Add Homepage Banners - 22 2
Updating a page in Wordpress 1. Editing from a Current Page a. Login to Wordpress b. Navigate to the page you want to edit c. Click on the Edit Page in the black admin toolbar at the top of the screen d. Edit the content in the Body area section of the form e. To save, in the right rail under Publish section, click Update button f. Review your changes 2. Editing a Page using the Admin Menu a. Login to Wordpress b. From the admin dashboard, left side, choose Pages c. A list of pages display. Locate or filter the list to find your page you want to edit d. Click on Edit next under the page name e. Edit the content in the Body area section of the form f. To save, in the right rail under Publish section, click Update button g. Review your changes 3
How to create a new page in WordPress 1. Login into Wordpress 2. From the Admin Toolbar at the top, choose + New > Page 3. Page Hierarchy Set the page hierarchy by using the Page Attributes section in the right rail. This will create the correct breadcrumb and hierarchy of the page. Choose the Parent pull down list and set where you want to page to live under. No parent means it will be in the root of your site. To add your page to the menu structure, seem item #12. 4. Template Leave as Default Template unless you need a page to go Full width without the right hand rail material. 4
5. Title - Give your page a meaningful Title (this is what displays in the browser bar and becomes the page name in the url automatically) 6. Body Field - Add your body content and format text in the body field using the interface wizard. Note - If you are going to cut and paste from a Word document, click the clipboard icon which is Paste as Text so it removes all the formatting that can conflict with your website styles. 7. Adding Images - To add an image from the editor, place your cursor in the text where you d like to put the image, and click Add Media button. Before you upload images, it s highly recommended that you crop and resize the image before you upload. This will speed up page loading and make it easier to align within the page. For a free online tool for cropping/scaling images, visit http://pixlr.com/ 5
The media library will appear. The Media Manager will open and walk you through the process of choosing, uploading, and inserting the image. You can choose an existing picture, or upload a new one. To upload a new image while in media manager, click the Upload tab > Browser (or drag and drop). Once the file uploads, click the file, and adjust the Display settings in the right rail. This will set the alignment, size and links. Then click the Insert into Page to put it into the post, or Edit to see the file s details. Text alignment - If you d like to have your words wrap around the image, choose a right or left alignment option. You can also adjust the size of your image right in the post by clicking and dragging one of the boxes at the image s corners. To remove the image entirely, click the X. 8. Adding Assets Such as PDFs or Word Documents - To add an asset from the editor, place your cursor in the text where you d like to put the asset, and click Add Media button. 6
Once the file uploads, click the file, and adjust the File Attributes in the right rail. This will set the name of the link and link properties when attaching to the page. Then click the Insert into Page to put it into the page. To have the file open in a new tab, hover over the link and click the edit icon. The asset Insert/edit link properties screen appears. Check the box for Open link in a new tab. Click update. 9. Adding Links - To create a link to page or website, highlight the text you would like to link. Click on the icon in the toolbar. The link properties screen appears 7
Add the URL to the URL field or link to existing content by searching for the content and selecting it from the list. Click the Add link button to insert the link into the page. 10. Embedding video, widgets, or other html content Click on the Text tab in the body editor. This puts the editor into source code view. Paste the embedded source code from another site into the space on the page where you want the source code to appear. 11. Adding Search Engine meta tags to each page Adding Metadata to your website will help search engines find your site easier. It also provides better search results. We ve installed a plugin called Yoast SEO, which allows you to add these terms easily and it also provides you with some light statistics on how to optimize your page for SEO. 8
When editing a page, the SEO section can be found beneath the body section. It will automatically populate the title, url and description based on the saved content of that page. If you want to adjust the title or description, click on the little pencil icon in the Snippet Editor to the right of it and edit that line. It s also beneficial to add some focus keywords. These are descriptive keywords related to that page s content. 12. Adding your Page to the Menu structure - To add your page to the menu structure, make sure a page is created and saved already. Go to the Admin Dashboard > Appearance > Menus. The menu structure widget appears. 9
Find the page you want to add by using the search feature under Pages on the left of the widget. Select the checkbox next to the page, then click Add to Menu. The page item will show up at the bottom of the menu structure. Click and hold the page and drag it to its correct location. Then click on Save Menu button. How to Delete or Unpublish a page in WordPress 1. Login to Wordpress 2. Navigate to the page you want to delete/unpublish 3. Click on the Edit Page in the black admin toolbar at the top of the screen 4. In the right rail under Page, you have the options to a. Unpublish the page by putting the Status of the page in draft mode. This saves the page for future use. b. Trash the page by clicking Move to Trash. This removes the page from the site. 10
5. Note If you remove a page from the site, make sure you take it out of the menu system too. 11
Edit/Creating a Faculty or Staff Member The staff/board member page is generated dynamically. Each member is single staff member listing. 1. Editing a current Faculty/Staff Member a. In the Admin Dashboard, click on Staff Members. A list of staff appears. b. Find the staff member you want to edit via the list or Staff member search c. Roll over their name and click Edit d. Make the edits, click on Update in the right hand rail. e. Review your changes. 2. Adding a Faculty/Staff Member a. In the Admin Dashboard, click on Staff Members. A list of staff appears. 12
b. Click on Add New from the Staff Member page or via Admin Dashboard > Staff Members > Add New c. Add the Staff Member Name d. Upload a Staff Member Photo by clicking on Set Feature Image under Staff Photo. The media library appears. Upload a photo or select a photo from the library. Once selected, click on Set Feature Image. The staff member photo should be no larger than 300 pixels high and 200 pixels wide. e. Fill in the Staff Member Info section. f. Fill in the Staff Member Bio section. g. In the right side, select the proper group for the member so the member shows up in the staff/faculty page correctly. h. Once all the information is entered, click on Publish in the right rail. i. Review your changes. 3. Ordering a Staff Member Adjust the order of a staff member a. Admin Dashboard > Staff Members > Order b. Click and drag staff members to their correct order. c. Review your changes. 13
Edit/Creating a Calendar Event The calendar tool automatically places your events in order and removes from the calendar when completed. 1. Adding an Event a. Login to Wordpress b. In the Admin Dashboard, click on Events > Add New. The Event window appears c. Enter the Title of Event (this is what displays in the calendar) d. Enter any additional event details describing the event. You can add text, photos, documents, etc. e. Fill in the Event Details section, Event Date and Time, Event Location, etc. 14
f. Add a Feature Image for each event. This creates the graphic logos you see on the homepage or events calendar page. This image should be square in dimensions, using minimum dimensions of 400px x 400px. g. Click Publish and review your changes. 2. Editing an Event a. Login to Wordpress b. In the Admin Dashboard, click on Events. A listing of all events should appear c. Find your Event you want to edit, hover over the Event Title and click Edit d. Edit your Event, click Update and review your changes. 15
How to Create/Edit a Partner Logo Adding a partner logo automatically displays the logos on the partner page, statistics page and adds the logos to the carousel on all the sub pages. 1. Adding a Partner Logo a. Login to Wordpress b. In the Admin Dashboard, click on Logos c. Click on Add New Logo, the logo entry pages appears d. Insert Logo Name e. Set the Logo Image. Logos should be on a white canvas of 180px wide and 80px tall. For a free online tool for cropping/scaling images, visit http://pixlr.com/ 16
f. Add URL, this will link the logo the the partner site. Leave the Description field. g. Ignore the Custom Spacing and Custom Image URL fields h. Don t forget to Choose your Category so the logo appears in the right pages i. Click on Save to publish your logo j. Review your changes 2. Editing an Partner Logo a. Login to Wordpress b. In the Admin Dashboard, click on Logos A listing of all logos should appear c. Find your logo you want to edit, hover over the Logo Title and click Edit d. Edit your Logo, click Update and review your changes. 17
How to Create/Edit a Success Story A success story can be found on the Success Stories page. Adding a success story automatically adds it to this landing page in order, newest stories appearing first. 1. Editing a Success Story a. Login to WP b. Click on Posts in the dashboard c. A listing of Posts will appear (these will be the success stories) d. Click on Edit next under the post name e. Edit the content in the Body area section of the form f. To save, in the right rail under Publish section, click Update button g. Review your changes 2. Creating a Success Story a. Login into Wordpress b. From the Admin Toolbar at the top, choose + New > Post c. Fill in the Title of the Success Story 18
d. Fill in the Body content use text, images and documents as you would a normal page e. In the right rail of the page, choose the correct category of Success Stories f. Set the Featured Image. This will allow the success story to have a photo on the summary of success stories landing page and on its own page. Each image should be a minimum of 400px wide. Clicking on Featured image will invoke the Media Library. Upload the image to the Media Library and set the image. g. Click on Publish to finish your post h. Review your work 19
How to Create/Edit a Testimonial Testimonials are dynamically generated and found on the Success Stories page and randomly display in the footer throughout the site. Adding a testimonial automatically adds them to these regions. Users can submit testimonials via the form on the testimonial page. This form triggers an email to Nativity to review and approve the testominal. To approve, you need to go to Edit Testimonials and click on the testimonial to approve. 1. Editing a Testimonial a. Login to Wordpress b. Roll over Testimonials on the dashboard (left bottom) and choose Edit Testimonials c. A list of testominals appears. To edit a testimonial, click on the corresponding number in the top left corner. 20
d. Once clicked, it appears at the top. Revise the testimonial and when finished, click on Save Testimonial 2. Creating a Testimonial a. Login to Wordpress b. Roll over Testimonials on the dashboard (left bottom) and choose Edit Testimonials. A blank screen with form fields appears c. Fill in the Author field and the Testimonial field and then click Save Testimonial. This will automatically add it to the testimonial page. 21
How to Change/Add Homepage Banners Homepage sliders must adhere to the attributes below to make sure they look good and are responsive for tablets and photos. 1. How to Access Home Page Sliders a. Login to Wordpress b. On the Dashboard, click on Soliloquy c. A list of sliders appears, click on Home Page Slider 22
d. Next, a listing of all the banners appears e. To add a banner, use the upload section. A banner must have these size requirements to display correctly. The banner must high resolution, 3000px wide by 1000px tall. f. Once uploaded, you can grab each banner section to move the position of the banner. g. To remove a banner, click on the red X on the right of the banner. h. Click on Update to save your changes. i. Review your work. 23