Difference between revisions of "Manual:VisualEditor"
[unchecked revision] | [quality revision] |
(Tag: 2017 source edit) |
(Tag: 2017 source edit) |
BlueSpice uses the MediaWiki extension VisualEditor as editing tool. This sophisticated editor supports all common edit tasks that you can expect in a wiki environment.
Contents
- 1 What is VisualEditor?
- 2text Text editing
- 3 insert external content
- 4 Typical Wiki!
- 5 MediaWiki Reference 6 Hints and Tips
- 6.1 text formatting 6
- Pasting content from your clipboard (ctrl+shift+v)
- 4 Shortcuts
- 5 Inserting other content
- 6 Wiki-specific content
- 7 Switching between edit modes
- 8 MediaWiki reference
- 9 Hints and tips 7
- 10 Troubleshooting: Visual editing is disabled
What is VisualEditor?[edit | edit source]
One of the most important tools for inserting and formatting content in BlueSpice is VisualEditor. This visual editor is based on the MediaWiki extension VisualEditor. With this sophisticated editor pages can be quickly and clearly filled with a variety of content.
When creating or editing a page, you're in visual edit mode right now. If you are familiar with the code language of MediaWiki ("WikiText"), you can easily switch over using the "Switch Editor" function:
The visual editor is optimized for editing wiki pages. Important characteristics and functions are:
- Page structuring with headings.
- Consistent text formatting.
- Linking of contents.
- Inserting special content (files/media, tables, templates, magic words)
- Adjusting page options.
Text editing[edit | edit source]
Typical text formatting options such as bold, italics, or textcolor</ span> are already possible during text inputtext color are available as a context menu. When you format highlight text with the mouse, you will see a mini menu with the most important common formatting elements . With one click the desired formatting can be selected. This is especially fast, if you want to change the text color, for example:
The mini menu appears only in the text flow, not when an entire paragraph is highlighted. For example, note for bullet points, that you select only the text itself and not the whole line. Otherwise, paragraph formatting will be selected "behind the scenes" and the mini menu will not appear. |
appears. For example, you can apply a different text color.
Pasting content from your clipboard (ctrl+shift+v)[edit | edit source]
If you paste content from your clipboard (e.g., copied from MS Word or MS Excel), you usually also paste many unnecessary formatting tags from the original application. To avoid, this you should paste the content as plaintext.
If you already pasted text which resulted in undesirable formatting, you can use the undo function in VisualEditor to remove the content again if you have not yet saved the page or switched between visual and source editing mode.
To paste content as plain text instead, use the shortcut ctrl+shift+v.
Shortcuts[edit | edit source]
If you want to apply multiple formatting options at the same time, shortcuts are often the quickest way. For example, to show text in bold and italic text, highlight the text and press Ctrl+b (for English, "bold") and Ctrl+i (for "italics"). Even a link can be quickly pasted via inserted by pressing Ctrl+k. Pressing Ctrl+b again will cancel the bold. Multiple formatting formats can be removed after text selection using with Ctrl+M combinedm.
All editor functions for which there are available keyboard shortcuts are marked accordingly :
insert externalin VisualEditor next to each menu item.
Note: For a list of all available shortcuts, click on "Keyboard shortcuts" in the Visual Editor help menu (the question mark menu item).
Inserting other content[edit | edit source]
Many typical page elements such as images, files and tables can be integrated into your page via from the "Insert" menu.
- File formats with a preview option: jpg/jpeg, png, gif, pdf
- File formats without preview option are always inserted as links (e.g., Microsoft Office formats)
- Files can be connected with namespaces and categories
If you want to learn more about inserting these elements, go to the appropriate following help pagepages:
Typical Wiki!-specific content[edit | edit source]
Some functions in the "Insert" menu are little known from traditional word processing, but are quite typical for working with a wiki. Therefore, you will be they are briefly introduced here. You can immerse yourself deeper Find more information on the individual pageshelp pages here in the helpdesk or at mediawiki.org:
- Comment: Add comments to the page. These are only visible in the source code.
- Gallery: A simple picture gallery can support many process flows.
- Magic word: Wiki features such as signature, word counter, category tree or even process diagrams with draw.io can be integrated as a "magic word".
- Your signature: Only works on pages that allow signatures. Pages in the Namespace "Pages" are not included.
- Gallery: A simple picture gallery can meaningfully support many process flows.
- Codeblock: Programming code is displayed here in clean code blocks, optionally with linesline numbers.
- Itemization References list:
- Chemical formula: The formula rendering uses an external service via Wikimedia's REST API.
- Math formula: An editor opens for entering a mathematical formula. More info on MediaWiki
Switching between edit modes[edit | edit source]
When creating or editing a page, the page loads in visual editing mode. If you are familiar with the code language of MediaWiki ("Wikitext"), you can easily switch to source editing mode using the "Switch editor" button:
MediaWiki reference[edit | edit source]
Since the visual editor VisualEditor is a standard MediaWiki extension, you can also read a complete documentation of functionality on MediaWiki. Here in the BlueSpice Helpdesk, we only give only short some hints and tips for using the editor.
Hints and Tipstips[edit | edit source]
The visual editor VisualEditor is optimized for editing web pages. That's why it has exactly those the features that are often needed to create a wiki page again and again. The uniform formatting by VisualEditor thus consistent formatting of content supports the readability of your wiki content.
The BlueSpice Editor offers the following options:
text Text formatting[edit | edit source]
Text formatting | |
---|---|
Undo function | Left arrow: Undo last action (greyed out: there is no last action yet)
Right arrow: Restore last action (greyed out: there's nothing to restore yet) |
Format Paragraph formatting | Here text can be defined as heading or specific paragraph type. Note: If you work in a table, the options will change accordingly (content cell and header cell):
|
Character formatting Style text | If no text has been selected before clicking on the " A" button and on a button, the text will be formatted from the current position of the cursor.
(More Info on MediaWikiat mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Getting_Started:_The_VisualEditor-Toolbar]) |
Insert hyperlink | If no text was selected before the hyperlink dialog was opened, the link will be generated with a number:
[1] To subsequently change the hyperlink description, just click on the link to open the edit menu. In a table, you may need to double-click the cell first and then click the hyperlink again. |
quote cite | The citation menu is used to insert references (also called itemizations or footnotes) within the text. |
Block formatting Structure |
Insert special content[edit | edit source]
Paste Special Content | |
---|---|
Insert menu | Use the "insert" menu to insert various media (images, videos) and text formats: |
media | Inserting pictures and videos |
templates | Include Template a template in the page. |
tables | Tables are an important tool for formatting pages in an appealing way. We have many Tips for Using Tables Properly. tabular page content. |
comment | Comments are not visible to readers, but only in edit mode. A comment can be inserted anywhere on a page. The comment can be edited by clicking on it.
|
Gallery | |
Magic word | With a "magic word" you can include certain variables or so-called behavioral switches in your page. For example, you can display the word count:
Overview of all Magic Words in the visual editor. |
Your signature | This option can only be used in discussions. Hereby It allows to add a signature at any point of a discussion the own signature can be added. |
Code block | With code block various code examples can be entered, like e.g. in HTML syntax. The code is then displayed properly formatted:
1
<span
<span style="color: red">red >redtext< text</span> span> |
Itemization Refernces list | |
Chemical formula |
The formula rendering uses an external service via Wikimedia's REST API.
|
Math formula | It opens an editor for entering a mathematical formula.
More [info on MediaWiki] |
Special Characters
|
Page options
Page Options | ||
---|---|---|
Options menu | The options menu allows editing of all page settings. options | |
Options | This button allows the page settings and page information to be updated simultaneously within a dialog box. | |
Categories | Here you divide assign the page into the desired to one or more categories Categories. The page will appear accordingly on all linked category pages. | |
Page Settings | Page redirection: When the page is redirected, the content of the page is no longer displayed, but the target page is loaded directly.
|
|
Advanced Settings
languages |
||
Used templates | Languages | |
Templates used | ||
View as right-to-left | Support for languages that are read from right to left. Clicking this button right-side formats the page text. Click again to set the text flush left. | |
Search Find and replace | Words or characters can be searched and replaced directly on the page. The "Undo" button can be used to cancel the change. |
Troubleshooting: Visual editing is disabled[edit | edit source]
If you only see code editing, please contact an administrator of your wiki. The following settings must be checked in this case:
- Global setting settings via the configuration manager
- Namespace management settings
- Parsoid service on the server
==What is VisualEditor?== One of the most important tools for inserting and formatting content in BlueSpice is VisualEditor. This visual editor is based on the MediaWiki extension VisualEditor. With this sophisticated editor pages can be quickly and clearly filled with a variety of content. When creating or editing a page, you're in visual edit mode right now. If you are familiar with the code language of MediaWiki ("WikiText"), you can easily switch over using the "Switch Editor" function:<br /> [[File:Manual:editing.png|250x250px]] ==textBlueSpice uses the MediaWiki extension VisualEditor as editing tool. This sophisticated editor supports all common edit tasks that you can expect in a wiki environment. ==What is VisualEditor?== <section begin="training" /><div class="training"> [[File:Manual:ve-EN.png|alt=VisualEditor|center|thumb|650x650px|VisualEditor]] The visual editor is optimized for editing wiki pages. Important characteristics and functions are: #'''Page structuring''' with headings. #Consistent '''text formatting'''. #'''Linking''' of contents. #'''Inserting special content''' (files/media, tables, templates, magic words) #Adjusting '''page options'''. </div><section end="training" /> ==Text editing== Typical text formatting options such as '''bold''', ''italics'', or <span class="col-turquoise">textcolor</ span> text color</span> are already possible during text input. When you format text with the mouse, you will see a mini menu with the most important formatting elements. With one click the desired formatting can be selected. This is especially fast, if you want to change the text color, for example: [[File:BlueSpice 3.1 - Notable Changes - Text colors.png]] {{Hint|text=The mini menu appears only in the text flow, not when an entire paragraph is highlighted. For example, note for bullet points, that you select only the text itself and not the whole line. Otherwise, paragraph formatting will be selected "behind the scenes" and the mini menu will not appear.}} available as a context menu. When you highlight text, a menu with common formatting elements appears. For example, you can apply a different text color. <br /> [[File:BlueSpice_3.1_-_Notable_Changes_-_Text_colors.png|alt=Applying text color|center|thumb|Applying text color]]<br /> ==Pasting content from your clipboard (ctrl+shift+v)== [[File:Manual:error.png|alt=Undo|thumb|112x112px|Undo]] If you paste content from your clipboard (e.g., copied from MS Word or MS Excel), you usually also paste many unnecessary formatting tags from the original application. To avoid, this you should paste the content as plaintext. If you already pasted text which resulted in undesirable formatting, you can use the undo function in VisualEditor to remove the content again if you have not yet saved the page or switched between visual and source editing mode. To paste content as plain text instead, use the shortcut '''ctrl+shift+v'''. ==Shortcuts== If you want to apply multiple formatting options at the same time, shortcuts are often the quickest way. For example, to show text in bold and italic text, highlight the text and press ''Ctrl+b'' (for English, "'''bold'''") and ''Ctrl+i'' (for "''italics''"). Even a link can be quickly pasted via Ctrl+k. Pressing Ctrl+binserted by pressing ''Ctrl+k''. Pressing ''Ctrl+b'' again will cancel the bold. Multiple formattingformats can be removed after text selection using with ''Ctrl+M combinedm''. All editor functions for which there are available keyboard shortcuts are marked accordingly: [[File:Manual:editing tools.png|350x350px]] ==insert external in VisualEditor next to each menu item. <br /> [[File:Manual:editing_tools.png|alt=Menu items with shortcuts|center|thumb|350x350px|Menu items with shortcuts]] <br /> {{Box Note|boxtype=note|Note text=For a list of all available shortcuts, click on "Keyboard shortcuts" in the Visual Editor help menu (the question mark menu item).}} ==Inserting other content== Many typical page elements such as images, files and tables can be integrated into your page viafrom the "''Insert"'' menu. <section begin="training-medien" /><div class="training anwender" /> *File formats with a preview option: jpg/jpeg, png, gif, pdf *File formats without preview option are always inserted as links (e.g., Microsoft Office formats) *Files can be connected with namespaces and categories <section end="training-medien" /> If you want to learn more about inserting these elements, go to the appropriatefollowing help page: * pages: *[[VisualEditor/Images|Images]] *[[VisualEditor / /Files | Files (PDF, xls, doc, ...)]] *[[Visual Editor / Tables | Tables]] *[[Template|Templates ==Typical Wiki!]] ==Wiki-specific content== Some functions in the "Insert" menu are little known from traditional word processing, but are quite typical for working with a wiki. Therefore, you will be they are briefly introduced here. You can immerse yourself deeper on the individual pagesFind more information on the help pages here in the helpdesk or at mediawiki.org: *'''Comment:''' Add comments to the page. These are only visible in the source code. *'''Magic word[[mediawikiwiki:Help:VisualEditor/User_guide#Editing_media_galleries|Gallery]]:''' A simple picture gallery can support many process flows. *'''[[Manual:MagicWords|Magic word]]:''' Wiki features such as signature, word counter, category tree or even process diagrams with draw.io can be integrated as a "magic word". *'''Your signature:''' Only works on pages that allow signatures. Pages in the Namespace "Pages" are not included. *'''Gallery:''' A simple picture gallery can meaningfully support many process flows. *'''Codeblock:''' Programming code is displayed here in clean code blocks, optionally with lines. *'''Itemizationline numbers. *'''References list:''' *'''Chemical formula:''' *'''Math formulaThe formula rendering uses an external service via Wikimedia's REST API. *'''[[mediawikiwiki:Help:VisualEditor/User_guide/en#Editing_mathematical_formulae|Math formula]]:''' An editor opens for entering a mathematical formula. [[mediawikiwiki:Help:VisualEditor/User_guide/en#Editing_mathematical_formulae|More info on MediaWiki]] ==MediaWiki Reference== Since the visual editor ==Switching between edit modes== When creating or editing a page, the page loads in visual editing mode. If you are familiar with the code language of MediaWiki ("Wikitext"), you can easily switch to source editing mode using the "Switch editor" button: [[File:Manual:editing.png|250x250px|link=https://en.wiki.bluespice.com/wiki/File:Manual:editing.png]] <br /> ==MediaWiki reference== Since VisualEditor is a standard MediaWiki extension, you can also read a [[mediawikiwiki:https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/en|complete documentation of functionality on MediaWiki]]. . Here in the BlueSpice Helpdesk, we only give only short some hints and tips for using the editor. ==Hints and Tips== The visual editor tips== VisualEditor is optimized for editing web pages. That's why it has exactly thosethe features that are often needed to create a wiki page again and again. The uniform formatting by VisualEditor thus. The consistent formatting of content supports the readability of your wiki content. The BlueSpice Editor offers the following options: ===text===Text formatting=== {| class="wikitable" |- ! colspan="2" |'''Text formatting''' |- |Undo function [[File:Manual:error.png|frameless|112x112px]] |Left arrow: Undo last action (greyed out: there is no last action yet) Right arrow: Restore last action (greyed out: there's nothing to restore yet) |- |Format Paragraph formatting [[File:Manual:paragraph.png|frameless|162x162px]] |Here text can be defined as heading or specific paragraph type. ''Note:'' If you work in a [[Visual Editor / Tables|table]], the options will change accordingly (content cell and header cell):[[File:Manual:content cell.png|alt=screenshot: content cell|left|frameless|183x183px|alternative-text=VisualEditor-paragraph2]]<br /> |- |Character formattingStyle text [[File:Manual:VE character formatting.png]] |If no text has been selected before clicking on the "''''' A'''''" button and on a button, the text will be formatted from the current position of the cursor. ([[mediawikiwiki:https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Getting_Started:_The_VisualEditor-Toolbar| More Info on MediaWiki]]) |- |Insert hyperlinkat mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Getting_Started:_The_VisualEditor-Toolbar]]) |- |Insert hyperlink [[File:Manual:VE Insert hyperlink.png]]<br /> |If no text was selected before the hyperlink dialog was opened, the link will be generated with a number: [Httpshttps://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/de#Erste_Schritte:_Die_VisualEditor-Werkzeugleiste] To subsequently change the hyperlink description, just click on the link to open the edit menu. In a table, you may need to double-click the cell first and then click the hyperlink again. |- |quote cite [[File:Manual:VE cite.png]] |The citation menu is used to insert references (also called itemizations or footnotes) within the text. |- |Block formatting Structure [[File:Manual:VE structure new.png]] | |} <br /> ===Insert special content=== {| class="wikitable" |- ! colspan="2" |'''Paste Special Content''' |- |Insert menu [[File:Manual:insert.png|frameless|102x102px]] |Use the "insert" menu to insert various media (images, videos) and text formats: |- |media [[File:Manual:VE media.png]] |Inserting pictures and videos ([[mediawikiwiki:https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Getting_Started:_The_VisualEditor-ToolbarHelp:VisualEditor/User_guide/en#Editing_images_and_other_media_files| Details on MediaWiki]]) |- |templates |Include [[Template|Template[[File:Manual:VE template.png]] |Include a [[Template|template]] in the page. |- |tables |Tables[[File:Manual:VE table.png]] |[[Visual Editor / Tables|Tables]] are an important tool for formatting pages in an appealing way. We have many [[Tables|Tips for Using Tables Properly]]. |- |comment |tabular page content. |- |comment [[File:Manual:VE comment.png]] |Comments are not visible to readers, but only in edit mode. A comment can be inserted anywhere on a page. The comment can be edited by clicking on it. And this is what a comment looks like:[[File:Manual:comment.png|alt=screenshot: comment|left|frameless|186x186px|alternativetext=VisualEditor-comment]]<br /> |- |Gallery | |- |Magic word [[File:Manual:VE gallery.png]] | |- |Magic word [[File:Manual:VE magic word.png]] |With a "magic word" you can include certain variables or so-called behavioral switches in your page. For example, you can display the word count: <!-- insert word count here --> <br /> [[MagicWords|Learn more about the magic wordfunctionMagic Word]]". Overview of all [[SmartListManual:Extension/BlueSpiceSmartList|Magic Words in the visual editor]].<!-- more info needed --> |- |Your signature [[File:Manual:VE your signature.png]] |This option can only be used in discussions. Hereby [[discussion/ signature|It allows to add a signature at any point of a discussion]] the own signature can be added. |- |Code block |. |- |Code block [[File:Manual:VE code block.png|150x150px]] |With code block various code examples can be entered, like e.g. in HTML syntax. The code is then displayed properly formatted: <br /><syntaxhighlight lang="html" line="1"><pre> <span style="color: red">red text</span> </syntaxhighlight> |- |Itemization list | |- |Chemical formula |<!-- Received error message --> |- |Math formula |</pre> |- |Refernces list [[File:Manual:VE refernces list.png|150x150px]] <br /> | |- |Chemical formula [[File:Manual:VE chemical formula.png]] |The formula rendering uses an external service via Wikimedia's REST API.<br /> |- |Math formula [[File:Manual:VE math formula.png|150x150px]] |It opens an editor for entering a mathematical formula. [[mediawikiwiki:https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Editing_mathematical_formulae|More info on MediaWiki]] |- |Special Characters | |}<br />page[[File:Manual:VE special characters.png]] <br /> | |}<br />Page options {| class="wikitable" |- ! colspan="2" |'''Page Options''' |- |Options menu[[File:Manual:tool.png|alt=screenshot|left|frameless|69x69px|alternative text=VisualEditor-options]] |The options menu allows editing of all page settings. |- |optionsOptions [[File:Manual:VE options.png]] |This button allows the page settings and page information to be updated simultaneously within a dialog box. |- |Categories |Here you divide the page into the desired [[Add categories [[File:Manual:VE categories.png]] |Here you assign the page to one or more categories [[Category| Categories]]. The page will appear accordingly on all linked category pages. |- |Page Settings [[File:Manual:VE page settings.png]] |Page redirection: When the page is redirected, the content of the page is no longer displayed, but the target page is loaded directly. This setting can also be used to display or remove the table of contents at the top of the page. The table of contents is automatically generated by the headings on the page. Starting with When a page has more than three headings, the table of contents appears automatically by default. |- |Advanced Settings | |- |languages | |- |Used templates [[File:Manual:VE advanced settings.png]] | |- |Languages [[File:Manual:languages.png]] | |- |Templates used [[File:Manual:VE templates used.png]] | |- |View as right-to-left [[File:Manual:VE view as right-to-left.png]] |Support for languages that are read from right to left. Clicking this button right-side formats the page text. Click again to set the text flush left. |- |SearchFind and replace [[File:Manual:VE find and replace.png]] |Words or characters can be searched and replaced directly on the page. The "Undo" button can be used to cancel the change. |} ==Troubleshooting: Visual editing is disabled== If you only see code editing, please contact an administrator of your wiki. The following settings must be checked in this case: *Global settingsettings via the configuration manager *Namespace management settings *Parsoid service on the server <br /> <!-- Document Info --><!-- User story: As a maintainer, I'd like to understand all the features of VisualEditor so I can assist wiki authors in using them. --><!-- Information type: Concept --> [[en:{{FULLPAGENAME}}]] [[de:VisualEditor]] [[Category:Editing]]
(28 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
+ | BlueSpice uses the MediaWiki extension VisualEditor as editing tool. This sophisticated editor supports all common edit tasks that you can expect in a wiki environment. | ||
+ | |||
==What is VisualEditor?== | ==What is VisualEditor?== | ||
− | |||
− | + | <section begin="training" /><div class="training"> | |
− | [[File:Manual: | + | [[File:Manual:ve-EN.png|alt=VisualEditor|center|thumb|650x650px|VisualEditor]] |
+ | |||
+ | The visual editor is optimized for editing wiki pages. Important characteristics and functions are: | ||
+ | |||
+ | #'''Page structuring''' with headings. | ||
+ | #Consistent '''text formatting'''. | ||
+ | #'''Linking''' of contents. | ||
+ | #'''Inserting special content''' (files/media, tables, templates, magic words) | ||
+ | #Adjusting '''page options'''. | ||
+ | </div><section end="training" /> | ||
+ | |||
+ | ==Text editing== | ||
+ | Typical text formatting options such as '''bold''', ''italics'', or <span class="col-turquoise">text color</span> are available as a context menu. When you highlight text, a menu with common formatting elements appears. For example, you can apply a different text color. | ||
+ | <br /> | ||
+ | [[File:BlueSpice_3.1_-_Notable_Changes_-_Text_colors.png|alt=Applying text color|center|thumb|Applying text color]]<br /> | ||
+ | |||
+ | ==Pasting content from your clipboard (ctrl+shift+v)== | ||
+ | [[File:Manual:error.png|alt=Undo|thumb|112x112px|Undo]] | ||
+ | If you paste content from your clipboard (e.g., copied from MS Word or MS Excel), you usually also paste many unnecessary formatting tags from the original application. To avoid, this you should paste the content as plaintext. | ||
+ | |||
+ | If you already pasted text which resulted in undesirable formatting, you can use the undo function in VisualEditor to remove the content again if you have not yet saved the page or switched between visual and source editing mode. | ||
− | == | + | To paste content as plain text instead, use the shortcut '''ctrl+shift+v'''. |
− | + | ==Shortcuts== | |
+ | If you want to apply multiple formatting options at the same time, shortcuts are often the quickest way. For example, to show text in bold and italic, highlight the text and press ''Ctrl+b'' (for "'''bold'''") and ''Ctrl+i'' (for "''italics''"). Even a link can be quickly inserted by pressing ''Ctrl+k''. Pressing ''Ctrl+b'' again will cancel the bold. Multiple formats can be removed after text selection with ''Ctrl+m''. | ||
− | + | All available keyboard shortcuts are marked accordingly in VisualEditor next to each menu item. | |
− | + | <br /> | |
+ | [[File:Manual:editing_tools.png|alt=Menu items with shortcuts|center|thumb|350x350px|Menu items with shortcuts]] | ||
+ | <br /> | ||
− | + | {{Box Note|boxtype=note|Note text=For a list of all available shortcuts, click on "Keyboard shortcuts" in the Visual Editor help menu (the question mark menu item).}} | |
− | + | ==Inserting other content== | |
+ | Many typical page elements such as images, files and tables can be integrated into your page from the ''Insert'' menu. | ||
+ | <section begin="training-medien" /><div class="training anwender" /> | ||
− | + | *File formats with a preview option: jpg/jpeg, png, gif, pdf | |
− | + | *File formats without preview option are always inserted as links (e.g., Microsoft Office formats) | |
+ | *Files can be connected with namespaces and categories | ||
+ | <section end="training-medien" /> | ||
− | If you want to learn more about inserting these elements, go to the | + | If you want to learn more about inserting these elements, go to the following help pages: |
− | * [[VisualEditor/Images|Images]] | + | *[[VisualEditor/Images|Images]] |
− | *[[VisualEditor / Files | Files (PDF, xls, doc, ...)]] | + | *[[VisualEditor/Files | Files (PDF, xls, doc, ...)]] |
*[[Visual Editor / Tables | Tables]] | *[[Visual Editor / Tables | Tables]] | ||
− | *Templates | + | *[[Template|Templates]] |
− | == | + | ==Wiki-specific content== |
− | Some functions in the "Insert" menu are little known from traditional word processing, but are quite typical for working with a wiki. Therefore, | + | Some functions in the "Insert" menu are little known from traditional word processing, but are quite typical for working with a wiki. Therefore, they are briefly introduced here. Find more information on the help pages here in the helpdesk or at mediawiki.org: |
*'''Comment:''' Add comments to the page. These are only visible in the source code. | *'''Comment:''' Add comments to the page. These are only visible in the source code. | ||
− | *'''Magic word:''' Wiki features such as signature, word counter, category tree or even process diagrams with draw.io can be integrated as a "magic word". | + | *'''[[mediawikiwiki:Help:VisualEditor/User_guide#Editing_media_galleries|Gallery]]:''' A simple picture gallery can support many process flows. |
+ | *'''[[Manual:MagicWords|Magic word]]:''' Wiki features such as signature, word counter, category tree or even process diagrams with draw.io can be integrated as a "magic word". | ||
*'''Your signature:''' Only works on pages that allow signatures. Pages in the Namespace "Pages" are not included. | *'''Your signature:''' Only works on pages that allow signatures. Pages in the Namespace "Pages" are not included. | ||
− | + | *'''Codeblock:''' Programming code is displayed here in clean code blocks, optionally with line numbers. | |
− | *'''Codeblock:''' Programming code is displayed here in clean code blocks, optionally with | + | *'''References list:''' |
− | *''' | + | *'''Chemical formula:''' The formula rendering uses an external service via Wikimedia's REST API. |
− | *'''Chemical formula:''' | + | *'''[[mediawikiwiki:Help:VisualEditor/User_guide/en#Editing_mathematical_formulae|Math formula]]:''' An editor opens for entering a mathematical formula. |
− | *''' | ||
− | == | + | ==Switching between edit modes== |
− | + | When creating or editing a page, the page loads in visual editing mode. If you are familiar with the code language of MediaWiki ("Wikitext"), you can easily switch to source editing mode using the "Switch editor" button: | |
− | Here in the BlueSpice Helpdesk we give | + | [[File:Manual:editing.png|250x250px|link=https://en.wiki.bluespice.com/wiki/File:Manual:editing.png]] |
+ | <br /> | ||
+ | ==MediaWiki reference== | ||
+ | Since VisualEditor is a standard MediaWiki extension, you can also read a [https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/en|complete documentation of functionality on MediaWiki]. Here in the BlueSpice Helpdesk, we only give some hints and tips for using the editor. | ||
− | ==Hints and | + | ==Hints and tips== |
− | + | VisualEditor is optimized for editing web pages. That's why it has exactly the features that are often needed to create a wiki page. The consistent formatting of content supports the readability of your wiki content. | |
− | + | ===Text formatting=== | |
− | |||
− | === | ||
{| class="wikitable" | {| class="wikitable" | ||
|- | |- | ||
Line 58: | Line 87: | ||
Right arrow: Restore last action (greyed out: there's nothing to restore yet) | Right arrow: Restore last action (greyed out: there's nothing to restore yet) | ||
|- | |- | ||
− | |Paragraph | + | |Format Paragraph |
[[File:Manual:paragraph.png|frameless|162x162px]] | [[File:Manual:paragraph.png|frameless|162x162px]] | ||
|Here text can be defined as heading or specific paragraph type. | |Here text can be defined as heading or specific paragraph type. | ||
− | ''Note:'' If you work in a [[table]], the options will change accordingly (content cell and header cell):[[File:Manual:content cell.png|alt=screenshot: content cell|left|frameless|183x183px|alternative-text=VisualEditor-paragraph2]]<br /> | + | ''Note:'' If you work in a [[Visual Editor / Tables|table]], the options will change accordingly (content cell and header cell):[[File:Manual:content cell.png|alt=screenshot: content cell|left|frameless|183x183px|alternative-text=VisualEditor-paragraph2]]<br /> |
|- | |- | ||
− | | | + | |Style text |
+ | [[File:Manual:VE character formatting.png]] | ||
|If no text has been selected before clicking on the "''''' A'''''" button and on a button, the text will be formatted from the current position of the cursor. | |If no text has been selected before clicking on the "''''' A'''''" button and on a button, the text will be formatted from the current position of the cursor. | ||
− | ([ | + | ([https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Getting_Started:_The_VisualEditor-Toolbar More Info at mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Getting_Started:_The_VisualEditor-Toolbar]]) |
|- | |- | ||
− | |Insert hyperlink<br /> | + | |Insert hyperlink |
+ | [[File:Manual:VE Insert hyperlink.png]]<br /> | ||
|If no text was selected before the hyperlink dialog was opened, the link will be generated with a number: | |If no text was selected before the hyperlink dialog was opened, the link will be generated with a number: | ||
− | [ | + | [https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/de#Erste_Schritte:_Die_VisualEditor-Werkzeugleiste] |
To subsequently change the hyperlink description, just click on the link to open the edit menu. In a table, you may need to double-click the cell first and then click the hyperlink again. | To subsequently change the hyperlink description, just click on the link to open the edit menu. In a table, you may need to double-click the cell first and then click the hyperlink again. | ||
|- | |- | ||
− | | | + | |cite |
+ | [[File:Manual:VE cite.png]] | ||
|The citation menu is used to insert references (also called itemizations or footnotes) within the text. | |The citation menu is used to insert references (also called itemizations or footnotes) within the text. | ||
|- | |- | ||
− | | | + | |Structure |
+ | [[File:Manual:VE structure new.png]] | ||
+ | |||
| | | | ||
|} | |} | ||
Line 94: | Line 128: | ||
|- | |- | ||
|media | |media | ||
+ | [[File:Manual:VE media.png]] | ||
|Inserting pictures and videos | |Inserting pictures and videos | ||
− | ([ | + | ([https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Getting_Started:_The_VisualEditor-ToolbarHelp:VisualEditor/User_guide/en#Editing_images_and_other_media_files Details on MediaWiki]]) |
|- | |- | ||
|templates | |templates | ||
− | |Include [[Template| | + | [[File:Manual:VE template.png]] |
+ | |Include a [[Template|template]] in the page. | ||
|- | |- | ||
|tables | |tables | ||
− | |Tables are an important tool for formatting | + | [[File:Manual:VE table.png]] |
+ | |[[Visual Editor / Tables|Tables]] are an important tool for formatting tabular page content. | ||
|- | |- | ||
|comment | |comment | ||
+ | [[File:Manual:VE comment.png]] | ||
|Comments are not visible to readers, but only in edit mode. A comment can be inserted anywhere on a page. The comment can be edited by clicking on it. | |Comments are not visible to readers, but only in edit mode. A comment can be inserted anywhere on a page. The comment can be edited by clicking on it. | ||
Line 112: | Line 150: | ||
|- | |- | ||
|Gallery | |Gallery | ||
+ | [[File:Manual:VE gallery.png]] | ||
| | | | ||
|- | |- | ||
|Magic word | |Magic word | ||
+ | [[File:Manual:VE magic word.png]] | ||
|With a "magic word" you can include certain variables or so-called behavioral switches in your page. For example, you can display the word count: <!-- insert word count here --> | |With a "magic word" you can include certain variables or so-called behavioral switches in your page. For example, you can display the word count: <!-- insert word count here --> | ||
− | <br /> [[MagicWords|Learn more about the | + | <br /> [[MagicWords|Learn more about the functionMagic Word]]". |
− | Overview of all [[ | + | Overview of all [[Manual:Extension/BlueSpiceSmartList|Magic Words in the visual editor]].<!-- more info needed --> |
|- | |- | ||
|Your signature | |Your signature | ||
− | |This option can only be used in discussions. | + | [[File:Manual:VE your signature.png]] |
+ | |This option can only be used in discussions. It allows to add a signature at any point of a discussion. | ||
|- | |- | ||
|Code block | |Code block | ||
+ | [[File:Manual:VE code block.png|150x150px]] | ||
|With code block various code examples can be entered, like e.g. in HTML syntax. The code is then displayed properly formatted: | |With code block various code examples can be entered, like e.g. in HTML syntax. The code is then displayed properly formatted: | ||
− | <br />< | + | <br /><pre> |
<span style="color: red">red text</span> | <span style="color: red">red text</span> | ||
− | </ | + | </pre> |
|- | |- | ||
− | | | + | |Refernces list |
+ | [[File:Manual:VE refernces list.png|150x150px]] | ||
+ | <br /> | ||
| | | | ||
|- | |- | ||
|Chemical formula | |Chemical formula | ||
− | |< | + | [[File:Manual:VE chemical formula.png]] |
+ | |The formula rendering uses an external service via Wikimedia's REST API.<br /> | ||
|- | |- | ||
|Math formula | |Math formula | ||
+ | [[File:Manual:VE math formula.png|150x150px]] | ||
|It opens an editor for entering a mathematical formula. | |It opens an editor for entering a mathematical formula. | ||
− | [[ | + | [[https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/en#Editing_mathematical_formulae|More info on MediaWiki]] |
|- | |- | ||
|Special Characters | |Special Characters | ||
+ | [[File:Manual:VE special characters.png]] | ||
+ | <br /> | ||
| | | | ||
− | |}<br /> | + | |}<br />Page options |
{| class="wikitable" | {| class="wikitable" | ||
|- | |- | ||
Line 154: | Line 202: | ||
|The options menu allows editing of all page settings. | |The options menu allows editing of all page settings. | ||
|- | |- | ||
− | |options | + | |Options |
+ | [[File:Manual:VE options.png]] | ||
|This button allows the page settings and page information to be updated simultaneously within a dialog box. | |This button allows the page settings and page information to be updated simultaneously within a dialog box. | ||
|- | |- | ||
|Categories | |Categories | ||
− | |Here you | + | [[File:Manual:VE categories.png]] |
+ | |Here you assign the page to one or more categories [[Category| Categories]]. The page will appear accordingly on all linked category pages. | ||
|- | |- | ||
|Page Settings | |Page Settings | ||
+ | [[File:Manual:VE page settings.png]] | ||
|Page redirection: When the page is redirected, the content of the page is no longer displayed, but the target page is loaded directly. | |Page redirection: When the page is redirected, the content of the page is no longer displayed, but the target page is loaded directly. | ||
− | This setting can also be used to display or remove the table of contents at the top of the page. The table of contents is automatically generated by the headings on the page. | + | This setting can also be used to display or remove the table of contents at the top of the page. The table of contents is automatically generated by the headings on the page. When a page has more than three headings, the table of contents appears automatically by default. |
|- | |- | ||
|Advanced Settings | |Advanced Settings | ||
+ | [[File:Manual:VE advanced settings.png]] | ||
| | | | ||
|- | |- | ||
− | |languages | + | |Languages |
+ | [[File:Manual:languages.png]] | ||
| | | | ||
|- | |- | ||
− | | | + | |Templates used |
+ | [[File:Manual:VE templates used.png]] | ||
| | | | ||
|- | |- | ||
|View as right-to-left | |View as right-to-left | ||
+ | [[File:Manual:VE view as right-to-left.png]] | ||
|Support for languages that are read from right to left. Clicking this button right-side formats the page text. Click again to set the text flush left. | |Support for languages that are read from right to left. Clicking this button right-side formats the page text. Click again to set the text flush left. | ||
|- | |- | ||
− | | | + | |Find and replace |
+ | [[File:Manual:VE find and replace.png]] | ||
|Words or characters can be searched and replaced directly on the page. The "Undo" button can be used to cancel the change. | |Words or characters can be searched and replaced directly on the page. The "Undo" button can be used to cancel the change. | ||
|} | |} | ||
Line 185: | Line 241: | ||
If you only see code editing, please contact an administrator of your wiki. The following settings must be checked in this case: | If you only see code editing, please contact an administrator of your wiki. The following settings must be checked in this case: | ||
− | *Global | + | *Global settings via the configuration manager |
*Namespace management settings | *Namespace management settings | ||
*Parsoid service on the server | *Parsoid service on the server | ||
Line 194: | Line 250: | ||
[[en:{{FULLPAGENAME}}]] | [[en:{{FULLPAGENAME}}]] | ||
[[de:VisualEditor]] | [[de:VisualEditor]] | ||
+ | [[Category:Editing]] |