Try   HackMD

E2) Dateien einbetten zum Durchblättern

content:
​​​​by Paul 2020-11-26 update 2023-02-23 02:00  
​​​​mit vorgeschaltetem InhaltsVerzeichnis (anclickbar):  

[TOC] short: FileEmbed-E2

PDF-Datei erstellen via gDocs


gdoc-dateiFormat direkt daraus web-veröffentlichen:

Ursprung: gdoc-format in A5

als iframe mit automatischer Inhalts-Aktualisierung

Original gdoc-frame ohne Maße:


Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
Original ergänzt auf 100%x480:

100%x480 passt am besten in codi und stack sowohl desktop als auch smartph!
? prüfen via WP!!


__MD-Aufruf zum apple-support: KLAPPT VIA SEP_TAB!!!:
support apple wg. ipad-diktat ->



Link (via Onedrive) für den Anwender zum Einblick als pdf-Datei:

__Vorarbeiten hierzu:

  • in gdoc zunächst unter -> Datei -> Seiteneinrichtung die Dokumentenmaße auf DIN-A4 definieren
  • dann unter -> Datei -> Herunterladen -> pdf-Datei auf lokalen Computer speichern
  • vom lokalen Computer wiederum auf Onedrive hochladen
  • in onedrive diese pdf-Datei öffnen und links oben in der Menüleiste den "Teilen"-Knopf drücken
  • im PopUp-Fenster den Teilen-Link kopieren (aufpassen, dass KEIN Bearbeiten zugelassen ist)
  • kopierten Link in entsprechenden MD-Befehl "[](https://)" einfügen

Der Anwender bekommt dann bei Anclicken dieses Links in einem separaten Browser-TAB Einblick in die pdf-Datei und kann jene von dort auch downloaden

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
ACHTUNG: WP öffnet den Link im gleichen TAB!!
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
überlegen, ob der link innerhalb der gdoc-datei funktioniert
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

müsste gehen, aber der link wird dann innerhalb der Embedding-Datei geöffnet (sowohl in WP als auch stack als auch in codi !!!)- das müsste also die gesuchte Lösung sein!

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
aber die pdf Datei muß dann auch in DIN-A5 bleiben, da die Maße des Embedding-Fensters gelten!

-> als pdf Datei in separatem TAB anschauen - nicht via WP!->




Original ergänzt auf 600x480:


OneDrive zum Speichern und Einbetten nutzen

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
via OneDrive klappt prima = hiermit die bevorzugte Abrufquelle:
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

  • Ihre lokale pdf-Datei in OneDrive hochladen
  • in Onedrive öffnen und Einbettungs-Code erzeugen
  • zum Verdecken des Einbettungs-Code gegenüber Anwender:
    • in OneDrive: -> Teilen -> "mehr" -> Berechtigungen anzeigen -> Einbettungs-Link "aus-iXen"
  • den Einbettungscode (= iframe) für Ihre WebSite/Blog in MD einfügen
  • iframe-Maße ändern auf width=100% hight=480 (oder statt 480 -> 600)

Übrigens: Anzeige im Browser wird scheinbar via word-online gesteuert - daher klappen sicherlich auch die Links besser!

  • Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    interne Links via TOC klappen gut
    Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    vorzugsweise gDoc-TOC verwenden:
    Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    • Grund-1 = enthält Seiten-Nr.-Info für den Anwender!!(= vertrautere Ansicht für IHVZ)
    • Grund-2 = das interne Verzweigen laut gDoc-TOC klappt bei Ausführung zielgenauer - unabhängig vom jeweiligen Zoom!
  • Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    Externe Links werden korrekt in neuem Tab ausgeführt!!
  • vorgegebene width="476" height="288" ändern manuell auf 100% x 480 evtl. 100% x 600 (Prüfen, was besser ist für Smartphone-Displays!)
  • Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    Anwender-Zugriffe rechts unten im Fenster:
  • Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    Embedding-Code einsehen
    Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    prüfen!!
    Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    JA: in OneDrive via i-button ausschalten - so geht es:

    • zum Verdecken des Einbettungs-Code für Anwender:
      in OneDrive -> Teilen -> "mehr" -> Berechtigungen anzeigen -> Einbettungs-Link "aus-iXen"
  • Pdf-Kopie downloaden

  • Pdf drucken

  • Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    Symbol für Vollbildschirm unten rechts verzweigt zu korrekter Anzeige in neuem Tab mit Word-online!


1) "My-html-Lex-A5.pdf" nur mit TOC aus codi: (= iframe-Original in 476x288)

  • Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    das interne Sprungziel wird über das codi-TOC nicht immer zielgenau erreicht!?!

