{"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\/es\/docs\/custom-css\/","title":{"rendered":"CSS personalizado"},"content":{"rendered":"

Puedes dar estilo a partes de tu biblioteca que la pesta\u00f1a Dise\u00f1o de la biblioteca no cubre, como el fondo detr\u00e1s de la biblioteca o el espaciado dentro de una tarjeta.<\/p>\n

D\u00f3nde encontrarlo<\/h2>\n

Abre Ajustes<\/strong>, ve a la pesta\u00f1a Avanzado<\/strong> y pega tu CSS en el campo CSS personalizado<\/strong> correspondiente. Se aplica a tu biblioteca donde sea que aparezca: la inserci\u00f3n en tu propia web y la p\u00e1gina de tu biblioteca en documentlibrary.app.<\/p>\n

Por qu\u00e9 el CSS de tu propia web no puede hacerlo<\/h2>\n

Tu biblioteca se carga dentro de un iframe. El navegador mantiene separadas las dos p\u00e1ginas, as\u00ed que el CSS de tu web se detiene en el borde de la biblioteca y nunca llega a su interior. El campo CSS personalizado se carga dentro de la biblioteca.<\/p>\n

El mismo l\u00edmite se aplica al rev\u00e9s. El CSS personalizado da estilo a tu biblioteca y a nada m\u00e1s de tu p\u00e1gina. El espaciado, el ancho o el fondo alrededor de la biblioteca son cosa de tu propia web.<\/p>\n

Qu\u00e9 puedes personalizar<\/h2>\n

Estos son los selectores admitidos.<\/p>\n

    \n
  • El fondo de la biblioteca<\/strong> \u2013 body.dlp-embed<\/code> para la inserci\u00f3n, body.dlp-standalone<\/code> para la p\u00e1gina de tu biblioteca. Omite el selector para dar estilo a las dos.<\/li>\n
  • Una tarjeta de la cuadr\u00edcula<\/strong> \u2013 .dlp-grid-card-inner<\/code><\/li>\n
  • El t\u00edtulo de una tarjeta de la cuadr\u00edcula<\/strong> \u2013 .dlp-grid-card-title<\/code><\/li>\n
  • La tabla<\/strong> \u2013 .data-table<\/code> para la tabla en s\u00ed, .table-cell<\/code> para una celda<\/li>\n
  • Una sola columna de la tabla<\/strong> \u2013 .col-title<\/code>. Las dem\u00e1s columnas son .col-excerpt<\/code>, .col-file_type<\/code>, .col-file_size<\/code>, .col-date_modified<\/code>, .col-doc_categories<\/code>, .col-link<\/code> y .col-button<\/code><\/li>\n
  • Los botones Descargar y Vista previa<\/strong> \u2013 .dlp-download-button<\/code> y .dlp-preview-button<\/code><\/li>\n
  • El campo de b\u00fasqueda<\/strong> \u2013 .search-input<\/code><\/li>\n
  • Un desplegable de filtro<\/strong> \u2013 .select-display-trigger<\/code><\/li>\n
  • La fila bajo la biblioteca con los n\u00fameros de p\u00e1gina<\/strong> \u2013 .footer-controls<\/code>, y .pagination-btn<\/code> para un n\u00famero de p\u00e1gina<\/li>\n<\/ul>\n

    Ejemplos<\/h2>\n

    Dejar que una imagen de fondo se vea a trav\u00e9s de las tarjetas:<\/p>\n

    body.dlp-embed .dlp-grid-card-inner {\n    background-color: rgba(255, 255, 255, 0.8);\n}<\/pre>\n
    Ocultar una columna en la inserci\u00f3n y dejar la p\u00e1gina de tu biblioteca intacta:<\/p>\n
    body.dlp-embed .col-excerpt {\n    display: none;\n}<\/pre>\n
    Hacer m\u00e1s grandes los t\u00edtulos de los documentos en todas partes:<\/p>\n
    .col-title {\n    font-size: 17px;\n}<\/pre>\n
    Cosas que conviene saber<\/h2>\n
      \n
    • Tu CSS se carga despu\u00e9s del nuestro, as\u00ed que las reglas normales ganan y rara vez necesitas !important<\/code>. Algunos estilos de celda se cargan al final, as\u00ed que a\u00f1ade !important<\/code> si una regla no surte efecto.<\/li>\n
    • Mira primero en la pesta\u00f1a Dise\u00f1o de la biblioteca. Las plantillas, los colores, los botones y las columnas que se muestran son ajustes de ah\u00ed. Los ajustes no se ven afectados cuando actualizamos la biblioteca.<\/li>\n
    • Admitimos los selectores de la lista de arriba. Todo lo dem\u00e1s del markup lo mantienes t\u00fa.<\/li>\n
    • El campo solo acepta CSS. Elimina todo lo que no sea un estilo, as\u00ed que no puedes a\u00f1adir scripts ni HTML por ah\u00ed.<\/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\/es\/docs\/custom-css\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\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\/es\/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\":\"es-ES\",\"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\":\"es-ES\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#organization\",\"name\":\"Document Library Pro\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es-ES\",\"@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":"CSS personalizado","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\/es\/docs\/custom-css\/","og_locale":"es_ES","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\/es\/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":"CSS personalizado","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":"es-ES","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":"Bibliotecas de documentos con b\u00fasqueda para cualquier sitio web","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":"es-ES"},{"@type":"Organization","@id":"https:\/\/documentlibrary.pro\/#organization","name":"Document Library Pro","url":"https:\/\/documentlibrary.pro\/","logo":{"@type":"ImageObject","inLanguage":"es-ES","@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 es un software de biblioteca de documentos alojada que le permite publicar bibliotecas con b\u00fasqueda y filtros de PDF, documentos y recursos en cualquier sitio web o plataforma."}]}},"_links":{"self":[{"href":"https:\/\/documentlibrary.pro\/es\/wp-json\/wp\/v2\/doc\/1173","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/documentlibrary.pro\/es\/wp-json\/wp\/v2\/doc"}],"about":[{"href":"https:\/\/documentlibrary.pro\/es\/wp-json\/wp\/v2\/types\/doc"}],"version-history":[{"count":1,"href":"https:\/\/documentlibrary.pro\/es\/wp-json\/wp\/v2\/doc\/1173\/revisions"}],"predecessor-version":[{"id":1174,"href":"https:\/\/documentlibrary.pro\/es\/wp-json\/wp\/v2\/doc\/1173\/revisions\/1174"}],"wp:attachment":[{"href":"https:\/\/documentlibrary.pro\/es\/wp-json\/wp\/v2\/media?parent=1173"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/documentlibrary.pro\/es\/wp-json\/wp\/v2\/doc_category?post=1173"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}