Edumaps: Eingaben und Formatierungen im Box-Editor

Auf einen Blick 🚀

Die auf Edumaps verwendeten Formatierungen für Texte sind leicht zu erlernen.
Falls Sie neu sind, hilft Ihnen die Editorleiste beim Einfügen der Formatierungszeichen.
📝 Text-Formatierungen auf einen Blick:
*kursiv* **fett** > Zitat   Eingerückter Text Aufzählung: - Eins - Zwei Nummerierte Aufzählung:  1. Eins 2. Zwei ?? Versteckter Text (Spoiler) {Verlinkter Text}{https://www.edumaps.de}

Leere Zeilen zwischen Elementen

Elemente (Fotos, Videos, Links) müssen bei Edumaps mit leeren Zeilen getrennt werden.
Ein zusammenhängender Text wird als ein Element erkannt, auch wenn er auf der nächsten Zeile weitergeht.
Beispiel:
Mein Text mit Zeilenumbruch
Mein Text mit
Zeilenumbruch
⚠️ Wollen wir nun einen neuen Inhalt (Bild, Video etc.) anhängen, so müssen wir eine Leerzeile zwischen Text und Upload schalten.
❌ Falsch:
Mein Text mit Zeilenumbruch Neuer Inhalt
✔️ Richtig ist mit einer leeren Zeile:
Mein Text mit Zeilenumbruch Neuer Inhalt

Wörter fett oder kursiv machen

Fett mit umschließenden zwei Sternchen:
Fettdruck
Kursiv mit umschließenden einem Sternchen:
Kursivdruck
📝 Eingabe:
**Fettdruck** *Kursivdruck*
Fett und Kursiv somit:
***fettkursiv***

Wörter durchstreichen und unterstreichen

Durchstreichen mit umschließenden zwei Tilden:
~~Durchgestrichen~~
Unterstrichen mit HTML-Syntax:
Unterstrichen
📝 Eingabe:
~~Durchgestrichen~~ Unterstrichen
Durchgestrichen und unterstrichen somit:
~~Unterstrichen~~
Ergibt: ~~Unterstrichen~~

Zeilenumbrüche und neue Zeilen

Zeilenumbrüche werden genau wie im Texteditor dargestellt.
Setzt man eine neue Zeile (mit leerer Zeile davor), dann gilt dies als neuer Absatz.
Setzt man jedoch nur ein Enter im Texteditor und bricht damit den Text, so wird auch der Text in der Ansicht gebrochen.
Zum Beispiel wird folgende Eingabe mit Zeilenumbruch dargestellt:
Es folgt eine neue Zeile.

Einfache Liste

Einfache Liste mit Anstrich erzeugen:
- Test 1
- Test 2
- Test 3
📝 Eingabe:
- Test 1 - Test 2 - Test 3

Nummerierte Liste

Nummerierte Listen können mit doppeltem Anstrich -- erzeugt werden:
1. test 1
2. test 2
3. test 3
4. Hello
  und auf die nächste Zeile
Die Nummerierung erfolgt automatisch.
📝 Eingabe:
-- test 1 -- test 2 -- test 3 -- Hello und auf die nächste Zeile
📝 Alternative Eingabe mit Nummerierung:
1. test 1 2. test 2 3. test 3 4. Hello und auf die nächste Zeile
Die Nummerierung kann auch mit einer anderen Zahl starten. Beispiel:
1. Fünfter Eintrag
2. Sechster Eintrag
3. usw.

Liste mit Einzug erzeugen

Eine Liste kann mit Einzug dargestellt werden, indem man ein Leerzeichen vor jeden Anstrich setzt.
Beispiel:
- Eins
- Zwei
- Drei
📝 Eingabe:
- Eins - Zwei - Drei
Auch Teillisten sind möglich:
- Hunderassen
- - Dackel
  - Schäferhund
  - Beagle
📝 Eingabe:
- Hunderassen - Dackel - Schäferhund - Beagle

Text einrücken

Text kann eingerückt werden, indem man zu Beginn der Zeile zwei Leerzeichen setzt.
Zum Beispiel:
Dies ist ein langer eingerückter Text über mehrere Zeilen.
📝 Eingabe:
   Dies ist ein langer eingerückter Text über mehrere Zeilen.

Text-Einzug mit zwei Stufen

Text kann in zwei Stufen eingerückt werden:
Standard
Einzug Stufe 1
Einzug Stufe 2
Für die erste Stufe sind zwei Leerzeichen am Anfang der Zeile zu setzen.
Für die zweite Stufe sind vier Leerzeichen am Anfang der Zeile zu setzen.
📝 Eingabe:
Standard Einzug Stufe 1 Einzug Stufe 2

Zitate setzen

Zitate werden mit einem > am Beginn der Zeile erzeugt:
Alle Träume können wahr werden, wenn wir den Mut haben, ihnen zu folgen.
📝 Eingabe:
> Alle Träume können wahr werden, wenn wir den Mut haben, ihnen zu folgen.
Eine zweite Darstellung von Zitaten wird mit >> am Beginn der Zeile erzeugt:
Errare humanum est.
📝 Eingabe:
>> Errare humanum est.

Link mit Vorschaubild

Wenn ein Link zu einer externen Webseite eingefügt wird, so wird innerhalb von 1 Minute ein Vorschaubild generiert.
Zum Beispiel:
www.bildungsserver.de LINK
📝 Eingabe:
https://www.bildungsserver.de/
⚠️ Ein Vorschaubild wird nur erzeugt, wenn der Link alleine auf einer Zeile steht.
Befindet sich der Link innerhalb von Text, so wird er als Textlink dargestellt.

Link mit Vorschau und eigenem Text

Wenn Sie unter dem Vorschaubild einen eigenen Text setzen wollen, so geben Sie direkt auf der nächsten Zeile, die dem Link folgt, diesen Text ein.
Zum Beispiel:
Webseite zum Bildungsserver LINK
📝 Eingabe:
https://www.bildungsserver.de/ Webseite zum Bildungsserver

Textlink setzen (ohne Vorschaubild)

Möchte man einen reinen Textlink erzeugen und ein Link-Vorschaubild verhinden, so setzt man ein Ausrufezeichen ! vor das https.
Oder aber man umschließt den Link mit geschweiften Klammern{https://...}.
Beispiel:
Das ist ein Textlink: https://de.wikipedia.org/wiki/Hessen
📝 Eingabe:
Das ist ein Textlink: !https://de.wikipedia.org/wiki/Hessen
oder:
Das ist ein Textlink: {https://de.wikipedia.org/wiki/Hessen}

Eigenes Vorschaubild einsetzen

Um ein eigenes Vorschaubild zu setzen, gehen Sie wie folgt vor:
1. Machen Sie einen Screenshot von der Webseite.
1. Laden Sie den Screenshot in Ihre Box hoch.
1. Tragen Sie anschließend den Link zur Webseite direkt unterhalb des UPLOAD1-Textes ein.
1. Setzen Sie zusätzlich ein Ausrufezeichen ! vor den Link. Dadurch wird das Vorschaubild auf die externe Webseite verlinkt.
📝 Eingabe:
UPLOAD1 !https://de.wikipedia.org/

Links innerhalb von Text

Befindet sich der Link innerhalb des Textes, so wird er automatisch als Inline-Link dargestellt - ohne Vorschaubild.
Beispiel für Inline-Link:
„Das ist ein Beispiellink zu https://www.tutory.de in der Mitte des Textes.“

Text verlinken

Möchte man einen Teil eines Textes verlinken, so ist dies ebenfalls möglich.
Beispiel:
Das ist ein verlinkter Text.
📝 Eingabe:
Das ist ein {verlinkter Text}{https://www.edumaps.de/}.

Labels von Bildern und Links

Für jede hochgeladene Bild-, Audio-, Video-Datei usw. kann ein Label (Bildunterschrift) vergeben werden.
Dieses Label kann man auch nachträglich ändern, indem man den Text unter UPLOAD ändert.
UPLOAD3 Foto von unserer Schule
zu:
UPLOAD3 Foto von meiner alten Schule

Info-Icon bei Uploads (Bild/PDF)

Möchte man eine Information (wie z. B. eine Quellenangabe) bei einem hochgeladenen Bild oder einer PDF hinterlassen, so kann man dies wie folgt tun:
📝 Eingabe:
UPLOAD3 {Quelle: https://www.externequelle.org/}
Der Text innerhalb der geschweiften Klammern wird bei dem Info-Icon angezeigt, wenn man mit der Maus herüber fährt oder darauf klickt.
Beispiel:
Das Info-Icon funktioniert ebenfalls zusammen mit der Bildunterschrift:
📝 Eingabe:
UPLOAD3 Bildunterschrift {Hier der Infotext zum Bild}

Code eingeben

Inline-Code setzen mit Backticks.
Beispiel: 24·x + 12 = 5
var x = 12;
var y = 12;
var z = x + y;
Damit lassen sich auch einzelne Wörter hervorheben. Diese sind dann jedoch mit Schriftart Monospace.
📝 Eingabe:
Beispiel: `24·x + 12 = 5` `var x = 12;` `var y = 12;` `var z = x + y;`

Latex nutzen

Latex als Block mit umschließenden Dollarzeichen:
$$ \int \limits_{2}^{\infty} + \frac{1}{2}·x^{45+y+{\alpha} } $$
Latex inline setzen mit $ 5x+2^x = 12 $ und weiterschreiben. Geht auch mehrfach $ x^2 $ und $ x^3 $.
📝 Eingabe:
$$ \int \limits_{2}^{\infty} + \frac{1}{2}·x^{45+y+{\alpha} } $$ Latex inline setzen mit $ 5x+2^x = 12 $ und weiterschreiben. Geht auch mehrfach $ x^2 $ und $ x^3 $.
Hinweis: Nutzen Sie für Latex innerhalb von Textfeldern stets Inline-Latex mit $ … $ und nicht Block-Latex.

Text hochstellen und tiefstellen

Hochstellen geht mit Caret und geschweiften Klammern.
Beispiel: x^{2y}
Tiefstellen geht mit Unterstrich und geschweiften Klammern.
Beispiel: x_{1}
📝 Eingabe:
Beispiel: x^{2y} Beispiel: x_{1}

Eigene Notizen in Boxen

Eigene Notizen kann man im Bearbeitungsmodus einfügen.
Diese Notizen werden nur dem Bearbeiter angezeigt.
Hierzu einfach am Anfang der Zeile zwei Schrägstriche // setzen.
Die Zeile wird dann in der Map-Ansicht nicht dargstellt.
Eigene Notiz (nur im Bearbeitungsmodus)

Spoiler

Die Spoiler-Funktion bedeutet: Inhalte können versteckt werden und sind nur mit Klick anzeigbar.
Beispiel:
Zum Zeigen klicken

Dies ist ein versteckter Lösungstext.
Zum Zeigen klicken

Dies ist ein verstecktes Foto.
Spoiler werden einfach mit ?? zu Beginn einer Zeile gesetzt.
📝 Eingabe:
Beispiel: ?? Dies ist ein versteckter Lösungstext. ?? UPLOAD3 Dies ist ein verstecktes Foto.

Zeitgesteuerter Spoiler

Mit dem zeitgesteuerten Spoiler können Sie zum Beispiel das Lernen mit Karteikarten nachbauen.
Beispiel:
Zum Zeigen klicken

Dies ist ein Lerntext, der nur kurz erscheint.
Klicken Sie auf den Spoiler, so wird er knapp 10 Sekunden angezeigt. Danach wird er wieder versteckt.
Zeitgsteuerte Spoiler werden mit ??? zu Beginn einer Zeile gesetzt.
📝 Eingabe:
Beispiel: ??? Dies ist ein Lerntext, der nur kurz erscheint.

Farbe für Text/Wörter

Man kann Wörter mit beliebigen Farben versehen.
Beispiel: Dies ist ein blaues Wort.
📝 Eingabe:
Dies ist ein {blaues Wort}{#0000FF}.
Hierzu muss man RGB-Farbcodes kennen:
en.wikipedia.org LINK
Beispiele von RGB-Farbcodes:
- Rot #FF0000
- Grün #00FF00
- Blau #0000FF
- Grau #888888
- Hellgrau #CCCCCC
- Kastanienbraun #800000
- Gelb #FFFF00
- Oliv #808000
- Lindgrün #00FF00
- Dunkelgrün #008000
- Seegrün #008080
- Marineblau #000080
- Aqua #00FFFF
- Fuchsienfarbig #FF00FF
- Violett #800080
⚙ hexcolor

Hintergrundfarbe für Texte/Wörter

Man kann Wörter mit beliebigen Farben hinterlegen. Hierzu bei einem bereits eingefärbten Wort hinter den Farbcode ein weiteres Hash # anfügen.
Beispiel: Dies ist ein grünes Wort und das ein rotes Wort.
📝 Eingabe:
Dies ist ein {grünes Wort}{#CCFFCC#} und das ein {rotes Wort}{#FFA1A5#}.
Farben werden auch hier mit RGB-Farbcodes angegeben. Beispiele von RGB-Farbcodes:
Rot #FF0000 | Grün #00FF00 | Blau #0000FF

Überschriften

Eine Überschrift kann gesetzt werden, indem man ein Hash-Zeichen # gefolgt von einem Leerzeichen am Anfang der Zeile setzt.
Meine Überschrift
📝 Eingabe:
# Meine Überschrift

Unterüberschriften

Eine Unterüberschrift lässt sich mit zwei Hash-Zeichen ## gefolgt von einem Leerzeichen am Anfang der Zeile setzen:
Zweite Überschrift
📝 Eingabe:
## Zweite Überschrift
Eine weitere Unterüberschrift lässt sich mit drei Hash-Zeichen ### gefolgt von einem Leerzeichen am Anfang der Zeile setzen:
Dritte Überschrift
📝 Eingabe:
### Dritte Überschrift

Spezielle Überschriften

Eine spezielle Überschrift lässt sich setzen, indem man vor das Hash-Zeichen ein Ausrufezeichen setzt, also $#:
Spezielle Überschrift
📝 Eingabe:
$# Spezielle Überschrift
Mit dem Einsatz solcher Überschriften lassen sich Texte besser visuell unterglieden.

Button für Rückmeldung

Möchte man, dass die Schüler ihre Rückmeldung direkt per Button aufrufen und abgeben können, so kann man hierzu einen Button setzen.
Beispiel:
Rückmeldung
📝 Eingabe:
Dazu verwendet man zwei Pfeile zu Beginn und am Ende.
⇢Rückmeldung⇠

Horizontale Trennlinie

Eine horizontale Linie kann innerhalb einer Box mit --- oder *** gesetzt werden.
Beispiel:
📝 Eingabe:
---

Schriftgrößen

Sie können die Schriftgröße für einzelne Wörter unterschiedlich setzen.
Das Vergrößern der Schriftgröße und das Verkleinern der Schriftgröße von Wörtern ist wie folgt möglich:
Small Text <big>Big Text</big>
Die Änderung der Schriftgröße kann verwendet werden in Maptiteln, Pfadtiteln, Boxtiteln und Boxinhalten.

Checkboxen

Checkboxen lassen sich mit Markdown-Syntax leicht erstellen.
Beispiel:
- ☑ Erstes Element
- ☐ Zweites Element
- ☑ Drittes Element
📝 Eingabe:
[x] Erstes Element [ ] Zweites Element [x] Drittes Element

Tooltips für Wörter (Popups)

Möchte man ein bestimmtes Wort erklären, so eignet sich ein sogenannter „Tooltip“ hierfür, der eine Erklärung anzeigt, sobald der Benutzer mit der Maus über das Wort fährt oder auf einem mobilen Endgerät auf das Wort klickt.
Beispiel:
Ein Ozelot ist kein Axolotl.
📝 Eingabe:
Ein [Ozelot]{Der Ozelot ist eine in Mittel- und Südamerika lebende Raubtierart.} ist kein [Axolotl]{Der Axolotl ist ein aquatil lebender Schwanzlurch}.
⚠️ Tooltips dürfen nur aus Reintext bestehen und keine Links oder Uploads enthalten.

Graphen einbetten

Es können beliebige Graphen interaktiv eingebettet werden.
Details hierzu gibt es auf der Map:
Edumaps: Graphen einbetten LINK

Maptitel formatieren

Im Map-Editor kann man beim Titel-Eingabefeld auch einzelne Wörter formattieren.
Hier ist es möglich, Fett und Kursiv mit Sternchen zu setzen. Auch Zeilenumbrüche sind mit zwei Backslashs möglich.
📝 Eingabe (Beispiel):
**Fette Überschrift** \\ Dies ist auf der nächsten Zeile. \\ Hier nun ein *kursives Wort*.

Formatierungen in Pfadtiteln

Pfadtitel formattieren

Im Pfad-Editor kann man beim Titel-Eingabefeld auch einzelne Wörter formattieren.
Hier ist es möglich, Fett und Kursiv mit Sternchen zu setzen. Auch Zeilenumbrüche sind mit zwei Backslashs möglich.
📝 Eingabe (Beispiel):
**Fette Überschrift** \\ Dies ist auf der nächsten Zeile. \\ Hier nun ein *kursives Wort*.

Kopfzeile eines Pfades verlinken

Man kann den Pfadtitel verlinken, indem man einfach hinter den Pfadtitel noch den Link einfügt.
Als Beispiel siehe Map:
Zitate und Sprüche zur Mathematik LINK

Pfad-Anmerkungen einfügen

Im Pfad-Editor kann man "Anmerkungen einfügen". Diese Anmerkungen erscheinen unterhalb des Pfadtitels.
In den Anmerkungen werden neue Zeilen berücksichtigt.
Auch kann man Formatierungen für Fett Kursiv setzen.
📝 Eingabe (Beispiel):
**Vorwissen:** Dies sind meine Anmerkungen zu dem Thema. Zweite Zeile mit mehr Information.

Formatierungen in Boxtiteln

Boxtitel formatieren

Im Box-Editor kann man beim Titel-Eingabefeld auch einzelne Wörter formattieren.
Hier ist es möglich, Fett und Kursiv mit Sternchen zu setzen. Auch Zeilenumbrüche sind mit zwei Backslashs möglich.
📝 Eingabe (Beispiel):
**Fette Überschrift** \\ Dies ist auf der nächsten Zeile. \\ Hier nun ein *kursives Wort*.

Kopfzeile einer Box verlinken

Man kann den Boxtitel verlinken, indem man einfach hinter den Boxtitel den Link einfügt.
Beispiel: Verlinkter Boxtitel

Boxen einbetten

Externe Box in eigene Map einbetten

Sie können jede beliebige Box, die sich auf einer anderen Map befindet, auf Ihrer Map einbetten. Dadurch wird die komplette Box auf Ihrer Map angezeigt.
Hierzu gehen Sie wie folgt vor:
1. Gehen Sie zu der externen Map und finden Sie die Box, die Sie einbetten möchten.
2. Im Bearbeitungsmodus klicken Sie auf die drei Punkte bei der Box und wählen im Dropdown „Link zur Box“.
1. Kopieren Sie den Link.
2. Gehen Sie danach zu Ihrer Map und öffnen sie im Bearbeitungsmodus.
3. Erstellen Sie eine neue Box und geben Sie im Boxtitel ein: embed: und setzen den Boxlink dahinter. Das sieht zum Beispiel so aus:
1. Speichern Sie die Box und der externe Boxinhalt erscheint.
Beispiel: Eingebettete Box
Eine eingebettete Box erkennen Sie an dem Icon rechts oben an der Box. Klicken Sie darauf, so öffnet sich die ursprüngliche Box.
Mögliche Szenarien für die Schule:
- Gruppen erarbeiten mit einer Map eine Aufgabe und haben eine Präsentationsbox, in der ihre Aufgaben zusammengefasst sind. Diese Präsentationsboxen werden dann vom Lehrer in einer Hauptmap verlinkt, um die aktuellen Gruppenergebnisse nebeneinander aufzuzeigen.
- Der Lehrer nutzt eine zentrale „Aufgabenbox“, die auf den einzelnen Maps der Schüler (bzw. verschiedener Gruppen) angezeigt wird. Diese wissen dann jeden Tag, welche Aufgaben zu erledigen sind.
Hinweis:
Eingebettete Boxen aktualisieren sich nicht von selbst, wenn sie auf der Ursprungs-Map bearbeitet werden. Um den aktuellen Stand aller Boxen zu sehen, müssen Sie Ihre Map manuell neu laden.

Pfade einbetten

Externen Pfad in eigene Map einbetten

Sie können jeden beliebigen Pfad, der sich auf einer anderen Map befindet, auf Ihrer Map einbetten. Dadurch wird der Pfad mit all seinen Boxen auf Ihrer Map angezeigt.
Hierzu gehen Sie wie folgt vor:
1. Gehen Sie zu der externen Map und finden Sie den Pfad, den Sie einbetten möchten.
2. Im Bearbeitungsmodus klicken Sie auf die drei Punkte bei dem Pfad und wählen im Dropdown „Link zum Pfad“.
1. Kopieren Sie den Link.
2. Gehen Sie danach zu Ihrer Map und öffnen sie im Bearbeitungsmodus.
3. Erstellen Sie einen neue Pfad und geben Sie im Pfadtitel ein: embed: und setzen den Pfadlink dahinter. Das sieht zum Beispiel so aus:
1. Speichern Sie den Pfad und wechseln Sie in die Map-Ansicht.
1. Glückwunsch! Der externe Pfad wird nun mit allen enthaltenen Boxen angezeigt.
Beispiel: Eingebetteter Pfad
Einen eingebetteten Pfad erkennen Sie an dem Pfeil-Icon rechts oben. Auch hat jede Box dieses Pfades das Icon. Klicken Sie darauf, so öffnet sich der ursprüngliche Pfad bzw. die ursprüngliche Box.
Mögliche Szenarien für die Schule:
Jeder Schüler soll sein Portfolio in einer Map erstellen. Pro Fach hat er einen Lernpfad bzw. eine Timeline. Diese Timeline teilt der Schüler mit dem Lehrer. Der Lehrer sammelt die Timelines (Pfade) all seiner Schüler in einer zentralen Map, indem er den jeweiligen Pfad einbettet. Auf diese Weise hat der Lehrer den Entwicklungsstand seiner gesamten Klasse auf einer einzigen Map im Überblick.
Hinweis:
Eingebettete Pfade und Boxen aktualisieren sich nicht von selbst, wenn sie auf der Ursprungs-Map bearbeitet werden. Um den aktuellen Stand aller Boxen zu sehen, müssen Sie Ihre Map manuell neu laden.

Sonstiges

Markdown

Unser Editor unterstützt einen Großteil der Markdown-Syntax.
Artikel über Markdown (Wikipedia).
Falls Sie Texte in Markdown in Ihren Dokumenten verfasst haben, können Sie diese direkt per Copy & Paste in unseren Editor einfügen.

(Halb)Transparente Hintergrundfarben

Sie könnnen Hintergrundfarben von Boxen und Pfaden halbtransparent oder vollständig transparent gestalten.
Um einen halbtransparenten Hintergrund zu erzeugen, müssen Sie:
1. Box bearbeiten und auf „Farbe bearbeiten“ klicken (Stift-Icon).
2. Ein zweites Mal auf „Farbe bearbeiten“
3. Sie sehen nun den Schieberegler für Transparenz, den Sie einstellen können.
Wollen Sie die halbtransparente Farbe auf die ganze Box anwenden, so müssen Sie auf „Füllen“ klicken.
Einstellung halbtransparente Box-Farbe
und Box mit Farbe füllen