{"id":275,"date":"2026-06-23T18:31:13","date_gmt":"2026-06-23T18:31:13","guid":{"rendered":"https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/"},"modified":"2026-09-14T13:04:36","modified_gmt":"2026-09-14T13:04:36","slug":"add-document-library-webflow","status":"publish","type":"doc","link":"https:\/\/documentlibrary.pro\/de\/docs\/add-document-library-webflow\/","title":{"rendered":"So f\u00fcgst du deine Dokumentbibliothek zu Webflow hinzu"},"content":{"rendered":"<p>Ein Code Embed-Element ist der Weg, um deine gehostete Dokumentbibliothek auf einer beliebigen Webflow-Seite zu platzieren. Die folgenden Schritte f\u00fchren dich von Anfang bis Ende durch den Prozess.<\/p>\n<p><strong>Bevor du beginnst:<\/strong> Code Embed ist eine kostenpflichtige Webflow-Funktion, enthalten im <strong>Basic Site-Tarif und h\u00f6her<\/strong>. Der kostenlose Starter-Tarif blockiert benutzerdefinierten Code, daher ist ein kostenpflichtiger Site-Tarif erforderlich, bevor du die Einbettung hinzuf\u00fcgen und ver\u00f6ffentlichen kannst. Beachte, dass die Bibliothek nur gerendert wird, wenn du eine Vorschau anzeigst oder ver\u00f6ffentlichst. W\u00e4hrend der Designer zum Bearbeiten ge\u00f6ffnet ist, zeigt Webflow einen Platzhalter statt der Live-Bibliothek an.<\/p>\n<h2 id=\"step-1-copy-your-embed-code\">Schritt 1: Kopiere deinen Einbettungscode<\/h2>\n<p>\u00d6ffne in deinem gehosteten Dashboard <strong>Publish Library<\/strong> , um deinen Einbettungscode zu finden, und kopiere ihn dann. Die meisten Websites haben eine einzige Bibliothek, und auf der Seite Bibliothek ver\u00f6ffentlichen befindet sich ihr Einbettungscode. (Wenn du mehr als eine Bibliothek erstellt hast, kopiere stattdessen den Code f\u00fcr die gew\u00fcnschte Bibliothek aus dem <strong>Libraries<\/strong> Bildschirm.) F\u00fcge immer den exakten Code aus deinem eigenen Dashboard ein, nicht das Beispiel unten:<\/p>\n<pre>&lt;iframe src=\"https:\/\/your-library.documentlibrary.app\/?dlp_embed=1\" title=\"Document library\" style=\"width:100%;border:0;height:600px;\" loading=\"lazy\"&gt;&lt;\/iframe&gt;\n&lt;script src=\"https:\/\/your-library.documentlibrary.app\/?dlp_embed_resize=1\" async&gt;&lt;\/script&gt;<\/pre>\n<h2 id=\"step-2-create-a-page-for-your-library\">Schritt 2: Erstelle eine Seite f\u00fcr deine Bibliothek<\/h2>\n<p>\u00d6ffne im Webflow Designer das <strong>Seiten<\/strong> Panel und klicke auf <strong>+<\/strong> , um eine neue Seite zu erstellen, und nenne sie zum Beispiel <strong>Dokumentenbibliothek<\/strong>. Damit Besucher sie finden, f\u00fcge in deinem Navigationsmen\u00fc einen Link zu dieser Seite hinzu.<\/p>\n<h2 id=\"step-3-add-a-code-embed-element\">Schritt 3: F\u00fcge ein Code Embed-Element hinzu<\/h2>\n<p>Klicke bei ge\u00f6ffneter neuer Seite auf das <strong>+<\/strong> Panel (Elemente hinzuf\u00fcgen), suche nach <strong>Einbetten<\/strong>, und zieh das <strong>Code einbetten<\/strong> Element auf den Abschnitt, in den die Bibliothek geh\u00f6rt.<\/p>\n<h2 id=\"step-4-paste-your-embed-code\">Schritt 4: F\u00fcge deinen Einbettungscode ein<\/h2>\n<p>Der Code-Editor erscheint automatisch. Entferne allen Platzhaltertext, f\u00fcge das Snippet aus Schritt 1 ein und klicke auf <strong>Speichern &amp; Schlie\u00dfen<\/strong>.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/06\/webflow-embed-document-library.jpg\" alt=\"Einf\u00fcgen des Einbettungscodes der Dokumentbibliothek in ein Webflow Code Embed-Element\" style=\"max-width:100%;height:auto;border:1px solid #e3e8ee;border-radius:8px;margin:8px 0;\" \/><\/p>\n<h2 id=\"step-5-publish-and-view-your-library\">Schritt 5: Ver\u00f6ffentliche deine Bibliothek und sieh sie dir an<\/h2>\n<p>W\u00e4hrend der Bearbeitung zeigt Webflow einen Platzhalter an der Stelle des Code Embed an. Um die Website live zu schalten, klicke oben rechts auf <strong>Ver\u00f6ffentlichen<\/strong> und \u00f6ffne dann die Seite, um deine Dokumentbibliothek zu sehen. Besucher k\u00f6nnen darin suchen, nach Kategorie filtern und jedes Dokument in der Vorschau ansehen oder herunterladen. Wenn du vor dem Livegang einen Blick darauf werfen m\u00f6chtest, klicke im Designer auf <strong>Vorschau<\/strong> (das Augensymbol).<\/p>","protected":false},"excerpt":{"rendered":"<p>Bette deine gehostete Dokumentbibliothek mit einem Code Embed-Element auf jeder Webflow-Seite ein und ver\u00f6ffentliche sie, damit Besucher Dateien suchen und herunterladen k\u00f6nnen.<\/p>","protected":false},"menu_order":70,"template":"","meta":{"footnotes":""},"doc_category":[6],"class_list":["post-275","doc","type-doc","status-publish","hentry","doc_category-platforms"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to add your document library to Webflow<\/title>\n<meta name=\"description\" content=\"Embed your hosted document library on any Webflow page using a Code Embed element, then publish so visitors can search and download files.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/documentlibrary.pro\/de\/docs\/add-document-library-webflow\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to add your document library to Webflow\" \/>\n<meta property=\"og:description\" content=\"Embed your hosted document library on any Webflow page using a Code Embed element, then publish so visitors can search and download files.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/documentlibrary.pro\/de\/docs\/add-document-library-webflow\/\" \/>\n<meta property=\"og:site_name\" content=\"Document Library Pro\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-14T13:04:36+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/06\/webflow-embed-document-library.jpg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-webflow\\\/\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-webflow\\\/\",\"name\":\"How to add your document library to Webflow\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-webflow\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-webflow\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/documentlibrary.pro\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/webflow-embed-document-library.jpg\",\"datePublished\":\"2026-06-23T18:31:13+00:00\",\"dateModified\":\"2026-09-14T13:04:36+00:00\",\"description\":\"Embed your hosted document library on any Webflow page using a Code Embed element, then publish so visitors can search and download files.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-webflow\\\/#breadcrumb\"},\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-webflow\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de-DE\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-webflow\\\/#primaryimage\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/webflow-embed-document-library.jpg\",\"contentUrl\":\"https:\\\/\\\/documentlibrary.pro\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/webflow-embed-document-library.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-webflow\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/documentlibrary.pro\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Docs\",\"item\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to add your document library to Webflow\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#website\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/\",\"name\":\"Document Library Pro\",\"description\":\"Searchable document libraries for any website\",\"publisher\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/documentlibrary.pro\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de-DE\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#organization\",\"name\":\"Document Library Pro\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de-DE\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/favicon-512.png\",\"contentUrl\":\"https:\\\/\\\/documentlibrary.pro\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/favicon-512.png\",\"width\":512,\"height\":512,\"caption\":\"Document Library Pro\"},\"image\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"description\":\"Document Library Pro is hosted document library software that lets you publish searchable, filterable libraries of PDFs, documents and resources on any website or platform.\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"So f\u00fcgst du deine Dokumentbibliothek zu Webflow hinzu","description":"Bette deine gehostete Dokumentbibliothek mit einem Code Embed-Element auf jeder Webflow-Seite ein und ver\u00f6ffentliche sie, damit Besucher Dateien suchen und herunterladen k\u00f6nnen.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/documentlibrary.pro\/de\/docs\/add-document-library-webflow\/","og_locale":"de_DE","og_type":"article","og_title":"How to add your document library to Webflow","og_description":"Embed your hosted document library on any Webflow page using a Code Embed element, then publish so visitors can search and download files.","og_url":"https:\/\/documentlibrary.pro\/de\/docs\/add-document-library-webflow\/","og_site_name":"Document Library Pro","article_modified_time":"2026-09-14T13:04:36+00:00","og_image":[{"url":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/06\/webflow-embed-document-library.jpg","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/","url":"https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/","name":"So f\u00fcgst du deine Dokumentbibliothek zu Webflow hinzu","isPartOf":{"@id":"https:\/\/documentlibrary.pro\/#website"},"primaryImageOfPage":{"@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/#primaryimage"},"image":{"@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/#primaryimage"},"thumbnailUrl":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/06\/webflow-embed-document-library.jpg","datePublished":"2026-06-23T18:31:13+00:00","dateModified":"2026-09-14T13:04:36+00:00","description":"Bette deine gehostete Dokumentbibliothek mit einem Code Embed-Element auf jeder Webflow-Seite ein und ver\u00f6ffentliche sie, damit Besucher Dateien suchen und herunterladen k\u00f6nnen.","breadcrumb":{"@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/#breadcrumb"},"inLanguage":"de-DE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/"]}]},{"@type":"ImageObject","inLanguage":"de-DE","@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/#primaryimage","url":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/06\/webflow-embed-document-library.jpg","contentUrl":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/06\/webflow-embed-document-library.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-webflow\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/documentlibrary.pro\/"},{"@type":"ListItem","position":2,"name":"Docs","item":"https:\/\/documentlibrary.pro\/docs\/"},{"@type":"ListItem","position":3,"name":"How to add your document library to Webflow"}]},{"@type":"WebSite","@id":"https:\/\/documentlibrary.pro\/#website","url":"https:\/\/documentlibrary.pro\/","name":"Document Library Pro","description":"Durchsuchbare Dokumentenbibliotheken f\u00fcr jede Website","publisher":{"@id":"https:\/\/documentlibrary.pro\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/documentlibrary.pro\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de-DE"},{"@type":"Organization","@id":"https:\/\/documentlibrary.pro\/#organization","name":"Document Library Pro","url":"https:\/\/documentlibrary.pro\/","logo":{"@type":"ImageObject","inLanguage":"de-DE","@id":"https:\/\/documentlibrary.pro\/#\/schema\/logo\/image\/","url":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/06\/favicon-512.png","contentUrl":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/06\/favicon-512.png","width":512,"height":512,"caption":"Document Library Pro"},"image":{"@id":"https:\/\/documentlibrary.pro\/#\/schema\/logo\/image\/"},"description":"Document Library Pro ist eine gehostete Dokumentenbibliothekssoftware, mit der du durchsuchbare, filterbare Bibliotheken mit PDFs, Dokumenten und Ressourcen auf jeder Website oder Plattform ver\u00f6ffentlichen kannst."}]}},"_links":{"self":[{"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/doc\/275","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/doc"}],"about":[{"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/types\/doc"}],"version-history":[{"count":1,"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/doc\/275\/revisions"}],"predecessor-version":[{"id":368,"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/doc\/275\/revisions\/368"}],"wp:attachment":[{"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/media?parent=275"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/doc_category?post=275"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}