{"id":1173,"date":"2026-10-14T11:13:18","date_gmt":"2026-10-14T11:13:18","guid":{"rendered":"https:\/\/documentlibrary.pro\/docs\/custom-css\/"},"modified":"2026-10-14T11:22:19","modified_gmt":"2026-10-14T11:22:19","slug":"custom-css","status":"publish","type":"doc","link":"https:\/\/documentlibrary.pro\/de\/docs\/custom-css\/","title":{"rendered":"Eigenes CSS"},"content":{"rendered":"

Du kannst Teile deiner Bibliothek gestalten, die der Tab Bibliotheksdesign nicht abdeckt, etwa den Hintergrund hinter der Bibliothek oder die Abst\u00e4nde innerhalb einer Karte.<\/p>\n

Wo du es findest<\/h2>\n

\u00d6ffnen Einstellungen<\/strong>, gehe zum Tab Erweitert<\/strong> und f\u00fcge dein CSS in das Feld Eigenes CSS<\/strong> ein. Es gilt f\u00fcr deine Bibliothek, wo auch immer sie erscheint: die Einbettung auf deiner eigenen Website und deine Bibliotheksseite auf documentlibrary.app.<\/p>\n

Warum das CSS deiner eigenen Website das nicht kann<\/h2>\n

Deine Bibliothek l\u00e4dt in einem iframe. Ein Browser h\u00e4lt die beiden Seiten getrennt, deshalb endet das CSS deiner Website am Rand der Bibliothek und reicht nie in sie hinein. Das Feld Eigenes CSS l\u00e4dt stattdessen innerhalb der Bibliothek.<\/p>\n

Die Grenze gilt auch umgekehrt. Eigenes CSS gestaltet deine Bibliothek und nichts anderes auf deiner Seite. Abstand, Breite oder Hintergrund rund um die Bibliothek geh\u00f6ren zu deiner eigenen Website.<\/p>\n

Was du gestalten kannst<\/h2>\n

Dies sind die unterst\u00fctzten Selektoren.<\/p>\n

    \n
  • Der Hintergrund der Bibliothek<\/strong> \u2013 body.dlp-embed<\/code> f\u00fcr die Einbettung, body.dlp-standalone<\/code> f\u00fcr deine Bibliotheksseite. Lass den Selektor weg, um beide zu gestalten.<\/li>\n
  • Eine Rasterkarte<\/strong> \u2013 .dlp-grid-card-inner<\/code><\/li>\n
  • Der Titel einer Rasterkarte<\/strong> \u2013 .dlp-grid-card-title<\/code><\/li>\n
  • Die Tabelle<\/strong> \u2013 .data-table<\/code> f\u00fcr die Tabelle selbst, .table-cell<\/code> f\u00fcr eine Zelle<\/li>\n
  • Eine einzelne Tabellenspalte<\/strong> \u2013 .col-title<\/code>. Die anderen Spalten sind .col-excerpt<\/code>, .col-file_type<\/code>, .col-file_size<\/code>, .col-date_modified<\/code>, .col-doc_categories<\/code>, .col-link<\/code> und .col-button<\/code><\/li>\n
  • Die Buttons Download und Vorschau<\/strong> \u2013 .dlp-download-button<\/code> und .dlp-preview-button<\/code><\/li>\n
  • Das Suchfeld<\/strong> \u2013 .search-input<\/code><\/li>\n
  • Ein Filter-Dropdown<\/strong> \u2013 .select-display-trigger<\/code><\/li>\n
  • Die Zeile unter der Bibliothek mit den Seitenzahlen<\/strong> \u2013 .footer-controls<\/code>und .pagination-btn<\/code> f\u00fcr eine Seitenzahl<\/li>\n<\/ul>\n

    Beispiele<\/h2>\n

    Ein Hintergrundbild durch die Karten scheinen lassen:<\/p>\n

    body.dlp-embed .dlp-grid-card-inner {\n    background-color: rgba(255, 255, 255, 0.8);\n}<\/pre>\n
    Eine Spalte in der Einbettung ausblenden und die Bibliotheksseite unver\u00e4ndert lassen:<\/p>\n
    body.dlp-embed .col-excerpt {\n    display: none;\n}<\/pre>\n
    Die Dokumenttitel \u00fcberall gr\u00f6\u00dfer machen:<\/p>\n
    .col-title {\n    font-size: 17px;\n}<\/pre>\n
    Gut zu wissen<\/h2>\n
      \n
    • Dein CSS wird nach unserem geladen, deshalb setzen sich normale Regeln durch und du brauchst nur selten !important<\/code>. Ein paar Tabellenzellen-Stile werden zuletzt geladen, f\u00fcge daher !important<\/code> hinzu, wenn eine Regel nicht greift.<\/li>\n
    • Schau zuerst im Tab Bibliotheksdesign. Vorlagen, Farben, Buttons und welche Spalten erscheinen, sind alle Einstellungen dort. Einstellungen sind nicht betroffen, wenn wir die Bibliothek aktualisieren.<\/li>\n
    • Wir unterst\u00fctzen die oben aufgef\u00fchrten Selektoren. Alles andere im Markup pflegst du selbst.<\/li>\n
    • Das Feld nimmt nur CSS an. Es entfernt alles, was kein Stil ist, du kannst dar\u00fcber also keine Skripte oder HTML einf\u00fcgen.<\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"
      You can style parts of your library that the Library design tab doesn\u2019t cover, such as the background behind the library or the spacing inside a card. Where to find it Open Settings, go to the Advanced tab, and paste your CSS into the Custom CSS box. It applies to your library wherever it appears: […]<\/p>\n","protected":false},"menu_order":165,"template":"","meta":{"footnotes":""},"doc_category":[4],"class_list":["post-1173","doc","type-doc","status-publish","hentry","doc_category-building-your-library"],"yoast_head":"\nCustom CSS<\/title>\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\/custom-css\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Custom CSS\" \/>\n<meta property=\"og:description\" content=\"You can style parts of your library that the Library design tab doesn\u2019t cover, such as the background behind the library or the spacing inside a card. Where to find it Open Settings, go to the Advanced tab, and paste your CSS into the Custom CSS box. It applies to your library wherever it appears: […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/documentlibrary.pro\/de\/docs\/custom-css\/\" \/>\n<meta property=\"og:site_name\" content=\"Document Library Pro\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-14T11:22:19+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/dlp-og-image.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\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\\\/custom-css\\\/\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/custom-css\\\/\",\"name\":\"Custom CSS\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#website\"},\"datePublished\":\"2026-10-14T11:13:18+00:00\",\"dateModified\":\"2026-10-14T11:22:19+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/custom-css\\\/#breadcrumb\"},\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/custom-css\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/custom-css\\\/#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\":\"Custom CSS\"}]},{\"@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":"Eigenes CSS","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\/custom-css\/","og_locale":"de_DE","og_type":"article","og_title":"Custom CSS","og_description":"You can style parts of your library that the Library design tab doesn\u2019t cover, such as the background behind the library or the spacing inside a card. Where to find it Open Settings, go to the Advanced tab, and paste your CSS into the Custom CSS box. It applies to your library wherever it appears: […]","og_url":"https:\/\/documentlibrary.pro\/de\/docs\/custom-css\/","og_site_name":"Document Library Pro","article_modified_time":"2026-10-14T11:22:19+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/dlp-og-image.png","type":"image\/png"}],"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\/custom-css\/","url":"https:\/\/documentlibrary.pro\/docs\/custom-css\/","name":"Eigenes CSS","isPartOf":{"@id":"https:\/\/documentlibrary.pro\/#website"},"datePublished":"2026-10-14T11:13:18+00:00","dateModified":"2026-10-14T11:22:19+00:00","breadcrumb":{"@id":"https:\/\/documentlibrary.pro\/docs\/custom-css\/#breadcrumb"},"inLanguage":"de-DE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/documentlibrary.pro\/docs\/custom-css\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/documentlibrary.pro\/docs\/custom-css\/#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":"Custom CSS"}]},{"@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\/1173","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\/1173\/revisions"}],"predecessor-version":[{"id":1174,"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/doc\/1173\/revisions\/1174"}],"wp:attachment":[{"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/media?parent=1173"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/documentlibrary.pro\/de\/wp-json\/wp\/v2\/doc_category?post=1173"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}