docs: add embed files, resolve #383, resolve #333, resolve #134

docs/de-de/_sidebar.md

@@ -1,24 +1,28 @@
-- Loslegen
-  - [Schnellstart](de-de/quickstart.md)
-  - [Schreiben weiterer Seiten](de-de/more-pages.md)
-  - [Navigationsleiste anpassen](de-de/custom-navbar.md)
-  - [Titelseite](de-de/cover.md)
+* Loslegen
 
-- Anpassen
-  - [Einstellungen](de-de/configuration.md)
-  - [Themen](de-de/themes.md)
-  - [Liste der Erweiterungen](de-de/plugins.md)
-  - [Schreiben eigener Erweiterungen](de-de/write-a-plugin.md)
-  - [Markdown-Einstellungen](de-de/markdown.md)
-  - [Hervorheben von Sprachen](de-de/language-highlight.md)
+  * [Schnellstart](de-de/quickstart.md)
+  * [Schreiben weiterer Seiten](de-de/more-pages.md)
+  * [Navigationsleiste anpassen](de-de/custom-navbar.md)
+  * [Titelseite](de-de/cover.md)
 
-- Guide
-  - [Inbetriebnahme](de-de/deploy.md)
-  - [Helfer](de-de/helpers.md)
-  - [Vue Kompatibilität](de-de/vue.md)
-  - [CDN](de-de/cdn.md)
-  - [Offline Modus (PWA)](de-de/pwa.md)
-  - [Server-client renderer (SSR)](de-de/ssr.md)
+* Anpassen
 
-- [Awesome docsify](de-de/awesome.md)
-- [Changelog](de-de/changelog.md)
+  * [Einstellungen](de-de/configuration.md)
+  * [Themen](de-de/themes.md)
+  * [Liste der Erweiterungen](de-de/plugins.md)
+  * [Schreiben eigener Erweiterungen](de-de/write-a-plugin.md)
+  * [Markdown-Einstellungen](de-de/markdown.md)
+  * [Hervorheben von Sprachen](de-de/language-highlight.md)
+
+* Guide
+
+  * [Inbetriebnahme](de-de/deploy.md)
+  * [Helfer](de-de/helpers.md)
+  * [Vue Kompatibilität](de-de/vue.md)
+  * [CDN](de-de/cdn.md)
+  * [Offline Modus (PWA)](de-de/pwa.md)
+  * [Server-client renderer (SSR)](de-de/ssr.md)
+  * [Embed Files <sup style="color:red">(new)<sup>](de-de/embed-files)
+
+* [Awesome docsify](de-de/awesome.md)
+* [Changelog](de-de/changelog.md)

docs/de-de/embed-files.md

@@ -0,0 +1,76 @@
+# Embed files
+
+With docsify 4.6 it is now possible to embed any type of file.
+You can embed these files as video, audio, iframes, or code blocks, and even Markdown files can even be embedded directly into the document.
+
+For example, here embedded a Markdown file. You only need to do this:
+
+```markdown
+[filename](_media/example.md ':include')
+```
+
+Then the content of `example.md` will be displayed directly here
+
+[filename](_media/example.md ':include')
+
+You can check the original content for [example.md](_media/example.md ':ignore').
+
+Normally, this will compiled into a link, but in docsify, if you add `:include` it will be embedded.
+
+## Embedded file type
+
+Currently, file extension are automatically recognized and embedded in different ways.
+
+This is a supported embedding type:
+
+* **iframe** `.html`, `.html`
+* **markdown** `.markdown`, `.md`
+* **audio** `.mp3`
+* **video** `.mp4`, `.ogg`
+* **code** other file extension
+
+Of course, you can force the specified. For example, you want to Markdown file as code block embedded.
+
+```markdown
+[filename](_media/example.md ':include :type=code')
+```
+
+You will get it
+
+[filename](_media/example.md ':include :type=code')
+
+## Tag attribute
+
+If you embed the file as `iframe`, `audio` and `video`, then you may need to set the attributes of these tags.
+
+```markdown
+[cinwell website](https://cinwell.com ':include :type=iframe width=100% height=400px')
+```
+
+[cinwell website](https://cinwell.com ':include :type=iframe width=100% height=400px')
+
+Did you see it? You only need to write directly. You can check [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe) for these attributes.
+
+## The code block highlight
+
+Embedding any type of source code file, you can specify the highlighted language or automatically identify.
+
+```markdown
+[](_media/example.html ':include :type=code')
+```
+
+⬇️
+
+[](_media/example.html ':include :type=code')
+
+Or Specify the language
+
+```markdown
+[](_media/example.html ':include :type=code text')
+```
+
+⬇️
+
+[](_media/example.html ':include :type=code text')
+
+?> How to set highlight? You can see [here](language-highlight.md).