{"id":806,"date":"2026-08-17T16:36:01","date_gmt":"2026-08-17T16:36:01","guid":{"rendered":"https:\/\/documentlibrary.pro\/?post_type=doc&#038;p=806"},"modified":"2026-08-17T16:52:43","modified_gmt":"2026-08-17T16:52:43","slug":"add-document-library-hubspot","status":"publish","type":"doc","link":"https:\/\/documentlibrary.pro\/nl\/docs\/add-document-library-hubspot\/","title":{"rendered":"Add your document library to HubSpot"},"content":{"rendered":"<p>With HubSpot&#8217;s built-in Rich text module, you can place your hosted document library on any HubSpot page. The steps below cover the whole process.<\/p>\n<p><strong>Voordat je begint:<\/strong> This works on every HubSpot plan, including the free one. You do not need a paid upgrade or a custom module. HubSpot adds the library at a narrow fixed width, so there is one extra step to widen it later in the article. The HubSpot editor also may not show the finished result, so check the published page.<\/p>\n<h2>Kopieer je insluitcode<\/h2>\n<p>In your hosted Document Library Pro dashboard, open <strong>Bibliotheek publiceren<\/strong> and copy the embed code for your library. If you have built more than one library, open the <strong>Bibliotheken<\/strong> screen and copy the code for the specific library you want to add to HubSpot.<\/p>\n<p>Use your own embed code, not this sample:<\/p>\n<pre>&lt;iframe src=\"https:\/\/your-library.documentlibrary.app\/?dlp_embed=1\" title=\"Document library\" style=\"display:block;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>HubSpot free and Starter plans<\/h2>\n<p>HubSpot free and Starter plans do not let you build your own modules, so you use the built-in <strong>Rich text<\/strong> module. There are two ways to do it and both work the same.<\/p>\n<h3>Method 1: Insert the embed<\/h3>\n<ol>\n<li>Open the HubSpot page where you want to display the document library.<\/li>\n<li>Drag a <strong>Rich text<\/strong> module onto the page, or click a <strong>Rich text<\/strong> module that is already there.<\/li>\n<li>Klik <strong>Insert<\/strong> on the toolbar.<\/li>\n<li>Choose <strong>Embed<\/strong>.<\/li>\n<li>Paste your Document Library Pro embed code.<\/li>\n<li>Klik <strong>Insert<\/strong>.<\/li>\n<\/ol>\n<p><img decoding=\"async\" src=\"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/hubspot-edit-embed-code.jpg\" alt=\"The HubSpot Edit Embed window showing the document library embed code and the width box set to 317 pixels\" style=\"max-width:100%;height:auto;border:1px solid #e3e8ee;border-radius:8px;margin:8px 0;\" \/><\/p>\n<p>On the free plan, there is no separate <strong>Embed<\/strong> module in the module list. <strong>Rich text<\/strong> is the route.<\/p>\n<h3>Method 2: Paste it into the source code<\/h3>\n<ol>\n<li>Open the HubSpot page where you want to display the document library.<\/li>\n<li>Drag a <strong>Rich text<\/strong> module onto the page, or click a <strong>Rich text<\/strong> module that is already there.<\/li>\n<li>Klik <strong>Advanced<\/strong>.<\/li>\n<li>Choose <strong>Source code<\/strong>.<\/li>\n<li>Paste your Document Library Pro embed code.<\/li>\n<li>Klik <strong>Save changes<\/strong>.<\/li>\n<\/ol>\n<p>This method suits you if you are comfortable with HTML. It is also where you go later if you need to change the library width.<\/p>\n<h2>HubSpot Professional and Enterprise plans<\/h2>\n<p>Both methods above still work on HubSpot Professional and Enterprise plans, and they are the quickest route. These plans also unlock the design manager, so a developer can wrap the embed code in a custom module if your team wants to reuse it across many pages. This is optional and needs someone who is comfortable with HubSpot templates.<\/p>\n<h2>Make the library the right width<\/h2>\n<p>When you insert the library, HubSpot guesses how wide it should be. It picks something narrow, usually 317 pixels. As a result, the document library looks squashed into a thin column.<\/p>\n<p>HubSpot has a <strong>Full width<\/strong> button that would normally fix this. It does not work for the document library, because the library includes a small script. HubSpot greys the button out.<\/p>\n<p>That same greyed-out button also locks the width and height boxes. You cannot type a width there either.<\/p>\n<p>So the only way to set the width is in the source code:<\/p>\n<ol>\n<li>Click the <strong>Rich text<\/strong> module that contains your document library.<\/li>\n<li>Klik <strong>Advanced<\/strong>.<\/li>\n<li>Choose <strong>Source code<\/strong>.<\/li>\n<li>Find <strong>max-width: 317px<\/strong>.<\/li>\n<li>Change 317 to the width you want in pixels. 1100 is a sensible starting point for most pages.<\/li>\n<li>Klik <strong>Save changes<\/strong>.<\/li>\n<\/ol>\n<p><img decoding=\"async\" src=\"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/hubspot-advanced-source-code.jpg\" alt=\"A red arrow pointing to the Advanced button in the HubSpot Rich text toolbar, with the Edit source code window open showing the max-width value\" style=\"max-width:100%;height:auto;border:1px solid #e3e8ee;border-radius:8px;margin:8px 0;\" \/><\/p>\n<p>The library still shrinks to fit smaller screens and phones. The number you enter is a maximum width, not a fixed width.<\/p>\n<h2>Publish and check the page<\/h2>\n<p>Klik <strong>Publiceren<\/strong>, or <strong>Bijwerken<\/strong> if the page is already live.<\/p>\n<p>The library resizes itself to fit its contents. This means the HubSpot page grows and shrinks as visitors move between pages of documents.<\/p>\n<p>The HubSpot editor does not always show the finished result. Check the published page after you save the change.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/hubspot-document-library-front-end.jpg\" alt=\"Document Library Pro displayed on a published HubSpot page with search, category filter and download buttons\" style=\"max-width:100%;height:auto;border:1px solid #e3e8ee;border-radius:8px;margin:8px 0;\" \/><\/p>\n<h2>If the library does not appear<\/h2>\n<p>First, make sure you pasted both lines of the embed code. The second line is what lets the library resize itself.<\/p>\n<p>Next, check the published page instead of relying on the editor preview. The live page is the place to confirm that the document library is displaying correctly.<\/p>","protected":false},"excerpt":{"rendered":"<p>With HubSpot&#8217;s built-in Rich text module, you can place your hosted document library on any HubSpot page. The steps below cover the whole process. Before you begin: This works on every HubSpot plan, including the free one. You do not need a paid upgrade or a custom module. HubSpot adds the library at a narrow [&hellip;]<\/p>\n","protected":false},"menu_order":0,"template":"","meta":{"footnotes":""},"doc_category":[6],"class_list":["post-806","doc","type-doc","status-publish","hentry","doc_category-platforms"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Add your document library to HubSpot - Document Library Pro<\/title>\n<meta name=\"description\" content=\"Add a searchable document library to any HubSpot page. Works on the free plan, with the two methods and the width fix explained step by step.\" \/>\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\/nl\/docs\/add-document-library-hubspot\/\" \/>\n<meta property=\"og:locale\" content=\"nl_NL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Add your document library to HubSpot - Document Library Pro\" \/>\n<meta property=\"og:description\" content=\"Add a searchable document library to any HubSpot page. Works on the free plan, with the two methods and the width fix explained step by step.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/documentlibrary.pro\/nl\/docs\/add-document-library-hubspot\/\" \/>\n<meta property=\"og:site_name\" content=\"Document Library Pro\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-17T16:52:43+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/hubspot-edit-embed-code.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=\"3 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-hubspot\\\/\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-hubspot\\\/\",\"name\":\"Add your document library to HubSpot - Document Library Pro\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-hubspot\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-hubspot\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/documentlibrary.pro\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/hubspot-edit-embed-code.jpg\",\"datePublished\":\"2026-08-17T16:36:01+00:00\",\"dateModified\":\"2026-08-17T16:52:43+00:00\",\"description\":\"Add a searchable document library to any HubSpot page. Works on the free plan, with the two methods and the width fix explained step by step.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-hubspot\\\/#breadcrumb\"},\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-hubspot\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-hubspot\\\/#primaryimage\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/hubspot-edit-embed-code.jpg\",\"contentUrl\":\"https:\\\/\\\/documentlibrary.pro\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/hubspot-edit-embed-code.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/docs\\\/add-document-library-hubspot\\\/#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\":\"Add your document library to HubSpot\"}]},{\"@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\":\"nl-NL\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/documentlibrary.pro\\\/#organization\",\"name\":\"Document Library Pro\",\"url\":\"https:\\\/\\\/documentlibrary.pro\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@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":"Add your document library to HubSpot - Document Library Pro","description":"Add a searchable document library to any HubSpot page. Works on the free plan, with the two methods and the width fix explained step by step.","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\/nl\/docs\/add-document-library-hubspot\/","og_locale":"nl_NL","og_type":"article","og_title":"Add your document library to HubSpot - Document Library Pro","og_description":"Add a searchable document library to any HubSpot page. Works on the free plan, with the two methods and the width fix explained step by step.","og_url":"https:\/\/documentlibrary.pro\/nl\/docs\/add-document-library-hubspot\/","og_site_name":"Document Library Pro","article_modified_time":"2026-08-17T16:52:43+00:00","og_image":[{"url":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/hubspot-edit-embed-code.jpg","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-hubspot\/","url":"https:\/\/documentlibrary.pro\/docs\/add-document-library-hubspot\/","name":"Add your document library to HubSpot - Document Library Pro","isPartOf":{"@id":"https:\/\/documentlibrary.pro\/#website"},"primaryImageOfPage":{"@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-hubspot\/#primaryimage"},"image":{"@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-hubspot\/#primaryimage"},"thumbnailUrl":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/hubspot-edit-embed-code.jpg","datePublished":"2026-08-17T16:36:01+00:00","dateModified":"2026-08-17T16:52:43+00:00","description":"Add a searchable document library to any HubSpot page. Works on the free plan, with the two methods and the width fix explained step by step.","breadcrumb":{"@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-hubspot\/#breadcrumb"},"inLanguage":"nl-NL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/documentlibrary.pro\/docs\/add-document-library-hubspot\/"]}]},{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-hubspot\/#primaryimage","url":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/hubspot-edit-embed-code.jpg","contentUrl":"https:\/\/documentlibrary.pro\/wp-content\/uploads\/2026\/08\/hubspot-edit-embed-code.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/documentlibrary.pro\/docs\/add-document-library-hubspot\/#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":"Add your document library to HubSpot"}]},{"@type":"WebSite","@id":"https:\/\/documentlibrary.pro\/#website","url":"https:\/\/documentlibrary.pro\/","name":"Document Library Pro","description":"Zoekbare documentbibliotheken voor elke 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":"nl-NL"},{"@type":"Organization","@id":"https:\/\/documentlibrary.pro\/#organization","name":"Document Library Pro","url":"https:\/\/documentlibrary.pro\/","logo":{"@type":"ImageObject","inLanguage":"nl-NL","@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 gehoste documentbibliotheeksoftware waarmee u doorzoekbare, filterbare bibliotheken met PDF's, documenten en bronnen op elke website of platform kunt publiceren."}]}},"_links":{"self":[{"href":"https:\/\/documentlibrary.pro\/nl\/wp-json\/wp\/v2\/doc\/806","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/documentlibrary.pro\/nl\/wp-json\/wp\/v2\/doc"}],"about":[{"href":"https:\/\/documentlibrary.pro\/nl\/wp-json\/wp\/v2\/types\/doc"}],"version-history":[{"count":5,"href":"https:\/\/documentlibrary.pro\/nl\/wp-json\/wp\/v2\/doc\/806\/revisions"}],"predecessor-version":[{"id":878,"href":"https:\/\/documentlibrary.pro\/nl\/wp-json\/wp\/v2\/doc\/806\/revisions\/878"}],"wp:attachment":[{"href":"https:\/\/documentlibrary.pro\/nl\/wp-json\/wp\/v2\/media?parent=806"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/documentlibrary.pro\/nl\/wp-json\/wp\/v2\/doc_category?post=806"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}