Hogyan ágyazható be a kitölthető/nem kitölthető PDF dokumentum a weboldalba?

Hogyan ágyazható be a kitölthető/nem kitölthető PDF dokumentum a weboldalba?

30 September 2021 0 Von admin

PDF Viewer hozzáadása – Feltölthető / nem kitölthető PDF dokumentum beágyazása a weboldalra?

Hogyan PDF dokumentumot ágyazhat be webhelyére soron belüli megtekintéshez? Itt van, hogyan kell PDF megtekintő hozzáadása, töltse ki a kitölthető PDF -et egy weboldalba és beágyaz pdf -t a webhelyekre.

A PDF a Portable Document Format rövidítése. A 90 -es évek elején egy fájlt operációs rendszer, hardver vagy bármilyen szoftver nélkül hoztak létre. Később, 1993 -ban az Adobe ezt a dokumentumtípust PDF -nek nevezte el, amely megoldást jelentett az eszközök és szoftverek közötti dokumentumátvitelre.

Az Adobe és sok más vállalat számos ingyenes PDF eszközt hozott létre Windows és Mac rendszerekhez.

Nagyon sok PDF fájlmegosztó webhely elérhető a PDF online közzétételéhez. Míg az Adobe PDF és a Sumatra PDF a legjobb PDF -megtekintő a dokumentumok online és számítógépes megtekintéséhez.

Most a PDF a dokumentumok online megjelenítésére szolgál pdf beágyazása a Html weboldalba.

Hogyan ágyazhat be pdf -et egy weboldalba?

Valójában az Embed csak egy szakkifejezés, amely azt jelenti, hogy „csatolni” kell, és ha PDF -fájlt szeretne csatolni egy weboldalhoz, szüksége van néhány PDF HTML kódolásra.

Többféle van hogyan lehet pdf fájlokat beágyazni a weboldalra. A pdf Html kód weboldalba való beágyazásának minden módja közel hasonló, de eltérő eredményeket mutat, és mindegyiket egyenként tárgyaljuk.

  1. PDF fájl beágyazása egy weboldalra az Adobe View SDK használatával (modern és lehetővé teszi a kitölthető PDF beágyazását a weboldalra)
  2. PDF beágyazása a webhelyre a címke használatával
  3. PDF beágyazása a webhelyre az címke használatával
  4. PDF fájlok megjelenítése a weblapon HTML címke használatával (régimódi)
  5. PDF fájl beágyazása HTML keretbe a PDF dokumentum megjelenítéséhez (régimódi)

1. PDF fájl beágyazása egy weboldalra az Adobe View SDK használatával

A HTML kód használata vagy PDF -fájlok feltöltése a Google Drive -ba és a Microsoft OneDrive -jába a leggyakoribb módszer a PDF -ek beágyazására. De csak egy probléma van, hogy elveszíti az irányítást azon felett, hogy ezek a PDF -fájlok hogyan jelennek meg webhelyein hűséges olvasói számára.

Ezért vezetett be az Adobe egy rendkívüli „új Adobe View SDK”, Hogy személyre szabottabb olvasási élményt nyújtson a webhelyén található PDF -fájlokhoz. Bár az Adobe Document Cloud platform része, teljesen ingyenes. Még Ön is bekapcsolhatja a feliratozó eszközöket a kitölthető pdf -ek beágyazásához a weboldalra.

PDF dokumentum beágyazási megoldás Adobe View SDK szolgáltatások

Az Adobe PDF dokumentumbeágyazási megoldás a következő nagyszerű funkciókkal rendelkezik:

  • Lehetővé teszi, hogy jegyzetelő eszközöket adjon hozzá a PDF -megtekintőhöz, mindenki jegyzetelheti a beágyazott kitölthető PDF -et a weboldalon, majd letöltheti a módosított fájlt.
  • Ha kikapcsolja a feliratozást a nem kitölthető PDF-fájlokban a webhelyeken, akkor egy rejtett megjegyzésekkel ellátott kód jön létre a {showAnnotationTools: false} tulajdonsággal
  • Hosszú beágyazott dokumentumok esetén, amelyek több html oldallal rendelkeznek, az olvasók az indexkép segítségével gyorsan átugorhatnak bármely témára/oldalra.
  • A dokumentumok testreszabásához választhat saját PDF-mintái vagy számos beépített PDF-minta közül.
  • Testreszabható megjelenítői felületet kínál teljes oldalas soros és tárolóbeágyazási módok használatával.
  • Lehetőséget biztosít a PDF -fájlok letöltésének és nyomtatásának elrejtésére a PDF -megtekintőben.
  • Biztosítsa a legjobb és legmegfelelőbb megjelenítési megoldást egyéni betűtípusokkal és oldalmargókkal.
  • Beépített elemzést kínál a felhasználók viselkedésének nyomon követésére, és jelentések készítésére arról, hogy hányan látták és fogyasztották a PDF dokumentumfájlt.
  • Végül a legigényesebb szolgáltatás, a ViewSDK, egy soros beágyazási mód.