2) "My-html-Lex-A5.pdf" nur mit TOC aus gDoc: (100% x 480)

  • Image Not Showing Possible Reasons
    • The image file may be corrupted
    • The server hosting the image is unavailable
    • The image path is incorrect
    • The image format is not supported
    Learn More →
    Vorteil: das interne Sprungziel wird via gdoc-TOC immer zielgenau erreicht!!
  • gdoc-TOC ist incl. seiner Seiten-Nr für den Anwender eindeutiger als IHVZ erkennbar



Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
2a) "My-html-Lex-A5.pdf" nur mit TOC aus gDoc: (aber für WP 600 x 480)


ppt via gPresentation einbetten

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
direkt aus gPresent via WebVeröffentlichen

gPresent: -> Datei -> im Web veröffentlichen -> Einbetten

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
(P.S.: Folien vorzugsweise vorher auf Seitenverhältnis 16x10 definieren!
geht über ->Datei->Seiteneinrichtung)

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
Wichtig:
Erfährt die ppt-Datei in gPresent nachträglich Änderungen (Inhaltsänderungen, zusätzliche Folien, andere Seiteneinrichtung etc.), so erfährt die Web-Anzeige bei neuerlichem Aufruf des iframes automatisch diesbezüglich ein Update!!
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
auf den ppt-Folien vorhandene Hyperlinks werden hier korrekt extern in neuem Tab ausgeführt!

Innerhalb MD im iframe die Größenvorgabe von960x569 ändern auf 100% x 480: (Folien: 16x10) :



Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
WP-ALTERNATIV: direkt aus gPresent via WebVeröffentlichen

Innerhalb MD im iframe die Größenvorgabe von960x569 ändern für WP auf 600 x 480: (Folien: 16x10) :
WP-Maße sehen auch besser aus auf codi und stack! - ein Vollbild kann schließlich durch Klick auf [] jederzeit durch Anwender erzeugt werden - erscheint dann in gleichem TAB, der dann via ESC wieder verkleinert wird!
Übrigens auch gut geeignet für Beamer-Einsatz!


gPresent-ppt-folien als pdf herunterladen:

a) in gDocs-Present: ->Datei->Herunterladen->PDF-Datei(.pdf)

b) dann in oneDrive speichern und wie bereits beschrieben als pdf von dort einbetten:

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
diese Variante führt aber zu einem schlechteren Darstellungs-Ergebnis als die direkte Web-Veröffentlichung als ppt-Info-Würfel!
Übrigens: Hyperlinks auf den ppt-Folien werden innerhalb der Pdf-Datei ignoriert - keine Ausführung!

nachfolgend aber zur Veranschaulichung in 2 Versionen:

die 4x3-Folien als pdf via oneDrive einbetten: (iframe anpassen von 476x288 auf 100%x480)



die 16x10-Folien als pdf via oneDrive einbetten: (iframe anpassen von 476x288 auf 100%x480):



docx-Datei aus WordOnline via dortigem Einbettungslink(iframe) direkt einbetten

WordOnline: -> Datei -> Teilen -> Einbetten (in Blog bzw. WebSite) -> Einbettungscode-Anzeigen (Haken weg für Nichtanzeige) -> iframe kopieren

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
Wichtig:
Erfährt die docx-Datei in WordOnline nachträglich Änderungen (Inhaltsänderungen, zusätzliche Folien, andere Seiteneinrichtung etc.), so erfährt die Web-Anzeige des iframes automatisch diesbezüglich ein Update - also sobald die diesbezügliche WebSite mit dem eingebundenen iframe neuerlich aufgerufen wird!!
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
auf den docx-Seiten vorhandene Hyperlinks werden hier korrekt extern in neuem Tab ausgeführt!

Testdatei "Diktieren-in-word-online" (Maße von 476 x 288 geändert auf 100%x480) - - nachfolgend ist der Einblick in den Einbettungscode dem Anwender verwehrt:


nachfolgend habe ich auch den pdf-Druck dem Anwender verwehrt - ABER: es erfragt sich der Sinn desselben, denn der Anwender kann stattdessen laut Anzeige die Original-docx kopieren, d.h. downloaden!? Es wäre besser das Kopieren zu unterbinden, aber den pdf-Download zu gestatten!?



