Page content: Difference between revisions

Latest revision as of 12:15, 18 November 2010

The page content area is the usual place teachers enter material for students to view and evaluate on a question page. The purpose of the page is to give a quick overview to a new Moodle teacher and point out common things that can be done in the content area of a page.

Editing page content

In edit mode, teachers can make simple, quick presentations for a student, or add many robust features. The page content area has a friendly HTML editor tool bar with a WYSIWYG interface that has standard icons for different editing functions.

This page has a brief review of tools that assist teachers in creating the presentation in the content area of a lesson page. We encourage you to look at the HTML editor page for more detailed instructions for most tools and links to other pages.

Tool Bar

Toolbar in Ver 1.5 to 1.9

The toolbar should be familiar to users of word processors. The toolbar creates HTML code for the user. It is possible to see or reveal the code on the page with the icon that looks like <>. More help with HTML toolbar can be found here.

Text Editing

The HTML toolbar has the usual set of text editing features. These include Fonts type, font size, bold, italic, underline, strikethrough, text color , background color and a special character generator. There are line alignment, bullets and numbers, along with indent and paragraph tool icons.

Image Insertion

The Image Icon will assist you in creating HTML code. The Image Icon on the tool bar brings up this popup window. We should mention here that JPG, GIF and PNG files are recognized Moodle images file types.

Version 1.5.3

These folders and files can also be found in the administration block under files.

The basic steps are to locate the file
1. Using the File Browser Window for previously uploaded files, OR
2. Upload a file
  1. Locate and click on the location the file will go to in the File Browser Window
  2. Use Browse button to locate file (local machine)
  3. Use Update button to place file in File Browser Window,
click on file in File Browser Window to place file in "Insert URL"
Enter Alternative Text
Optional Use Layout, spacing and size parameters

Best practice is to put all of a single activities images in a folder such as "Lesson Example"
- It is possible to zip a local folder with images and upload it to a course lesson. See files Click here for more information on files.
- Remember to use the Refresh feature on your browser if the image does not appear to change in the Moodle Lesson.

When you browse for a local course image file its URL will be inserted like:

 http://www.yourMoodle.net/moodle/file.php/5/courseFolder2/pic1.jpg

Multimedia insertion

Linking a URLs to text is one way to point to multimedia resources and the appropriate multimedia player installed as a Multimedia plugins. Please refer to the specific type of media in MoodleDos for more detailed information about linking.

Embed a Flash file in a Lesson

It is possible to embed your flash files in the lesson page. For detailed instructions go here.

There are many commercial and open source programs which can create flash files.

Links & Anchors

The Link (chain icon)

An HTML link creates a path to external, internal or the current page. The icon saves writing code. One method is to copy the address bar from the location you want, click on the link icon,then paste it URL. Another method is to press the Browse button. This will take you to the Files area of the course. From here it is possible to select an existing file or to upload a new file and link to it.

There are three fields when the Link icon is used.

1. URL the web based address. Note a course file has a URL address via the browse button
2. Title - what appears when the mouse rolls over the link
3. Target - What kind of window should be called up.
4. Anchors - A pull down list allows you to select an anchor.

Anchor

An HTML anchor identifies text within a page which can be referenced by a link. To use the Anchor, highlight the word, then click on the Anchor icon. Give the anchor a name. Anywhere on the page, highlight the word you would like to link to the Anchor. Use the Link icon and the pull down menu to find the correct anchor.

Tables

Add tables, edit, adjust tables.

Hide glossary links

Select the text and use the "Prevent automatic linking" icon to prevent glossary from linking.

Path

What is that line at the bottom of Page Content show?

Content examples

Description of question or content (branch) page contents

Creative examples

Add an icon to a title bar, such as a course or site catagory
- Insert the image into the brief description, toggle HTML source code, copy the code for the image and paste it in the title bar.
- It is possible to adjust the size via the width and height parameters, the alternative text and title parameters in the code are not needed.
- Example of code

<img width="25" vspace="0" hspace="0" height="25" border="0" src="http://demo.moodle.org/file.php/4/f1.jpg"
inserted before text in course title gives this

Example Course Title Bar with icon

