No edit summary Tag: 2017 source edit |
No edit summary |
||
Line 19: | Line 19: | ||
==Text editing== | ==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. | 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 /> | <span /><br /> | ||
[[File:BlueSpice_3.1_-_Notable_Changes_-_Text_colors.png|center|thumb|Applying text color|link=Special:FilePath/BlueSpice_3.1_-_Notable_Changes_-_Text_colors.png]]<br /> | [[File:BlueSpice_3.1_-_Notable_Changes_-_Text_colors.png|center|thumb|Applying text color|link=Special:FilePath/BlueSpice_3.1_-_Notable_Changes_-_Text_colors.png]]<span /><br /> | ||
==Pasting content from your clipboard == | ==Pasting content from your clipboard == | ||
Line 34: | Line 34: | ||
All available keyboard shortcuts are marked accordingly in VisualEditor next to each menu item. | All available keyboard shortcuts are marked accordingly in VisualEditor next to each menu item. | ||
<br /> | <span /><br /> | ||
[[File:Manual:editing_tools.png|alt=Menu items with shortcuts|center|thumb|350x350px|Menu items with shortcuts]] | [[File:Manual:editing_tools.png|alt=Menu items with shortcuts|center|thumb|350x350px|Menu items with shortcuts]] | ||
<br /> | <span /><br /> | ||
{{Messagebox|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).}} | {{Messagebox|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).}} | ||
Line 76: | Line 76: | ||
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. | 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=== | ===Text formatting=== | ||
{| class="wikitable" | In the text formatting menu, the following additional options are available when a text passage has been selected: | ||
''Text color'': different text colors can be selected via an inspector menu. | |||
''Center align'': Text can be selected and centered paragraph by paragraph. | |||
''Indent'': Text can be indented once (note: multiple indentation is only possible via the source text) | |||
[[File:VisualEditor textformatting.png|alt=Text formatting options|center|thumb|375x375px|Text formatting options]] | |||
{| class="wikitable" style="" | |||
|- | |- | ||
! colspan="2" |'''Text formatting''' | ! colspan="2" |'''Text formatting''' | ||
Line 90: | Line 98: | ||
|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 [[Visual Editor / Tables|table]], the options will change accordingly (content cell and header cell):[[File:Manual:content cell.png|left|frameless|183x183px|alternative-text=VisualEditor-paragraph2|link=Special:FilePath/Manual:content_cell.png]]<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|left|frameless|183x183px|alternative-text=VisualEditor-paragraph2|link=Special:FilePath/Manual:content_cell.png]]<span /><br /> | ||
|- | |- | ||
|Style text | |Style text | ||
Line 99: | Line 107: | ||
|- | |- | ||
|Insert hyperlink | |Insert hyperlink | ||
[[File:Manual:VE Insert hyperlink.png|link=Special:FilePath/Manual:VE_Insert_hyperlink.png]]<br /> | [[File:Manual:VE Insert hyperlink.png|link=Special:FilePath/Manual:VE_Insert_hyperlink.png]]<span /><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] | [https://www.mediawiki.org/wiki/Help:VisualEditor/User_guide/de#Erste_Schritte:_Die_VisualEditor-Werkzeugleiste] | ||
Line 114: | Line 122: | ||
|} | |} | ||
<br /> | <span /><br /> | ||
===Insert special content=== | ===Insert special content=== | ||
{| class="wikitable" | {| class="wikitable" style="" | ||
|- | |- | ||
! colspan="2" |'''Paste Special Content''' | ! colspan="2" |'''Paste Special Content''' | ||
Line 144: | Line 152: | ||
|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. | ||
<span><br /></span> | |||
And this is what a comment looks like:[[File:Manual:comment.png|left|frameless|186x186px|alternativetext=VisualEditor-comment|link=Special:FilePath/Manual:comment.png]]<span /><br /> | |||
And this is what a comment looks like:[[File:Manual:comment.png|left|frameless|186x186px|alternativetext=VisualEditor-comment|link=Special:FilePath/Manual:comment.png]]<br /> | |||
|- | |- | ||
|Gallery | |Gallery | ||
Line 156: | Line 164: | ||
|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 --> | ||
<span><br /></span> | |||
<span /><br /> [[Manual:Extension/BlueSpiceInsertMagic|Learn more about the functionMagic Word]] | |||
<br /> [[Manual:Extension/BlueSpiceInsertMagic|Learn more about the functionMagic Word]] | |||
|- | |- | ||
| Your signature | | Your signature | ||
Line 167: | Line 175: | ||
[[File:Manual:VE code block.png|150x150px|link=Special:FilePath/Manual:VE_code_block.png]] | [[File:Manual:VE code block.png|150x150px|link=Special:FilePath/Manual:VE_code_block.png]] | ||
|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 /><pre> | <span /><br /><pre> | ||
<span style="color: red">red text</span> | <span style="color: red">red text</span> | ||
</pre> | </pre> | ||
Line 173: | Line 181: | ||
|Refernces list | |Refernces list | ||
[[File:Manual:VE refernces list.png|150x150px|link=Special:FilePath/Manual:VE_refernces_list.png]] | [[File:Manual:VE refernces list.png|150x150px|link=Special:FilePath/Manual:VE_refernces_list.png]] | ||
<br /> | <span /><br /> | ||
| | | | ||
|- | |- | ||
|Chemical formula | |Chemical formula | ||
[[File:Manual:VE chemical formula.png|link=Special:FilePath/Manual:VE_chemical_formula.png]] | [[File:Manual:VE chemical formula.png|link=Special:FilePath/Manual:VE_chemical_formula.png]] | ||
|The formula rendering uses an external service via Wikimedia's REST API.<br /> | |The formula rendering uses an external service via Wikimedia's REST API.<span /><br /> | ||
|- | |- | ||
|Math formula | |Math formula | ||
Line 188: | Line 196: | ||
|Special Characters | |Special Characters | ||
[[File:Manual:VE special characters.png|link=Special:FilePath/Manual:VE_special_characters.png]] | [[File:Manual:VE special characters.png|link=Special:FilePath/Manual:VE_special_characters.png]] | ||
<br /> | <span /><br /> | ||
| | | | ||
|}<br />Page options | |}<span /><br />Page options | ||
{| class="wikitable" | {| class="wikitable" style="" | ||
|- | |- | ||
! colspan="2" |'''Page Options''' | ! colspan="2" |'''Page Options''' | ||
Line 211: | Line 219: | ||
|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. | ||
<span><br /></span> | |||
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. | 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. | ||
|- | |- | ||
Line 241: | Line 249: | ||
*[[Manual:Extension/BlueSpiceNamespaceManager|Namespace manager]] settings | *[[Manual:Extension/BlueSpiceNamespaceManager|Namespace manager]] settings | ||
<br /> | <span /><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 --> | <!-- 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 --> | ||
Revision as of 13:12, 14 December 2022
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?
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
Typical text formatting options such as bold, italics, or text color 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.
Pasting content from your clipboard
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.
Inserting other content
Many typical page elements such as images, files and tables can be integrated into your page 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 following help pages:
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, 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.
- 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.
- Codeblock: Programming code is displayed here in clean code blocks, optionally with line numbers.
- 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.
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:
MediaWiki reference
Since VisualEditor is a standard MediaWiki extension, you can also read a documentation of functionality on MediaWiki. Here in the BlueSpice Helpdesk, we only give some hints and tips for using the editor.
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
In the text formatting menu, the following additional options are available when a text passage has been selected:
Text color: different text colors can be selected via an inspector menu.
Center align: Text can be selected and centered paragraph by paragraph.
Indent: Text can be indented once (note: multiple indentation is only possible via the source text)
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 | 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): |
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. |
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. |
cite | The citation menu is used to insert footnote references (also called itemizations or footnotes) within the text. |
Structure |
Insert special content
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 a template in the page. |
tables | Tables are an important tool for formatting 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:
|
Your signature | This option can only be used in discussions. It allows to add a signature at any point of a discussion. |
Code block | With code block various code examples can be entered, like e.g. in HTML syntax. The code is then displayed properly formatted:
<span style="color: red">red text</span> |
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.
[[on MediaWiki]] |
Special Characters |
Page options
Page Options | |
---|---|
Options menu | The options menu allows editing of all page settings. |
Options | This button allows the page settings and page information to be updated simultaneously within a dialog box. |
Categories | Here you assign the page 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 | |
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. |
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
If you only have the source editing option in your editor toolbar, please contact an administrator of your wiki. The following settings must be checked in this case:
- Global settings via the configuration manager
- Namespace manager settings