Web Management Video Tutorials
This section will explain how to edit information on a website within the OU Campus system. Each link covers a different topic with a video tutorial, including a transcript.
Tutorials
Read a transcript of the video
Video Transcript
- You can insert an image one of two ways. The first is to right click in the content region, and click the insert image button. The second is to press the image icon in the toolbar, which appears as two mountains inside a picture.
- In the box that appears on screen, click the icon of the file with a magnifying glass over it. This will let us browse for our image. Once there, browse for the correct folder for you website. The title will be identical to the site’s name extension seen here in the URL.
- Once inside the correct folder, navigate next to the ‘img’ folder within it. Every site folder has an img subfolder. From there, you can choose an already uploaded image, or upload one yourself. To upload an image, hit the green Upload button in the top-right corner.
- You can now either click and drag an image file from your computer onto into this box, or press the green upload button to browse for an image. Once you’ve selected your image, you may find that you cannot fully upload it. Make sure the filename of your image isn’t red. If it is, you will need to rename it. Hover over the red name and press the Rename option that appears. Spaces and special characters are not allowed. If you are overwriting a previous image with the same filename as the one you are currently uploaded, check the Overwrite button before uploading.
- Once the image is uploaded, click Insert. Before we can push it to the page, we need to also add a description. The description is necessary for Accessibility reasons. People who have visual issues and use assistive technology such as screenreaders will hear this description in place of the image. Try to make it descriptive of the image, but not overly so. We have a picture of a koala climbing a tree, so that’s what I’ll write in the description.
- Once you’re finished, go ahead and insert the image into the page. From here, we can resize the image by selecting it with our mouse, and clicking the small white boxes that appear on the sides. Additionally, we can add a link to the image by right-clicking on it and pressing insert edit link. This will allow a user to go to a separate web page by pressing on the image. You can find the tutorial on adding links in the marketing and communications web tutorials page.
Read a transcript of the video
Video Transcript
- INTRO: In this this video, I’ll show the process to create, edit, and delete links and buttons within the JU.edu website.
- Once you’ve logged into your page, Go ahead and hit the green Main Content Button at the top of the page. Find the place in the white outlined content area where you’d like to place the link and place your cursor there. Right click, and select insert edit link.
- If you want to link to another page on gxitma.net, click the icon of the file with a magnifying glass over it. Once the box pops up, press on the selection box to the right as shown, and select Production instead of Staging. Click the ‘www’ in the upper left, and you should see a list of websites show up. Browse for the correct folder of you website. To find things a bit quicker, you can type the first couple letters of the site you wish to find into the Filter by Name box. I’m going to type A D M to find admissions. And as you can see, the site appears on the list.
- Find the page you are looking for. If you’re unsure what its filename is, if you click on the page once, and a preview of it will appear on the right for you to see. Once you’ve found your page, click the insert button.
- Under TEXT TO DISPLAY, type the words or sentence you want users to click on to take them to the page you’ve linked.
- Next, hit okay. A link has been inserted into the page.
- If you’d like to make the link a button, right click the link and select Edit. Under the Class tab, select Button. Then hit OK. The link should now have the stylings of a button. As a rule, only do this to links that appear underneath or above a paragraph. Don’t insert a button within a paragraph.
- And that’s all there is to it! Thanks for watching this tutorial. See you next time.
Read a transcript of the video
Video Transcript
- In this video, I'll show how to insert a document into a web page. Once you've found your page of choice, hit the green main content button.
- You can insert a document one of two ways. The first is to highlight a line of text, right click in the content region, and click the insert/edit link button. The second is to press the chainlink icon in the toolbar.
- Click the icon of the file with a magnifying glass over it. Once the box pops up, you should see a ‘docs’ folder. If not, click the ‘www’ in the upper left, and you should see a list of websites show up. Browse for the correct folder of your website, and you’ll find the ‘docs’ folder within it.
- From there, you can choose an already uploaded document, or upload one yourself. To upload a document, hit the Upload button in the top-right corner.
- You can now either click and drag a document file from your computer into this box, or press the green Add button to browse for it. Once you’ve selected your document, you may find that it gives you an error message. Make sure the filename of your image isn’t red. If it is, you will need to rename it. Hover over the red name and press the Rename option that appears. Make sure it has no spaces and special characters. Click outside the file and the error should go away. If you are overwriting a previous document with the same filename as the one you are currently uploaded, check the Overwrite button before uploading. Once the document is uploaded, click Insert.
- Then, hit okay. That will turn the text you highlighted at the beginning into a link. Next, hit the Save and Exit button in the top left. Then, make sure you've published your page or the link won't work.
- Now that the page is published, we want to check to see if the button is linked properly. So we'll click the "View in New Window" button that appears at the bottom of the screen. Now, when you clink on the link, it should either open the document in a new tab or download it.
- That's all there is to it! Thanks for watching.
Read a transcript of the video
Video Transcript
- This video will show how to add a photogallery to our webpage. Before we can insert a photogallery to our page, first we will need to create it. After logging in, hover over the Content button in the top toolbar, and click on the Assets dropdown. From here, you can choose a photo gallery if you've created it, or if you'd like to make a new one, click the New button in the upper right.
- Then, select image gallery. Next, give your gallery a name. it may be helpful to name it after the web page you're inserting it into. If you'd like, you can also add a description to help you remember what it's for. But it isn't mandatory, and no one outside of OU Campus will see it. leave the tags field blank. Next, hit the create button in the bottom right corner.
- Scroll to the bottom of the page. In the box labeled "Images", you can drag and drop images from your PC into this area, or click the grey Add button to browse for them. Notice that I selected images with an equal width and height to one another. To keep the gallery size consistent, only upload images that are 800px wide and 500px tall. Also, try not to upload any more than five images to any given photo gallery. Most users visiting the site won't pay attention to it for that long. Now that our images are uploaded, there are four attributes we can fill out. Title, Description, Caption, and Link. Make sure to fill out the title with a sentence or two that succinctly describes what the image displays. This first example shows a daisy in a filled of grass, so that's what I'll write. I'll do something similar for the next image as well. Whatever you write, make sure it's an apt description of the image, as if describing it to someone who can't see it or read it. For now, we'll skip the next three sections.
- Once you've finished uploading your photos and giving them a title, we'll hit the blue Save button in the bottom right. Then, the green publish button at the top. After it publishes successfully, we'll head back to our webpage.
- Then, we'll press the main content button. Next, we're going to insert the photogallery. Make some room on your page, place your cursor where you want the gallery to go, and click the "Insert Asset" button up at the top. It will be beside the puzzle piece icon. Next, we'll find our asset. I remember mine's name, so I'll go to the "Filter By Name" box and start typing letters until I find it. Once you've found it, hit the insert button in the bottom right. You should get a box that states that "The Asset Cannot be Shown." So what we'll do is hit the Save and Exit button in the top left, and the photo gallery should show up.
- That's all there is to it! Thanks for watching.