Vergleich: docx via pdf-Format veröffentlichen

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
A)
die vorher gezeigte docx-Datei

  • aus WordOnline als pdf-Datei downloaden
    -> Datei -> Speichern unter -> als Pdf downloaden
  • die jetzt lokale pdf-Datei in OneDrive hochladen
  • in Onedrive öffnen und Einbettungs-Code erzeugen und diesen iframe in MD einfügen

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
B)

  • zum Verdecken des Einbettungs-Code:
    • in OneDrive -> Teilen -> "mehr" -> Berechtigungen anzeigen -> Einbettungs-Link "aus-iXen"
  • Schritt B) nach derzeitigem Stand besser unterlassen - führt scheinbar zu Konfusionen im Ablauf, wenn sich die Teilen-Funktion in die Einbettungs-Funktion "einmischt"!?

Bei Ausführung von Schritt A) zuzüglich Schritt B) ergibt sich beim Ausführen folgender Anzeige-Fehler:

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
KLÄREN!!!

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
beschriebener iframe lädt korrekt in chrome

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
ABER NICHT IN OPERA
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
AUCH NICHT IN MS-EDGE

MS-Meldung jeweils: "Dieses Element kann derzeit nicht geladen werden."


Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
Abhilfe: Einbettungs-Code nochmal neu generieren und in MD einsetzen (Arbeitsschritt B unterlassen):



Einbetten-Vergleich: docx aus gdoc : aus Word-online

docx aus gdoc direkt einbetten:

  • fehlenden Size hinzugefügt: width=100% height=480
    schwierig für Laien durchzuführen!
  • Anwender kann nur anzeigen - evtl. Vorteil!
  • keinerlei buttons für Druck, neuerTab etc.

docx aus word-online direkt einbetten:

  • Size von 476x288 manuell auf 100% x 480
  • Embed-CodeEinblick leicht zu unterdrücken
  • keine "Papier-Farbe" definierbar
  • beim Anzeigen manchmal WordOnline-Server überlastet
  • als pdf druckbar -> wird von WordOnline einwandfrei in pdf umgewandelt
  • als Kopie herunterladen = echte docx-Datei wird herunter geladen!
  • separate Anzeige in neuem Tab (= via WordOnline)

docxGdoc2pdf to Onedrive

  • Size von 476x288 geändert auf: 100% x 480 #
  • Einbettungs-Code bleibt einsichtbar
  • pdf herunterladen
  • Kopie herunterladen = pdf herunterladen
  • separat in neuem Tab (= via WordOnline)

nach oben zum Beitrags-Anfang


sway-present einbetten:

org-maße 760x500 geändert auf 640x480:


frühere Erkenntnisse zum Vergleich:

a) pdf-file:

https://docs.google.com/uc?export=download&id=0ByBtAoHDWeQnd0RtSS04bmR6Tkk

pdf-download-via-direct-link-app

b) ppt-file:

https://docs.google.com/presentation/d/1piQ2B83V8mdvXnjNjex1IMC8_Fkl_T4DdKlI11Kj-Ng/export/pdf

c) pptx-file:

https://docs.google.com/uc?export=download&id=0ByBtAoHDWeQnNzQ0Tm9jTGJPbVk

d) mom-file:

https://docs.google.com/uc?export=download&id=0ByBtAoHDWeQnMTFlTG41Qk9rQ3c

e) rtf-file:

https://docs.google.com/document/d/1VBmrrM7oPUkENQphrIqtSjbBRTYBiD_9VObm9Iczfag/export?format=pdf


pdf via ppt embedden__

+++ pdf-file (aus pptx erzeugt via pp.online) aus google-drive einbetten

geht nur per embed-trick, weil google drive selbst nur hyperlink erzeugt, nämlich diesen:
{https://drive.google.com/file/d/0ByBtAoHDWeQnd0RtSS04bmR6Tkk/view?usp=sharing}
3. ansicht der pdf-datei erscheint jetzt im browser (getestetz mit chrome!)
4. der browser-pdf-reader hat oben eine menu-zeile, in der u.a. "weitere Aktionen" (= meist button mit 3 senkrechten Punkten) aufgerufen werden können; unter jenen Aktionen gibt es das Untermenu "Element einbetten" - jenes erzeugt dann einen iframe-embedding-code
5. jenen iframe-embedding-code kopieren und in stackedit einfügen!!!

6. wird auch von WP richtig umgesetz!!!

P.S.: evtl. im iframe die darstellungsgröße auf:
width="800" Height="600" anpassen (vorher meist 640x480)

7. der User kann im eingebetteten pdf-fenster den button "in neuem Tab öffnen" drücken - pdf-datei erscheint jetzt im browser wie oben unter (3)
8. in der oberen menuzeile des pdf-readers sind buttons für a) download sowie b) drucken
.
ACHTUNG: hyperlinks auf den ppt-folien bleiben im pdf anclickbar!!!

.

original-embedding mit 640x480