PDF -oldalak megjelenítése sorban, például képek és videók

Adobe View SDK Inline módban a beágyazott PDF dokumentumok összes oldala egyszerre jelenik meg, és olvasóinak/látogatóinak nem kell más dokumentumot keresniük a webhelyén belül. A PDF -vezérlők rejtve vannak minden felhasználó elől, és csak a dokumentumot nézik a megfelelő képekkel és a szükséges HTML -tartalommal a weboldalon.

Ellenőrizd a Élő demó 7 oldalas PDF dokumentumokhoz, de mindegyik egyszerre jelenik meg egyetlen weboldalon, zökkenőmentes navigációval.

Hogyan lehet PDF fájlt beágyazni egy weboldalra az Adobe View SDK használatával?

A View SDK használatához néhány extra lépésre van szükség. Nyissa meg az adobe.io webhelyet, és hozzon létre új hitelesítő adathalmazt webhelyéhez. Kérjük, vegye figyelembe, hogy a hitelesítő adatok csak egy domainre érvényesek, ezért ha több webhelye van, akkor más hitelesítő adatokra lesz szüksége.

Íme, egyszerű, egyszerű lépések a PDF dokumentum beágyazásához az Adobe View Disk használatával:

  • Menj Adobe.io
  • Kattintson az Első lépések gombra új hitelesítő adatok létrehozásához webhelyéhez
  • Regisztrálhat Új fiók létrehozása, Google -fiók és egy Apple -fiók használatával.

PDF beágyazása a weboldal html -jébe

  • Bejelentkezés után válassza a DC view SDK lehetőséget, Adja meg a hitelesítő adatok nevét és az alkalmazás tartományát, töltse ki a Captcha -t, és kattintson a Hitelesítő adatok létrehozása elemre.

beágyazhatja a PDF -megtekintőt a weboldalba

  • ÜGYFÉL -azonosító (API KEY) sikeresen létrehozva

töltse ki a PDF -et a weboldalba

  • Kattintson a „Kódminta lekérése” gombra
  • A Dokumentumfelhő nézet SDK demó megnyílik előtted. A PDF dokumentumot a saját módján testreszabhatja és szerkesztheti. Be / Kikapcsolni feliratozó eszközökkel, hogy a PDF kitölthető legyen illetve kitölthetetlenek.
  • Kattintson a Kód létrehozása gombra, csak másolja ki és illessze be ezt a HTML -kódot beágyazhat egy PDF -megtekintőt egy weboldalba.

Az SDK -kód áttekintésének megtekintése az ügyfél -azonosítóval


Az SDK -kód áttekintésének megtekintése ügyfél -azonosító nélkül


Ebben a mintában csak ki kell cserélnie a clientId -t a hitelesítő adatokkal. Míg a mintakódban szereplő URL -nek a PDF fájl helyére kell mutatnia.

Nézze meg a Adobe hivatalos dokumentumok és a kódtár további mintákért.

2. PDF beágyazása a webhelyre a címke használatával

A címke és a href attribútum használata a legegyszerűbb módja a PDF beágyazásának a weboldalra. Egyszerűen hozzá kell adnia a PDF fájl URL -jét vagy hivatkozási linkjét, amely a fájl elérési útjára mutat.

A kód így fog kinézni:

Példa: PDF fájl beágyazása a weblap HTML -kódjába




A PDF dokumentum címe

Példa PDF -re

PDF fájl megnyitása
Példa PDF fájl beágyazására a weblap HTML -kódjába
.


3. PDF beágyazása a webhelyre az címke használatával

Az alábbiakban bemutatjuk, hogyan lehet PDF -t beágyazni a weboldalba a html5 használatával. Használja a következő kódpéldát a html fájlok szerkesztéséhez, adja meg a forrás URL -t, és állítsa be a magasságot és szélességet, a feladat kész.




A dokumentum címe

PDF példa objektummal

>/preview” width = ”100%” height = ”100%”>


  1. PDF fájlok megjelenítése weblapon HTML címke használatával.

