Teacher s Update Guide

Size: px

Start display at page:

Download "Teacher s Update Guide"

Loren Ryan
5 years ago
Views:

Teacher s Update Guide 1. Overview of Classroom Connections... 2 2. Logging In and Creating a Post (article)... 3 Logging In... 3 Changing Your Password... 3 Creating a new Post.

1 Teacher s Update Guide 1. Overview of Classroom Connections Logging In and Creating a Post (article)... 3 Logging In... 3 Changing Your Password... 3 Creating a new Post... 3 Update the Text for an Existing Post... 3 How to Un-publish a Story or a Page Content Editing & Formatting... 4 Newark Catholic font Styles (colors and Sizes) Built In... 4 Formatting Your Content... 4 Preview Your Changes before making them Go Live... 5 How to add a URL Link to your Post... 5 Adding an Image to a Post... 6 How to Upload a.pdf Document, and Create a Link to It... 7 Making a Link Open in a New Tab/Window... 7 How to Add a Video to Your Post... 8 v2.0 September 27, 2011 Merlin Siteworks 1

2 Teacher s Update Guide for Classroom Connections 1. Overview of Classroom Connections The Newark Catholic website is introducing a new Classroom Connections feature to provide teachers with an easy way to communicate information to their students and families. The basic idea is that teachers can create blog posts on the NC website in a category for their given classes. These blog posts are created in the appropriate Classroom Connections category in the same way that blog posts are created for NC Wire News, Sports, and other NC news posts. The NC website is built on Wordpress, the most popular and common blogging software package, known for its ease use. Each participating teacher (others can be easily added) will be given their own website login. Their logins will allow them to create posts in their assigned categories. These posts can be simple text news items, or they can include pictures, videos, or.pdf files, or links to other reference websites, etc. Whatever the teacher wants to create and communicate. A new Classroom Connections: News menu item has been added in the Academics top menu section and also added to the Quick Links list on the Home page. v2.0 September 27, 2011 Merlin Siteworks 2

2.Logging In and Creating a Post (article) Logging In 1. Go to: www.newarkcatholic.org/wp-admin 2.

3 2.Logging In and Creating a Post (article) Logging In 1. Go to: 2. Username and Password will be ed separately Note: Teacher logins will have limited access to make website changes and are intended for the sole purpose of creating and updating Classroom Connections posts for their given subjects. They will be able to create new posts and edit posts for which they were the original authors. Changing Your Password Please do this the first time you log in with your new/temporary password. 1. After logging in, click on Profile on the left 2. Near the bottom, enter a new password of your choosing and click Update Profile Creating a new Post 1. Dashboard -> Posts 2. Add New Post 3. Enter the Title 4. Enter the text of the article 5. Add images, documents, or videos if desired 6. On the right, set the Category to the appropriate Subject(s). You can choose multiple if applicable 7. Save Draft, & Preview 8. Update as often as you need, looking at Preview until you re satisfied 9. Click Publish to make the story go live Update the Text for an Existing Post 1. Dashboard -> Posts 2. Click on the title 3. Update the content as desired 4. Click on Preview Changes 5. Update as often as you need, looking at Preview until you re satisfied 6. Click Update to make the updates go live How to Un-publish a Story or a Page 1. Dashboard -> Posts 2. Click on the given Post 3. Go to the Publish area on the right To DELETE the post permanently: 4. Click on Move to Trash To UNPUBLISH for now, but keep it around without deleting: 5. Click on Status -> Edit 6. Click on Draft and OK 7. Click on Update v2.0 September 27, 2011 Merlin Siteworks 3

3.Content Editing & Formatting Newark Catholic font Styles (colors and Sizes) Built In For a consistent website look, there are built-in

To access the styles when editing a Post, notice Styles drop-down menu, as well as the Paragraph Highlight the word(s) or sentence in our