angepasstes embedding mit 100%x600

test des embedding-codes aus google-docs (dort geöffnete pdf-datei) via -Datei-veröffentlichen im web:
funktioniert bestens, und zwar ebenfalls in WP!


BEACHTE: Maßangaben fehlen, daher selbst manuell ergänzen -nachfolgend z.B.: width="100%" height="800" - allerdings nur wichtig für eine eigene html-WebSite, denn WP kümmert sich nicht besonders um vorgegebene Maßgrößen, sondern WP passt sich wenn nötig die Maßgrößen (auch fehlende) optimal an die Vorgaben des jeweils von Ihnen gewählten WP-Themes an und sorgt gleichzeitig für eine responsive (!!!) Darstellung - was bei einer eigenen html-WebSite dagegen nicht immer gewährleistet ist

a) zunächst nachfolgend jetzt 100% x 800:


b) und jetzt das gleiche in Größe 100% x 600:


c) oder 100% x 640:


hier nur mal zum Vergleich als link aus gleicher quelle:
(P.S.: link erscheint bei eigener html-Site jeweils im gleichen tab!
bei einer spark-page wird der link aber in separatem tab geöffnet
Übrigens: google fügt unter dem link-ergebnis eine info-zeile hinzu und behauptet, alle 5 minuten den gezeigten inhalt upzudaten - stimmt aber nicht! - erst nach refresh der seite!!

zunächst direktes html-format aus google - dann via MD-hyperlink:
https://docs.google.com/document/d/1vKVhlpua3eCykOYgSCkti-qYNRbyIuLT0sCrNqlj7ss/pub


md-link aus google web-code


Diverse Tests

download aus gdocs erwirken

freigabelink aus gdocs
freigabelink aus gdrive
freigebenViaVorschau


jetzt via Umweg:

  1. gdoc-datei herunterladen als pdf
  2. pdf-datei hochladen nach gdrive
  3. via gdrive öffnen per vorschau
  4. aus der vorschau in "neuem fenster öffnen"
    5a. in diesem zusätzlichen fenter den embed-code kopieren (= iframe-code)
    6a. den embed-code in MD einfügen!
​​​​<iframe src="https://drive.google.com/file/d/1mG8weNCocqdDmFp9ew1mWT2PXQWSKMgf/preview" width="640" height="480"></iframe>

linkfreigabe aus gdocs-rosa - landet in gdocs

nachfolgend klappt ohne gdocs-opening ABER: TOC-links ohne funktion!?!

webveröffentlichung via gdocs als LINK

__nachfolgend gleiche Datei webveröffentlichung als embedded:


hubble-pdf aus wikip

Muster-1: via gdrive eingebettet:

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
das wiki-toc ist nicht mehr wirksam!


a) pdfwiki-2gdrive-plustoc-2pdf:

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
gdrive-tocs ohne wirkung!

pdfwiki-2gdrive-plustoc-2pdf

__b) EMBEDDED pdfwiki-2gdrive-plustoc-2pdf:

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
gdrive-tocs ohne wirkung!


Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
Vorteil-1: gdoc-tocs bleiben aktiv!!

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
__Vorteil-2: gdoc-webs lassen sich nach Anzeige per ctrl-p (bei embedded erst den gesamten Inhalt markieren) als pdf herunterladen, wobei im pdf nauch die tocs aktiv bleiben!!!

a2) jetzt als gdoc-veröff-link:

jetzt als gdoc-veröff-link ->

b2) jetzt als gdoc-veröff-EMBEDDED:


als download-link am besten den gdoc-web-veröff-link anbieten;
jener öffnet in sep. Tab und von dort lkann der Anwender per ctrl-p einen pdf-druck zum download selbst erzeugen;
diese pdf-datei behält die tocs aktiv bei!

bei Bedarf diesen Datei-Inhalt separat anzeigen und evtl. downloaden: ->


spark testen

Spark-Video-Link

spark-video embedded (org 960x540)

hier: (600x360)


Miro-Rahmen als pic einfügen

Miro-Rahmen-als-pic


Miro-Rahmen via gPräsent einbetten:


Miro-Rahmen via gPresent-01 (960x569)


Miro-Rahmen via gPresent-02 (800x479)(Seite 16x9) 🆗


Miro-Rahmen via gPresent-02 (720x434)(Seite 16x9)🆗🆗

evtl. für Smartphone am besten!?! 🆗🆗

Miro-Rahmen via gpresent-02-würfel (720x434) (Seite 16x9)


Miro-MindMap eingebettet

Monats-Zuordnung EUROPA


zurück zum Artikel-Anfang⤴️