Általában hiperhivatkozást használnak a PDF dokumentumok összekapcsolására a PDF fájlok webböngészőben történő megjelenítéséhez. Ha azonban PDF dokumentumokat szeretne megjeleníteni egy weboldalon, be kell ágyaznia a PDF fájlt html kódba. És a HTMLcímkét használják erre a célra.

A HTMLcímke tárolót készít, amely külső tartalmat tölt be a weboldalon. A következő paramétereket használja acímke.

  • src – a külső beágyazott fájl elérési útját határozza meg
  • típus – a beágyazott tartalom média típusát határozza meg
  • szélesség – a beágyazott PDF -tartalom szélességét határozza meg
  • magasság – meghatározza a beágyazott tartalom magasságát

PDF fájl beágyazása HTML kódba

Itt található a kód, amellyel be lehet ágyazni a PDF fájlt bármely HTML weboldalba.

A PDF dokumentum nézet vezérlése

Most irányítsuk a PDF dokumentum nézetét egy bizonyos weboldalon. Néhány további paramétert fogunk használni a HTML kódban, hogy mit jelenítsünk meg és hogyan jelenítsünk meg PDF dokumentumokat egy weboldalon.

  • oldal = pagenum – Megadja a dokumentum oldalának számát (egész számát). A dokumentum első oldalának pagenum értéke 1.
  • zoom = skála – Beállítja a nagyítási és görgetési tényezőket, figyelembe veszi az egész és lebegő értékeket. Ha 100 skálaértéket ad meg, a PDF 100% -os zoomértékkel rendelkezik
  • view = Fit – Állítsa be a megjelenített oldal nézetét.
  • görgetősáv = 1 | 0 – Be- vagy kikapcsolja a görgetősávokat.
  • navpanes = 1 | 0 – Kapcsolja BE vagy KI a navigációs ablakokat és a füleket
  • állapotsor = 1 | 0 – Kapcsolja BE vagy KI az állapotsort
  • eszköztár = 1 | 0 – Kapcsolja BE vagy KI az eszköztárat

Több paraméter megadása az URL -ben

Az URL -ben több paramétert is használhat. De minden paramétert el kell különítenie Pound (#) vagy ampersand (&) karakterek használatával. Míg a műveleteket balról jobbra hajtják végre, és az utolsó művelet felülírja az előző műveleteket.

https://example.com/doc.PDF#Chapter1
https://example.com/doc.PDF#page=3
https://example.com/doc.PDF#page=2&zoom=100,130,140
https://example.com/doc.PDF#zoom=200
https://example.com/doc.PDF#page=62&view=fitH,100

Az Eszköztár letiltása és elrejtése a PDF Web Viewer alkalmazásban

Ez a példa bemutatja, hogyan lehet elrejteni vagy eltávolítani a HTML -fájlbanmegnyitott PDF -fájl eszköztárát, navigációs paneljét és görgetősávját az URL -ben szereplő paraméterek használatával.

A következő példa leírja, hogyan lehet elrejteni a PDF dokumentumfájl eszköztárát, görgetősávját és navigációs paneljét, amikor megnyitja HRMLformátumban az URL paraméterei segítségével.

A következő kóddal beágyazhatja a PDF -megtekintőt egy PDF -eszköztár nélküli weboldalra.

5. PDF fájl beágyazása HTML keretbe a PDF dokumentum megjelenítéséhez

Egy másik hagyományos módszer az, hogy „PDF -fájl beágyazása HTML keretbe”, Amelyben PDF -fájlt tölt fel a Google Drive -ba, a Microsoft OneDrive -jába, és nyilvánossá teszi a fájlt, Másolja le a generált IFRAME -kódot ezekkel a szolgáltatásokkal, és gyorsan ágyazza be a dokumentumot bármely weboldalra.

Hogyan lehet beágyazni a PDF -megtekintőt a HTML -be az iframe segítségével?

A

Itt van egy másik minta PDF beágyazási kód a Google Drive -hoz, amely minden böngészőben működik, a Google Chrome, a Mozilla Firefox, a Safari és az UC böngészők stb.

2. példa – PDF fájl beágyazása HTML keretbe

Végső szavak

Megbeszéltük, hogyan lehet PDF -fájlt HTML -be ágyazni a dokumentumok megjelenítéséhez a Google Chrome, a Firefox, a Safari, az Internet Explorer és más böngészőkben. Melyik módszert találja hasznosnak a PDF -megtekintő weboldalba való beágyazásához? Vagy bármilyen más egyszerűbb és hasznos módszert használ a PDF webhelyekbe történő beágyazásához, mondja el nekünk az alábbi megjegyzés részben.