Learning objectives

When you have completed this session, you should be able to

• modify the source code in Moodle.

HTML source code

Who knows HTML code can have a look at the source code and can edit, modify or correct it.

In order to edit the source code you need to click on the icon Its name is "Toggle HTML Source".

The Gutenberg lesson's source code looks like this (unwrapped):

The link you made the last look like the following, in the source code view:

<div style="text-align: justify;">Reference: <a href="http://en.wikipedia.org/wiki/Johannes_Gutenberg" target="_blank" title="Wikipedia">Wikipedia</a><br /> </div>

To see it better through look at the same code in a better structure:

<div style="text-align: justify;">

</div>

The whole line can be found in a div layer between <div></div> tags, like a paragraph.

The tag <div> has an attribute, „text-align”, and its value is „justify”.

This is a short line that is why it has got no sense in aligning it as justified although it is not a mistake but unnecessary.

We can modify the source code itself!

The easiest solution is to change the word "justify" to "left" and so you adjust the text to the left. The other solution is to delete this attribute to leave only the <div> tag without style="text-align: justify;".

So the source code changes as following:

<div>

</div>

The text between tags <a href></a> will become the link. It has an additional tag "title", its value is "Wikipedia". It appears when the mouse cursor is over the link.

You can let the tag „title” out, so the source code changes like this:

<div>

</div>

The tag <a> has a compulsory „href” attribute, because you can give after this the url. It will link to the site you give here.

Reference and additional help:

HTML Basic: http://www.w3schools.com/
Color Codes: http://www.computerhope.com/htmcolor.htm
Free HTML Tutorial: http://www.2createawebsite.com/build/html.html