Paragraph has the Headers: Styles has the various NC-* options: Formatting Your Content Wordpress has a nice WYSIWYG editor (click on Visual

4 3.Content Editing & Formatting Newark Catholic font Styles (colors and Sizes) Built In For a consistent website look, there are built-in styles and colors. To access the styles when editing a Post, notice Styles drop-down menu, as well as the Paragraph Highlight the word(s) or sentence in our text and then click on the given Style. Paragraph has the Headers: Styles has the various NC-* options: Formatting Your Content Wordpress has a nice WYSIWYG editor (click on Visual tab) Every page and post has the following: Visual editing (what you want) or Raw HTML (if you know what you re doing) Bold, Italic Insert an image Add / Delete a URL Link Indent Header levels Built-in Newark Insert a table Catholic (NC-*) styles Table cell formats Paste text copied from Word Paste plain text with no formatting v2.0 September 27, 2011 Merlin Siteworks 4

First type in the text for your post 2. Highlight the word(s) for which you want to be a link to another website / page 3.

5 Preview Your Changes before making them Go Live Editing scenario for basic text changes: 1. Update the given text 2. Preview your changes 3. Make additional changes if needed, and Preview again 4. Click Update to make your changes LIVE How to add a URL Link to your Post 1. First type in the text for your post 2. Highlight the word(s) for which you want to be a link to another website / page 3. Click on the add link icon 4. Type in the URL and if the link is for some other (not NC) website, click Open link in a new window/tab 5. Click Add link v2.0 September 27, 2011 Merlin Siteworks 5

6 Adding an Image to a Post Note: Please reduce image file sizes to something reasonable before adding to the website. Something under 100Kb. Huge image sizes will slow a website s performance. Add your text first, then go back and insert your image(s) Place your cursor where you want the image to be inserted (typically on its own line, or at the start of a paragraph, on the left) Click on the Upload/Insert an image icon, on the top left Typically get pics from your PC Text that Pops Up when you Mouse Over For some things, OK to leave Blank For a nice Pop Up image of the Full Size picture when someone clicks on this image? (if your original is larger than the size you ve selected for the Post) Select: File URL Else: Select None Select File URL ONLY IF the image you upload is bigger than the Size you re displaying. Want a Caption under your picture? Type it here. Want a nice Border Box around your picture without a caption? Trick: Type a couple blank spaces in the Caption Puts Image on the Right, puts text on the left and wraps around the image When you re ready, Insert into Post Pick the size you want Medium works well for most Posts, off to the right Full Size if you have pre-sized the picture and want to use the size you ve already created v2.0 September 27, 2011 Merlin Siteworks 6

To Delete a Picture or to Update its various Properties: Click on the picture Click on the appropriate icon for Update or Delete With Update: A pop-up screen will appear Update Delete How to Upload a.

7 To Delete a Picture or to Update its various Properties: Click on the picture Click on the appropriate icon for Update or Delete With Update: A pop-up screen will appear Update Delete How to Upload a.pdf Document, and Create a Link to It Add your text first, such as Download the form here Highlight the word(s) that you want to be linked to the.pdf document Click on the Upload / Insert image icon In the pop-up window, click Select Files Find and select your.pdf file on your PC and insert For the Title, type the word(s) to be displayed with the link (e.g. here ) Click on File URL button Click Insert into Post Next, make the.pdf link open in a New Window. See the quick steps below. Replace this with here (or whatever you want displayed for your link) Making a Link Open in a New Tab/Window Anytime a.pdf document is linked to, and also anytime a link refers to a website that is EXTERNAL to the Newark Catholic website, the standard being followed is to open those links in a NEW WINDOW (so as to not disrupt the browsing experience on the NC site). Highlight the text that contains the link Click on the link icon Check the box to indicate Open link in a new window/tab Click Update (or Add Link ) v2.0 September 27, 2011 Merlin Siteworks 7

8 How to Add a Video to Your Post The key step is to first upload the video to YouTube. YouTube does all sorts of good things in terms of re-sizing the video to a smaller file size, streaming the video so that it starts playing soon without waiting for the whole huge file to download, converts to various video formats automatically, etc. See the Boys Golf page, in the Team Notes tab for an example. 1. Upload the video into YouTube 2. Go to the YouTube page for that video and click on "Share", then "Show Options", then "Long Link". (It must be the "long link" format!) This will provide you with a URL. For example, it should look something like: Swipe and Copy that URL. 3. In your Wordpress post, put your cursor where you want to embed your video. 4. Click on the icon on the far right that looks like a movie strip and says "Insert / edit embedded media" when you mouse over it 5. A window will pop up. In the box for "File/URL", paste the YouTube URL. Don't change any other options. 6. Click "Insert". The pop-up window will go away and you'll see a box inserted into your post. 7. Click "Preview" to view a draft of your post and you should see a nice video (from YouTube) embedded in your post. 8. That's it. Works great. v2.0 September 27, 2011 Merlin Siteworks 8

UIS Office of Web Services Documentation. WordPress User Guide. WordPress User Guide 8/31/17 Page 1 of 13

UIS Office of Web Services Documentation. WordPress User Guide. WordPress User Guide 8/31/17 Page 1 of 13 UIS Office of Web Services WordPress User Guide WordPress User Guide 8/31/17 Page 1 of 13 UIS Office of Web Services WordPress User Guide Prepared by Ralph Shank Table of Contents About WordPress 3 Getting