Difference between revisions of "Help:Wiki University VisualEditor--Links"

From FamilySearch Wiki
Jump to navigation Jump to search
VisualWikitext
m
m (Modified documentation per Visual Editor Upgrade)
 
(9 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
{{VisualEditor School}}{{VisualEditor Tutorial Sidebar}}
+
<div style="display:grid; grid-template-columns:1fr 1fr 2fr 2fr 2fr 2fr">
−
<div style="float:right; width:79%; margin-top:-35px">
+
<!--------------row 1-------------------------->
−
<table style="width:100%; ">
+
<!--tool bar--------------------------------------------------->
−
<tr>
+
{{VisualEditor School}}
−
<td style="font-size:14pt; font-family:arial;">[[Help:Wiki University VisualEditor--Text Styling|&lt;&lt; Previous Chapter]]</td>
+
<!----------------row 2---------------------------->
−
<td style="font-size:14pt; font-family:arial; text-align:right;">[[Help:Wiki University VisualEditor--Cite References|Next Chapter &gt;&gt;]] </td></tr>
+
<!-------------------menu-------------------------------->
−
</table>
+
<div style="grid-column:1/3; background-color:#FFEDCC; box-shadow:1px 1px 5px #888888">{{VisualEditor Tutorial Sidebar}}</div>
−
----
+
<!-----------------------main------------------------>
 +
<!-------------------------------chapters top row---------------------------------->
 +
<div style="grid-column:3/8; padding-left:0.5em">
 +
<!-------------------------------chapters top row---------------------------------->
 +
<div style="display:flex; justify-content:space-between; padding:10px; margin-bottom:-1em">
 +
<div style="font-size:1.3em">[[Help:Wiki University VisualEditor--Text Styling|<< Previous Chapter]]</div>
 +
<div style="text-align:right"><span style="background-color:orange; padding:5px; font-size:1.3em">[[Help:Wiki University VisualEditor--Cite References|Next Chapter >>]]</span></div>
 +
</div>
 +
<div style="margin-left:0.5em">
 +
<!-----------------------MAIN MATERIAL BELOW THIS LINE-------------------------------------------->
 
==Visual Editor toolbar==
 
==Visual Editor toolbar==
 
<div style="display:flex">
 
<div style="display:flex">
Line 19: Line 28:
 
<!------------------------------------LINKS------------------------------------------------------------>
 
<!------------------------------------LINKS------------------------------------------------------------>
 
<div style="flex:1; display:flex; align-items:center; justify-content:center; border:1px solid red">
 
<div style="flex:1; display:flex; align-items:center; justify-content:center; border:1px solid red">
−
<div style="display:flex; transform:rotate(135deg)"><div style="width:10px; height:5px; border:3px solid black; border-radius:8px"></div>
+
<div style="display:flex;">[[File:Link.png|50px]]
−
<div style="width:10px; height:5px; border:3px solid black; border-radius:8px; margin-left:-8px"></div>
 
 
</div>
 
</div>
 
</div>
 
</div>
Line 38: Line 46:
 
<div style="flex:1.5; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue">Insert<div style="margin-left:1vw; width:0; height:0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid gray"></div></div>
 
<div style="flex:1.5; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue">Insert<div style="margin-left:1vw; width:0; height:0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid gray"></div></div>
 
<!---------------------------------------------------------OMEGA----------------------------------------------------->
 
<!---------------------------------------------------------OMEGA----------------------------------------------------->
−
<div style="flex:0.8; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue"><span style="font-size:1.5vw">Ω</span></div>
+
<div style="flex:0.8; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue"><span style="font-size:2vw">Ω</span></div>
 
<!-------------------------------------------------------------------HELP----------------------------------------------------->
 
<!-------------------------------------------------------------------HELP----------------------------------------------------->
−
<div style="flex:4; display:flex; align-items:center; justify-content:flex-end; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue">
+
<div style="flex:3; display:flex; align-items:center; justify-content:flex-end; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue"></div>
−
<div style="display:flex; align-items:center; justify-content:center; border:3px solid black; width:20px; height:20px; border-radius:20px; font-size:1.5em; margin-right:10px">'''?'''</div>
+
<div style="flex:1; display:flex; align-items:center; justify-content:flex-end; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue">
 +
<div style="display:flex; align-items:center; justify-content:center; width:20px; height:20px; font-size:1.5em; margin-right:10px">'''?'''</div>
 
</div>
 
</div>
 
<div style="flex:1; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue">
 
<div style="flex:1; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue">
Line 51: Line 60:
 
</div>
 
</div>
 
<!-------------------------------------------------------------TO GO WIKITEXT--------------------------------------------->
 
<!-------------------------------------------------------------TO GO WIKITEXT--------------------------------------------->
−
<div style="flex:1; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue"><span style="font-size:1.3vw; font-weight:bold">[[ ]]</span></div>
+
<div style="flex:1; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue"><span style="font-size:1.3vw; font-weight:bold">[[File:VE Switch icon.png]]</span></div>
 
<!--------------------------------------------------------SAVE--------------------------------------------------------->
 
<!--------------------------------------------------------SAVE--------------------------------------------------------->
−
<div style="flex:2; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue; color:white; background-color:lightgray">Save page</div>
+
<div style="flex:2; display:flex; align-items:center; justify-content:center; border-right:1px solid lightgray; border-bottom:1px solid lightgray; border-top:1px solid lightblue; color:white; background-color:lightgray">Save changes...</div>
 
</div>
 
</div>
  
Line 67: Line 76:
  
 
<tr>
 
<tr>
−
<td style="border:1px solid lightgrey">
+
<td style="border:1px solid red">
−
<div style="display:flex; transform:rotate(135deg); padding:10px"><div style="width:10px; height:5px; border:3px solid black; border-radius:8px"></div>
+
<div style="display:flex; padding:5px; width:40px">[[File:Link.png]]</div></td>
−
<div style="width:10px; height:5px; border:3px solid black; border-radius:8px; margin-left:-8px"></div></td>
+
<td style="border:1px solid lightgrey; padding:5px; width:50px">Links</td>
−
<td style="border:1px solid lightgrey">Links</td>
+
<td style="border:1px solid lightgrey; padding:10px">[[File:VE Internal Link.PNG|300px|right]]
−
<td style="border:1px solid lightgrey">[[File:Visualeditor22.PNG|300px|right]]Click "Edit source" and highlight text you want to make either an internal or external link. The following drop down menu appears.  ''(Note: this menu might list possible links you may want to use depending on what you highlighted.)''
+
'''TO CREATE A LINK'''<br>
−
'''Internal links'''
+
* Click the '''Edit''' tab.
−
*"Search pages" tab is for selecting links to articles within the Wiki. Suggested articles might be shown. Otherwise, enter name of article you want to link to. ''(No double square brackets required as with Wikitext coding.)''
+
* Highlight the text you want to make into a link, then click the '''link icon'''.
−
'''Section of a page with Internal links'''
+
* ''Note: the text you highlighted is displayed in the search box.''
−
*If you want to link to a particular place on a page rather than the whole page, place a pound sign (#) after the title of the article and the exact name of the header as entered on the page after the pound sign. For example: McDonald County, Missouri Genealogy#County Courthouse. Again, no double square brackets are required as in wikitext.
+
* Select either the '''FamilySearch Wiki''' tab to create an <u>internal link</u> or the '''External site''' tab to create an <u>external link</u>.
−
'''External links'''
+
<br>
−
*"External link" tab is for entering the URL of the external link.  ''(No single square brackets required as with Wikitext coding)''.
+
'''INTERNAL LINK'''
−
'''To save links'''
+
* After clicking on the ''FamilySearch Wiki'' tab, enter the article title into the search box.
−
*Click "Done" when finished
+
* If you don't know the article title, enter a keyword and a list of suggested articles will be displayed in a drop down menu. Click on the article to which you want to link.
−
*Click "Save page" in the VisualEditor tool bar.
+
* Click '''Done''' to add the link.
−
*Fill in "Summary" on panel that appears and then "Save page."
+
* To save your changes, click '''Save changes...''' on the Visual Editor tool bar, enter a Summary description of your changes, then click on the Save changes again.
 +
<br>
 +
'''EXTERNAL LINK'''
 +
[[File:VE External Link.PNG|300px|right]]
 +
* After clicking on the ''External Site'' tab, enter the URL for the external link into the search box.
 +
* Click '''Done''' to add the link.
 +
* To save your changes, click '''Save changes...''' on the Visual Editor tool bar, enter a Summary description of your changes, then click on the Save changes again.
 +
<br>
 +
'''LINK to a Page Section'''<br>
 +
There are times you may want to, not only link to a page, but go to a specific section or header on that page. ''Note: this may be done for internal links but NOT external links.''
 +
* Click on the ''FamilySearch Wiki'' tab.
 +
* Enter the article title into the search box.   
 +
* Place a pound sign ('''#''') immediately after the article title.
 +
* Directly following the pound sign, add the "exact" '''header name''' to which you desire to link. 
 +
* Click '''Done''' and save your changes.  
 +
* For example: McDonald County, Missouri Genealogy<font color="blue">#County Courthouse</font color>.
 
</td>
 
</td>
 
</tr>
 
</tr>
Line 113: Line 137:
 
<div style="font-size:14pt; width:100%; height:30px; vertical-align:middle; background-color:lightgreen; ">Exercises</div>
 
<div style="font-size:14pt; width:100%; height:30px; vertical-align:middle; background-color:lightgreen; ">Exercises</div>
 
<div style="padding-top:12px; padding-left:10px; ">
 
<div style="padding-top:12px; padding-left:10px; ">
−
Create the following links using the Visual Editor:
+
In your Sandbox create the following links using the Visual Editor:
 
*Create an external link to "Wikipedia" using the word "Wikipedia."
 
*Create an external link to "Wikipedia" using the word "Wikipedia."
 
*Create an external link to "w3Schools.com" using the word "w3Schools."
 
*Create an external link to "w3Schools.com" using the word "w3Schools."
Line 123: Line 147:
  
 
</div>
 
</div>
−
</div> <!--BOTTOM links to next chapter and previous chapter--------------------------->  
+
</div>  
−
{| style="width:100%;"
+
<!---------------------------------END OF MATERIAL------------------------------------------->
−
|-
+
</div>
−
| <div style="font-size:14pt; font-family:arial;">[[Help:Wiki University VisualEditor--Text Styling|&lt;&lt; Previous Chapter]] </div>  
+
<!-------------------------------chapters bottom---------------------------------------------------->
−
| <div style="font-size:14pt; font-family:arial; text-align:right;">[[Help:Wiki University VisualEditor--Cite References|Next Chapter &gt;&gt;]] </div>
+
<div style="clear:both"></div>
−
|}
+
<div style="display:flex; justify-content:space-between; padding:10px">
−
 
+
<div style="font-size:1.3em">[[Help:Wiki University VisualEditor--Text Styling|<< Previous Chapter]]</div>
−
<br>  
+
<div style="text-align:right"><span style="background-color:orange; padding:5px; font-size:1.3em">[[Help:Wiki University VisualEditor--Cite References|Next Chapter >>]]</span></div>
 +
</div>
 +
{{reflist}}
 
</div>
 
</div>
−
 
+
__NOTOC__
−
__NOTOC__
+
[[Category:Wiki Lessons]]
−
[[Category:Wikitext Lessons]]
 

Latest revision as of 17:41, 18 November 2020

Visual Editor toolbar[edit | edit source]

UndoVE.jpg
RedoVE.jpg
Paragraph
A
Link.png
Cite
Insert
Ω
?
VE Switch icon.png
Save changes...


Links[edit | edit source]

Link.png
 Links
VE Internal Link.PNG

TO CREATE A LINK

  • Click the Edit tab.
  • Highlight the text you want to make into a link, then click the link icon.
  • Note: the text you highlighted is displayed in the search box.
  • Select either the FamilySearch Wiki tab to create an internal link or the External site tab to create an external link.


INTERNAL LINK

  • After clicking on the FamilySearch Wiki tab, enter the article title into the search box.
  • If you don't know the article title, enter a keyword and a list of suggested articles will be displayed in a drop down menu. Click on the article to which you want to link.
  • Click Done to add the link.
  • To save your changes, click Save changes... on the Visual Editor tool bar, enter a Summary description of your changes, then click on the Save changes again.


EXTERNAL LINK

VE External Link.PNG
  • After clicking on the External Site tab, enter the URL for the external link into the search box.
  • Click Done to add the link.
  • To save your changes, click Save changes... on the Visual Editor tool bar, enter a Summary description of your changes, then click on the Save changes again.


LINK to a Page Section
There are times you may want to, not only link to a page, but go to a specific section or header on that page. Note: this may be done for internal links but NOT external links.

  • Click on the FamilySearch Wiki tab.
  • Enter the article title into the search box.
  • Place a pound sign (#) immediately after the article title.
  • Directly following the pound sign, add the "exact" header name to which you desire to link.
  • Click Done and save your changes.
  • For example: McDonald County, Missouri Genealogy#County Courthouse.

Try these out[edit | edit source]

Tests.gif
Quick Quiz
  • The "Search pages" tab is for entering external links.
A. True
B. False
  • The "External link" tab in the drop down menu is for external links.
A. True
B. False
  • You can only use one of the suggested internal links when you click "Search pages"
A. True
B. False


Exercises

In your Sandbox create the following links using the Visual Editor:

  • Create an external link to "Wikipedia" using the word "Wikipedia."
  • Create an external link to "w3Schools.com" using the word "w3Schools."
  • Create an internal link to "Kentucky, United States Genealogy" using the word "Kentucky."
  • Create an internal link to "Kentucky, United States Genealogy" and to the section "Kentucky Information" using the words "Genealogical information for Kentucky."
Retrieved from "https://wwwp.familysearch.org/wiki/en/index.php?title=Help:Wiki_University_VisualEditor--Links&oldid=4149412"