@@ Line 1: / Line 1: @@
-WHY ANITKABIR IS THE BEST PLACE TO VISIT?
+The page content area is the usual place teachers enter material for students to view and evaluate on a question page.  The purpose of the page is to give a quick overview to a new Moodle teacher and point out common things that can be done in the content area of a page.
-Anıtkabir is probably one of the most influential buildings in the world. Anıtkabir is in Ankara which is the capital city of Turkey. Anıtkabir (literally “memorial tomb”) is a mausoleum of  Mustafa Kemal Atatürk, the leader  of Turkish war independence and the founder and first president of republic of Turkey.
-There are  a number of reasons why people should see / visit Anıtkabir. Firs of all, it has historical, National and even international importance / significance. The great leader Turkish Independence war and Turkish Revolution and founder of Turkish Republic Mustafa Kemal Atatürk’s life, with full of struggles for Turkish land’s freedom raise the Turkish Nation to the level of civilization, lasted 57 years. It ended on 10th November 1938 and the great leader passed to eternity. So the idea to build the mausoleum (Anıtkabir) to reflect his greatness in every respect and to present his thoughts on principles; his reforms and modernization, was the common desire of the Turkish nation. In deepest grief of losing Ataturk, the first president of the Turkish Republic. The second reason why people should visit Anıtkabir is that it is a fascinating, artistic piece of art. Anıtkabir has the same characteristic of the period and it has many ultimate monument of the era. In addition, Anıtkabir has amazing fascinating Seljuk and ottoman architectural and ornamentation features. For example; the eawes of the towers and the hall of Honor which are Seljuk style saw tooth ornamentation should be seen. The other significant valuable part of Anıtkabir is “wall of the Lions Road” and auxiliary buildings surrounding the ceremonial ground.
+[[Image:Course_Lesson_Page_Content2.gif|frame|center|Editing page content]]
- It is also worth to see Anıtkabir because all stones and marbles which were brought in from various parts of Turkey where used to build Anıtkabir to represent Turkish People’s devotion, deep law and respect to the founder of the Republic. In other words, this is also very special for foreign tourists, so they come and visit Anıtkabir every year (about 2.420 foreign visitors and 544.20 Turkish Visitors in a year). Therefore, Anıtkabir is amazing, historical for challenging for foreign tourists to visit as it is monumental, symmetrical, cut-stone clad buildings with great emphasis on details.
-The third reason why people should visit Anıtkabir is It has  interesting four, mean parts which are “ the street of Lions, the ceremonial Plaza the Hall of Honor (Location of Ataturk’s tomb) and the piece park that surrounds the monument. The ceremonial Plaza is situated at the end of Lions Road. The area is 129 M long and 84 M white and was designed to accommodate 15.000 people. The floor is decorated 373 rug and kilim (Turkish Carpet) patterns, is made in various colors. Hall of Honor, on the other hand, is the iconic symbol of Anıtkabir and the location of Atatürk’s tomb what is more is the park “Peace Park” that surrounds the monument is called a peace park in honor of Atatürk famous expression (“Peace at home, Peace in the world”). It is interesting to see that it contains around 50.000 decorative trees, flowers and shrubs in 104 variety donated from around 25 countries. So, I thinkthis also attracts international tourists’ attention more. Moreover, Anıtkabir such a place where there are towers, statues, museum so it is a very rich complex situated in a historic mystic atmosphere.
+In edit mode, teachers can make simple, quick presentations for a student, or add many robust features. The page content area has a friendly [[HTML editor]] tool bar with a [[Common_acronyms#N_to_Z|WYSIWYG]] interface that has standard icons for different editing functions.
-To sum up, Anıtkabir is of interesting place which has crucial importance for both Turkish and international people in the world. Every one visit and learned about it. As I mentioned above with is amazing seljuck and ottoman architectural features and ornamentation, some symbolic future such as the use of eagle which symbolizes power; the soldier symbolize Turkish Army; the strong, genuine keeper of the peace are worth to see. Also it has a unique historical importance that every one should visit and get information about it.
+This page has a brief review of tools that assist teachers in creating the presentation in the content area of a lesson page.  We encourage you to look at the HTML editor page for more detailed instructions for most tools and links to other pages.
+== Tool Bar ==
+[[Image:Course Lesson Page Content Toolbar.GIF|frame|center|Toolbar in Ver 1.5 to 1.9]]
+The toolbar should be familiar to users of word processors.  The toolbar creates HTML code for the user.  It is possible to see or reveal the code on the page with the icon that looks like  <>.  [[HTML_editor|More help with HTML toolbar can be found here]].
+=== Text Editing ===
+The HTML toolbar has the usual set of text editing features. These include Fonts type, font size, bold, italic, underline, strikethrough, text color , background color and a special character generator.  There are line alignment, bullets and numbers, along with indent and paragraph tool icons.
+=== Image Insertion ===
+[[Image:Ed_image.gif]] The Image Icon will assist you in creating HTML code. The Image Icon on the tool bar brings up this popup window. We should mention here that JPG, GIF and PNG files are recognized Moodle images file types.
+[[Image:Course Lesson Page Content InsertImage Popup1.GIF|frame|right|Version 1.5.3]] These folders and files can also be found in the administration block under [[Files|files]].
+#The basic steps are to locate the file
+##Using the File Browser Window for previously uploaded files, OR
+##Upload a file
+###Locate and click on the location the file will go to in the File Browser Window
+###Use Browse button to locate file (local machine)
+###Use Update button to place file in File Browser Window,
+#click on file in File Browser Window to place file in "Insert URL"
+#Enter Alternative Text
+#Optional Use Layout, spacing and size parameters
+*Best practice is to put all of a single activities images in a folder such as "Lesson Example"
+**It is possible to zip a local folder with images and upload it to a course lesson. See files [[Files|Click here for more information on files]].
+**Remember to use the Refresh feature on your browser if the image does not appear to change in the Moodle Lesson.
+When you browse for a local course image file its URL will be inserted like:
+ <nowiki> http://www.yourMoodle.net/moodle/file.php/5/courseFolder2/pic1.jpg</nowiki>
+===Multimedia insertion===
+Linking a URLs to text is one way to point to multimedia resources and the appropriate multimedia player installed as a [[Multimedia plugins]].   Please refer to the specific type of  media in MoodleDos for more detailed information about linking.
+===Embed a Flash file in a Lesson===
+It is possible to embed your [[Flash|flash]] files in the lesson page.  For detailed instructions [[Flash#Insert_flash_into_a_lesson_page|go here]].
+:There are many commercial and open source programs which can create flash files.
+=== Links & Anchors ===
+====The Link (chain icon)====
+[[Image:Ed link.gif|frame|center]] An HTML link creates a path to external, internal or the current page. The icon saves writing code.  One method is to copy the address bar from the location you want, click on the link icon,then paste it URL. Another method is to press the Browse button.  This will take you to the [[Files]] area of the course.  From here it is possible to select an existing file or to upload a new file and link to it.
+There are three fields when the Link icon is used.
+[[Image:HTML Link Insert1.JPG]]
+##URL the web based address.  Note a course file has a URL address via the browse button
+##Title - what appears when the mouse rolls over the link
+##Target - What kind of window should be called up.
+##Anchors - A pull down list allows you to select an anchor.
+====Anchor  ====
+[[Image:Ed anchor.gif|frame|left|]]
+An HTML anchor identifies text within a page which can be referenced by a link.
+To use the Anchor, highlight the word, then click on the Anchor icon.  Give the anchor a name.
+Anywhere on the page, highlight the word you would like to link to the Anchor.  Use the Link icon and the pull down menu to find the correct anchor.
+=== Tables ===
+[[HTML_editor#Inserting_tables|Add tables]], edit, adjust tables.
+=== Hide glossary links===
+* [[Image:Ed_nolink.gif]] Select the text and use the "Prevent automatic linking" icon to prevent glossary from linking.
+== Path ==
+What is that line at the bottom of Page Content show?
+== Content examples ==
+Description of question or content (branch) page contents
+===Creative examples===
+*Add an icon to a title bar, such as a course or site catagory
+**Insert the image into the brief description, toggle HTML source code, copy the code for the image and paste it in the title bar.
+**It is possible to adjust the size via the width and height parameters, the alternative text and title parameters in the code are not needed.
+**Example of code
+<nowiki><img width="25" vspace="0" hspace="0" height="25" border="0" src="http://demo.moodle.org/file.php/4/f1.jpg"</nowiki> <br>
+inserted before text in course title gives this
+[[Image:HTML Link Insert title example1.JPG|thumb|center|Example Course Title Bar with icon]]
+== See Also ==
+*[[Flash]] inserting them in content of questions or content (branch) pages
+*[http://moodle.org/help.php?file=index.html Index of Help Files] - Scroll down to "Reading and Writing"
+*[[Files]] - Uploading, creating, moving, deleting course files and folders
+[[Category:Lesson]]

Documentation