Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
One of the great things about Moodle is that it will allow you to post native documents directly into your course and distribute those files out to your students. Now we already saw this in the Getting Started chapter when we posted a Word document of our Course Syllabus and we also posted a PowerPoint presentation with slides to distribute out to the students. And there are lots of other document formats that you can post into Moodle, and as long as your students have that application on their system or have access to it, they are able to open those documents.
But one of the really powerful things about Moodle is that it's entirely web-based and you are able to write web pages and compose HTML or Hypertext Markup Language directly inside of Moodle. So it allows you to unlock a lot of additional power and capability and really customize your course to make it work exactly the way that you want it to work. And to do that, you use the built-in HTML Editor in Moodle. In this chapter, we are going to step through the common tools that you are going to need to be familiar with to really unlock the full potential of the Moodle Learning Management System.
So let's have a look at the HTML Editor. If we go up to the latest News block in the upper right corner and click on Add a new topic. This is a very quick way to get into the HTML Editor. Let's go ahead and type-in a subject of Simply Demo, and then I'm going to scroll the Window down, so we can get a nice, clear view of the HTML Editor. You are more than likely going to be already familiar with the functions of many of the buttons and tools that are embedded in the HTML Editor. Because the Editor uses the icons that have become kind of a defective standard, if you will, across most word processors and HTML editors. But we are going to go ahead and go over those right now, so you are really familiar with what they do because those are few that are little different.
The first couple of options here allow you to set the Font and Font Size of your text. There is a Styles menu that allows you to set the specific styles of text, and we'll go over that in the later movie, how to go ahead and set those styles and what they look like. There is a dropdown menu that allows you to set the language of the content that's being displayed. So if you are working in a multilingual environment or you are displaying text that needs to be in another language, you can go ahead and select that text and set the language right here.
We've got some basic formatting tools such as Bold, Italics, Underline, Strikethrough, ability to add subscripts and superscripts to our text. We have a tool here that's called Cleanup Word HTML. Now what this tool does is if you are using Microsoft Word and you go up to the File menu and choose Save as Web page, Word will export the document that you are working on as an HTML website. You can then take the HTML code that Microsoft Word has written for you, copy it and paste it into the Moodle HTML Editor. Then click the button here, for Cleanup Word HTML, and the Editor will go ahead and strip out any extraneous code that's been written to control the formatting of your document.
This does raise an interesting question. If you've gone ahead, and you've invested a lot of time in your Word document or any other document to apply a bunch of formatting, and you get it exactly the way that you want it inside of Word, go ahead and just post that document to your students and distribute it out to them, rather than investing more time going in and further customizing it, once it gets into the HTML Editor. There are tools here for Undo and Redo, and then some tools to allow you to adjust the alignment of your text, whether it'd be Left Justify or Right Justify or Centered.
The two buttons here with the Paragraph Marker and the directional arrows allow you to set the direction that text will flow inside of your HTML Window. So the default action is to flow from left to right. But a lot of languages are written actually from right to left. So this allows you to control the flow of text and will allow you to set the direction in which text is flowing. Next, you have some tools to deal with lists, both ordered lists and bulleted lists. You have some tools to allow you to increase and decrease the indention of blocks of text. So if you want it sub-quote out something or set a tab stop essentially, you can do that right here.
Next you've got the ability to set your Font Color and the Background Color of different areas. You can add a horizontal rule, or horizontal line that will show up inside of your text to be able to create some separation between different areas. The Anchor tool allows you to take a document that has a lot of text or a lot of different sections in it, and select different areas, set an anchor and name that area. Then link to it from another location and have the page jump down directly to that spot. So you've probably seen this in a long document where there is a little outline at the top. You can click on a particular heading, it will jump to that section of the document, and so, you need to first set this up with the Anchor tool. We'll move to an example of this in our later movie.
The Link tool allows you to create web links, we are going to go into this because this is a real important tool to know how to use and know how HTML links are established. You can remove links. Once a link has been created, you can select it and get rid of it. There is a Prevent Autolinking, and Autolinking inside of Moodle is very cool. We are going to go into an example of this, where we'll use the Glossary to create some glossary entries and then we'll turn on a function inside of the Moodle system so that anywhere those words show up inside of any documents that you are posting inside of Moodle, that Glossary entry will be linked to it, and what this tool does is it would actually prevent a particular listing from having that pop-up entry.
The Insert an image tool, we are going to use this tool extensively as well in later movies, because you are going to be able to go in and grab some images, both that you have uploaded into your course and other images out on the web and incorporate them into your site. So that you are able to create a very rich environment for your students. The Table tool allows us to create tables of information and work with that information inside of the HTML Editor. There is a nice little tool here that allows us to insert smiley face icons, if you would like to use that.
The Insert Special Characters, this is how you can type diacritic characters and some specialized characters that may or may not be available to you right on your keyboard, so that you are able to type-in, for instance, accented characters or percent mille, or registered trademark, or things like that, this tool will allow you to insert those straight into your text. There is a Search and Replace tool that allows you to find and replace phrases and text that you have written inside of your document. There is a tool here to toggle HTML source. Now when you click on this tool, what this is going to do is it's going to turn off the what's termed a WYSIWYG editor or What You See Is What You Get, it's going to turn that off and it's going to take you directly into the underlying HTML code. Now if you already know HTML, you can go ahead and type that code straight into here and Moodle will execute it.
Now be aware that one of the things about the HTML Editor is that it's going in and it's trying to clean up your code to make your life easier. Now, if you are already an expert in HTML, this may prove to be a little frustrating to you at first because you may find that as you are writing code in here, and you turn off the HTML Code Editor, Moodle may go in and adjust some of that code, and so it can be a little frustrating if you are really into using a lot of in-depth HTML, by being able to get at the source code is right here available to you.
The last tool that's here in the Editor is one of my favorites. I use this all the time. It's the Enlarged Editor and so you just go ahead and click on that tool and it brings up a much larger screen. So instead of having to work in this small window, you get all this extra area to really design and work and focus on the content that you are building. It also gives you an additional line of tools that are all about working with and managing tables. And we'll go into a lot of these tools in a later movie when we are focused on just tables. But for now, know that that's where that is.
When you have done editing your code inside of the HTML Editor's full screen Editor, go ahead and click the minimized Editor button and it's going to return you back to the main page. Now one other thing to note is down at the bottom-left of the HTML Editor, there is a row that says Path and it's going to have a bunch of links, and as you are working in your code, this is going to show you a hierarchy of the HTML tags that are going to define where you are adding your document. So the default tag that you are working inside of, when you are posting content up here is the body tag of the HTML code. And as you continue to add more text, you will see this line fill up with the additional HTML tags, and you can go and click on any of those tags it will highlight the code that you are actually working in.
It's a quick overview of what the HTML Editor is and why you are going to work with it. For the rest of this chapter, we are going to go into some of the more specifics of these tools and how to go in and really use them to kind of manipulate some of the content that you are going to be posting in your course. So go ahead and scroll back up to the top and we are going to get out of this demo news forum that we are creating here, by simply clicking on the BIOL432 link and that's just going to just abandon that page for us.
Get unlimited access to all courses for just $25/month.Become a member
82 Video lessons · 91162 Viewers
80 Video lessons · 138178 Viewers
59 Video lessons · 56996 Viewers
52 Video lessons · 70638 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.