Difference between revisions of "Help/How-to-Write-a-Language-Lesson"

From Polyglot Club WIKI
Jump to navigation Jump to search
 
(116 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{Help-menu}}
{{Help-menu}}
 
<div class="pg_page_title">How to create a language learning lesson</div>
<span style="font-size:150%">'''Here are some tips to help you create a language learning lesson:'''</span>


The Wiki page editing is done thanks to the [https://www.mediawiki.org MediaWiki Engine], the software used by the famous [https://www.wikipedia.org Wikipedia].
The Wiki page editing is done thanks to the [https://www.mediawiki.org MediaWiki Engine], the software used by the famous [https://www.wikipedia.org Wikipedia].
Line 8: Line 7:
You have two options:
You have two options:
===  Visual Editor ===
===  Visual Editor ===
If you are new at Wiki page editing, we recommend using the visual editor. It is an editor [https://en.wikipedia.org/wiki/WYSIWYG WYSIWYG] who is proposed by default.
If you are new at Wiki page editing, we recommend using the visual editor which is a [https://en.wikipedia.org/wiki/WYSIWYG WYSIWYG] editor.
 
Click the Actions > '''Edit''' button.


Creating pages is intuitive with the various buttons to format the text.
Creating pages is intuitive with the various buttons to format the text.
Line 16: Line 17:
===  Wiki Code ===
===  Wiki Code ===
If you have a little more experience, we advise you to directly use the Wiki code because you have more formatting options.
If you have a little more experience, we advise you to directly use the Wiki code because you have more formatting options.
Click the Actions > '''Edit Source''' button.


*[https://www.mediawiki.org/wiki/Help:Formatting How to use the wiki code]
*[https://www.mediawiki.org/wiki/Help:Formatting How to use the wiki code]


== Useful Wiki Codes==
==How to organize a lesson==
 
How should you organize your lesson?
 
To organize your lesson, and for [https://en.wikipedia.org/wiki/Search_engineoptimization SEO (Search engine optimization)], it is good to add title and different levels of headings.
 
Here is an example of page structure (using the Edit Source button)
 
{| class="wikitable"
  |
(image)
 
'''<code><nowiki><div class="pg_page_title">Vocabulary for animals in English</div></nowiki></code>''' (Lesson title)
 
'''<code>==Vocabulary==</code>'''(level 1)
 
'''<code>===The farm animals===</code>'''(level 2)
 
'''<code> ===Pets=== </code>'''(level 2)
 
'''<code>==Expressions== </code>'''(level 1)
 
'''<code>==Videos== </code>'''(level 1)
|}
 
Here are examples of existing lessons to inspire you:
 
*[[Language/Japanese/Vocabulary/Family]]
*[[Language/French/Vocabulary/False-Friends]]
 
 
===Lesson title===
If you want to write a title for your lesson, USE the following code:
 
'''<code><nowiki><div class="pg_page_title"> TITLE </div></nowiki></code>'''
 
 
Important: do not use the heading level 1 code:
 
'''<strike><code>=TITLE=</code></strike>'''
This heading is already used automatically for the page title (the page title is the same as the title in the URL) and we can have only have one Heading level 1 per page (for SEO reasons).
 
===Heading level 2===
Use the following code :
'''<code>==Vocabulary==</code>'''
 
===Heading level 3===
Use the following code:
 
'''<code>===The farm animals===</code>'''
 
===How to create headings with the visual editor===
 
Here is a video on how to create headings and automatically add a table of content:
 
https://www.youtube.com/watch?v=l2Ebiw4-OrQ
 
==Tables==
Here are easy ways to create tables without having to use the wiki code or the visual editor:
===Create a table: Solution 1===
#Create the table in Excel
#Copy and Paste the table in the page with the Visual Editor mode.
#Save the page
#Edit the page, this time, with the "Edit source" tab
#At the top of the table, add the following code, this will make your table much nicer
Replace the line :
<code>{|</code>
By the line :
<code>{| class="wikitable"</code>
Or by the line :
<code>{| class="wikitable sortable"</code>
if you want to make it sortable
===Create a table: Solution 2===
#Create your table in Excel
#Use this [http://tools.wmflabs.org/excel2wiki/index.php free tool] to create the wiki code equivalent to your Excel table
#Edit the wiki page with the "Edit source" tab
#Paste the code
===Update a table===
#Copy the table from the html page
#Paste in Excel
#Edit your table in Excel
 
Then update the wiki page, using solution 1 or 2 above.
===How to format the table header===
The table header is a special row at the top of the table with the title of each column.
 
Here is how to create a table header:
 
Edit the page with the Edit source button:
*replace the following wiki code (only the first line)  :
 
<code><nowiki>{| class="wikitable"</nowiki></code>
 
<code><nowiki>|header title 1</nowiki></code>
 
<code><nowiki>|header title 2</nowiki></code>
 
<code><nowiki>|-</nowiki></code>
 
*with this code :
 
<code><nowiki>{| class="wikitable"</nowiki></code>
 
<code><nowiki>!header title 1</nowiki></code>
 
<code><nowiki>!header title 2</nowiki></code>
 
<code><nowiki>|-</nowiki></code>
 
 
You just have, '''ONLY on the first line''', to replace the <code>'''|'''</code> by a <code>'''!'''</code>
 
===Cool! you can also use HTML code 😉===
If you prefer HTML, you can use it to create tables.
 
Don't forget to use the class="wikitable" in the table opening tag so the table will look nice.
 
<code><nowiki><table </nowiki>'''class="wikitable"'''<nowiki>></nowiki></code>
 
  <code><nowiki><tr></nowiki></code>
 
    <code><nowiki><td>ligne 1, column 1</td></nowiki></code>
 
    <code><nowiki><td>ligne 1, column 2</td></nowiki></code>
 
  <code><nowiki></tr></nowiki></code>
 
  <code><nowiki><tr></nowiki></code>
 
    <code><nowiki><td>ligne 2, column 1</td></nowiki></code>
 
    <code><nowiki><td>ligne 2, column 2</td></nowiki></code>
 
    <code><nowiki></tr></nowiki></code>


Here are some useful markups :
<code><nowiki></table></nowiki></code>


===  Links==
==  Links==
====Internal links====
===Internal links===
To link to a page which URL is wiki/Help inside the Polyglot club wiki, use the following code:
To link to a page which URL is <code><nowiki>https://polyglotclub.com/wiki/</nowiki>'''Language/English/Grammar/To-be'''</code> inside the Polyglot club wiki, use the following code:


<code><nowiki>[[Help|different text]]</nowiki></code>
<code><nowiki>[[Language/English/Grammar/To-be|different text]]</nowiki></code>


====External links====
===External links===
To link to a page outside Polyglot club wiki.
To link to a page outside Polyglot club wiki.


Line 36: Line 173:
*[https://www.mediawiki.org/wiki/Help:Links More information about links]
*[https://www.mediawiki.org/wiki/Help:Links More information about links]


===  Images ===
 
*[http://polyglotclub.com/wiki/Help/Upload-a-Photo-How How to upload and format a photo?]
==  Images ==
*To upload an image, see this link: [http://polyglotclub.com/wiki/Help/Upload-a-Photo-How How to upload and format a photo?]


Example:
Example:
Line 49: Line 187:
<code><nowiki>[[File:My_pic.png|thumb|My Picture Caption]]</nowiki></code> ''with a caption''
<code><nowiki>[[File:My_pic.png|thumb|My Picture Caption]]</nowiki></code> ''with a caption''


===  Videos ===
==Voice Recordings (AUDIO, MP3 etc.)==
To add a Youtube video, simply circle the video ID like this:
See this page:
 
'''<code><nowiki> <youtube>[ID code]</youtube></nowiki></code>'''
 
The video ['''ID code'''] can be found inside the URL of a Youtube video.
 
Example:
 
if the URL is as follows: '''https://www.youtube.com/watch?v=S4ypgbP2Jn4&app=desktop'''
 
The code to copy is '''S4ypgbP2Jn4''' (between '''v=''' and '''&''')
 
After inserting the following code:  


'''<code><nowiki> <youtube> S4ypgbP2Jn4 </youtube> </nowiki></code>'''
https://polyglotclub.com/wiki/Help/How-to-add-audio-files


the video appears as below:
== Videos ==
To add an '''embedded youtube video''' inside a lesson, click the '''EDIT CODE''' button.


<Youtube>S4ypgbP2Jn4</youtube>
Then, simply circle the video URL like this:


===Audio MP3 files===
'''<code><nowiki> <youtube>[video URL]</youtube></nowiki></code>'''


When writing a lesson to learn a language, it is cool to be able to add, next to a word, a small MP3 player to hear the pronunciation of that word.


Better an example than a long explanation:
===Example===


[[File:alligator.png]]
if the URL is as follows: '''https://www.youtube.com/watch?v=S4ypgbP2Jn4'''


'''Alligator'''
use the following code:


<player>alligator-english.mp3</player>
'''<code><nowiki> <youtube>https://www.youtube.com/watch?v=S4ypgbP2Jn4</youtube> </nowiki></code>'''


To know how to do this, read [[Help/How-to-add-audio-files|THIS PAGE]].
the video will appears as below:
<hr>
<youtube>S4ypgbP2Jn4</youtube>
<hr>


===Lists===
==Lists==


==== Bullet lists====
=== Bullet list===
<code><nowiki>*item 1</nowiki></code>
<code><nowiki>*item 1</nowiki></code>


Line 94: Line 223:
*item 1
*item 1
*item 2
*item 2
==== Bullet with 2====
 
=== Bullet list 2===
<code><nowiki>*item 1</nowiki></code>
<code><nowiki>*item 1</nowiki></code>


Line 103: Line 233:
**item 12
**item 12


====  Numbered List ====
===  Numbered List ===
<code><nowiki>:#item 1</nowiki></code>
<code><nowiki>:#item 1</nowiki></code>


Line 112: Line 242:
:#item 2
:#item 2


*[https://www.mediawiki.org/wiki/Help:Lists More information about lists]
===  Numbered List 2===
<code><nowiki>#item 1</nowiki></code>


===Headings===
<code><nowiki>##item 12</nowiki></code>


To organize your lesson, and for [https://en.wikipedia.org/wiki/Search_engineoptimization Search engine optimization], it is good to use different levels of headings: h2, h3...
<code><nowiki>#item 2</nowiki></code>


Use Heading2 (h2) and within each Heading2, you can use Headings3 (h3) and so on: Heading4, Heading5 etc...
<code><nowiki>##item 22</nowiki></code>


Do not use Heading1 because this heading is already used for the page title and we can have only one Heading1 per page.
The result is as followed:
#item 1
##item 12
#item 2
##item 21


For h2, use the following code :
'''<code>==Vocabulary== </code>'''


For h3, use the following code:
[https://www.mediawiki.org/wiki/Help:Lists More information about lists]


'''<code>===The farm animals===</code>'''
==HTML and CSS==
If you know html and css languages, you can do many things like in the following lesson:
* https://polyglotclub.com/wiki/Language/English/Culture/Find-the-Ideal-Penpal


===Tables===
==Create your own page title==
* See this page: https://polyglotclub.com/wiki/Help/Create-your-own-Page-Title


An easy way to create tables without having to use the wiki code which can be confusing is to:
==You have more questions? Check the FAQ==
* Read more answers and ask questions [[Language/Multiple-languages/Culture/How-to-contribute-to-wiki-lessons-(FAQ)|here]].


#Create the table in Excel
#Copy and Paste the table in the page with the Visual Editor mode (do not use the "Edit source" table but use the "Edit" table)
#Save the page
#Edit the page, this time, with the "Edit source" tab
#At the top of the table, add the following code, this will make your table much nicer
Replace the line :
<code>{|</code>
By the line :
<code>{| class="wikitable"</code>
You can also, create your table in Excel and use this [http://tools.wmflabs.org/excel2wiki/index.php free tool]
==Page Structures Example==
Here is an example of page structure:
{| class="wikitable"
  |
(image)
'''Vocabulary for animals in English''' (title of the page in bold)
'''<code>==Vocabulary==</code>'''(h2)
'''<code>===The farm animals===</code>'''(h3)
'''<code> ===Pets=== </code>'''(h3)
'''<code>==Expressions== </code>'''(h2)
'''<code>==Videos== </code>'''(h2)
|}
===Examples===
Here are examples of existing lessons to inspire you:
*[[Language/Japanese/Vocabulary/Family]]
*[[Language/French/Vocabulary/False-Friends]]


<hr>
{{Help-menu}}
{{Help-menu}}

Latest revision as of 15:33, 2 June 2022

Write a lesson: Why? How? FAQ
How to create a language learning lesson

The Wiki page editing is done thanks to the MediaWiki Engine, the software used by the famous Wikipedia.

What editor choose?[edit | edit source]

You have two options:

Visual Editor[edit | edit source]

If you are new at Wiki page editing, we recommend using the visual editor which is a WYSIWYG editor.

Click the Actions > Edit button.

Creating pages is intuitive with the various buttons to format the text.

Wiki Code[edit | edit source]

If you have a little more experience, we advise you to directly use the Wiki code because you have more formatting options.

Click the Actions > Edit Source button.

How to organize a lesson[edit | edit source]

How should you organize your lesson?

To organize your lesson, and for SEO (Search engine optimization), it is good to add title and different levels of headings.

Here is an example of page structure (using the Edit Source button)

(image)

<div class="pg_page_title">Vocabulary for animals in English</div> (Lesson title)

==Vocabulary==(level 1)

===The farm animals===(level 2)

===Pets=== (level 2)

==Expressions== (level 1)

==Videos== (level 1)

Here are examples of existing lessons to inspire you:


Lesson title[edit | edit source]

If you want to write a title for your lesson, USE the following code:

<div class="pg_page_title"> TITLE </div>


Important: do not use the heading level 1 code:

=TITLE= This heading is already used automatically for the page title (the page title is the same as the title in the URL) and we can have only have one Heading level 1 per page (for SEO reasons).

Heading level 2[edit | edit source]

Use the following code :

==Vocabulary==

Heading level 3[edit | edit source]

Use the following code:

===The farm animals===

How to create headings with the visual editor[edit | edit source]

Here is a video on how to create headings and automatically add a table of content:

https://www.youtube.com/watch?v=l2Ebiw4-OrQ

Tables[edit | edit source]

Here are easy ways to create tables without having to use the wiki code or the visual editor:

Create a table: Solution 1[edit | edit source]

  1. Create the table in Excel
  2. Copy and Paste the table in the page with the Visual Editor mode.
  3. Save the page
  4. Edit the page, this time, with the "Edit source" tab
  5. At the top of the table, add the following code, this will make your table much nicer

Replace the line : {| By the line : {| class="wikitable" Or by the line : {| class="wikitable sortable" if you want to make it sortable

Create a table: Solution 2[edit | edit source]

  1. Create your table in Excel
  2. Use this free tool to create the wiki code equivalent to your Excel table
  3. Edit the wiki page with the "Edit source" tab
  4. Paste the code

Update a table[edit | edit source]

  1. Copy the table from the html page
  2. Paste in Excel
  3. Edit your table in Excel

Then update the wiki page, using solution 1 or 2 above.

How to format the table header[edit | edit source]

The table header is a special row at the top of the table with the title of each column.

Here is how to create a table header:

Edit the page with the Edit source button:

  • replace the following wiki code (only the first line)  :

{| class="wikitable"

|header title 1

|header title 2

|-

  • with this code :

{| class="wikitable"

!header title 1

!header title 2

|-


You just have, ONLY on the first line, to replace the | by a !

Cool! you can also use HTML code 😉[edit | edit source]

If you prefer HTML, you can use it to create tables.

Don't forget to use the class="wikitable" in the table opening tag so the table will look nice.

<table class="wikitable">

 <tr>
   <td>ligne 1, column 1</td>
   <td>ligne 1, column 2</td>
 </tr>
 <tr>
   <td>ligne 2, column 1</td>
   <td>ligne 2, column 2</td>
   </tr>

</table>

Links[edit | edit source]

Internal links[edit | edit source]

To link to a page which URL is https://polyglotclub.com/wiki/Language/English/Grammar/To-be inside the Polyglot club wiki, use the following code:

[[Language/English/Grammar/To-be|different text]]

External links[edit | edit source]

To link to a page outside Polyglot club wiki.

[https://mediawiki.org MediaWiki]


Images[edit | edit source]

Example:

[[File:My_pic.png|thumb|none]] Align left

Onomatopoeias.png

[[File:My_pic.png|thumb]] Align right

[[File:My_pic.png|thumb|My Picture Caption]] with a caption

Voice Recordings (AUDIO, MP3 etc.)[edit | edit source]

See this page:

https://polyglotclub.com/wiki/Help/How-to-add-audio-files

Videos[edit | edit source]

To add an embedded youtube video inside a lesson, click the EDIT CODE button.

Then, simply circle the video URL like this:

<youtube>[video URL]</youtube>


Example[edit | edit source]

if the URL is as follows: https://www.youtube.com/watch?v=S4ypgbP2Jn4

use the following code:

<youtube>https://www.youtube.com/watch?v=S4ypgbP2Jn4</youtube>

the video will appears as below:



Lists[edit | edit source]

Bullet list[edit | edit source]

*item 1

*item 2

The result is as followed:

  • item 1
  • item 2

Bullet list 2[edit | edit source]

*item 1

**item 12

The result is as followed:

  • item 1
    • item 12

Numbered List[edit | edit source]

:#item 1

:#item 2

The result is as followed:

  1. item 1
  2. item 2

Numbered List 2[edit | edit source]

#item 1

##item 12

#item 2

##item 22

The result is as followed:

  1. item 1
    1. item 12
  2. item 2
    1. item 21


More information about lists

HTML and CSS[edit | edit source]

If you know html and css languages, you can do many things like in the following lesson:

Create your own page title[edit | edit source]

You have more questions? Check the FAQ[edit | edit source]

  • Read more answers and ask questions here.



Write a lesson: Why? How? FAQ