Avec un bloc Code Squarespace, vous pouvez placer votre bibliothèque de documents hébergée sur n’importe quelle page de votre site. Les étapes ci-dessous couvrent tout le processus.
Avant de commencer : les scripts d’intégration dans les blocs Code sont une fonctionnalité Squarespace payante qui nécessite l’offre Business ou supérieure. Gardez aussi à l’esprit que la bibliothèque n’est visible qu’une fois votre site en ligne. Pendant vos modifications, Squarespace affiche un espace réservé “Script Disabled” à la place de la bibliothèque fonctionnelle.
Étape 1 : copier votre code d’intégration
Dans votre tableau de bord hébergé, ouvrez Publier la bibliothèque pour trouver votre code d’intégration, puis copiez-le. La plupart des sites ont une seule bibliothèque, et la page Publier la bibliothèque est l’endroit où se trouve son code d’intégration. (Si vous avez créé plusieurs bibliothèques, copiez plutôt le code de celle que vous voulez depuis l’écran Bibliothèques .) Collez toujours le code exact provenant de votre propre tableau de bord, et non l’exemple ci-dessous :
<iframe src="https://your-library.documentlibrary.app/?dlp_embed=1" title="Document library" style="width:100%;border:0;height:600px;" loading="lazy"></iframe> <script src="https://your-library.documentlibrary.app/?dlp_embed_resize=1" async></script>
Étape 2 : créer une page pour votre bibliothèque
Depuis votre tableau de bord Squarespace, allez dans Website → Pages. Cliquez sur le + à côté de Main Navigation, choisissez Page, puis choisissez une mise en page vierge. Donnez-lui un nom comme Bibliothèque de documents, et Squarespace l’ajoutera à votre menu de navigation pour vous.
Étape 3 : ajouter un bloc Code
Ouvrez la nouvelle page et cliquez sur Modifier. Choisissez Ajouter une section, choisissez une section vierge, puis cliquez sur Ajouter un bloc, recherchez Code, et sélectionnez le Code bloc.
Étape 4 : coller votre code d’intégration
Cliquez dans le bloc Code pour l’ouvrir. Vérifiez que le mode est défini sur HTML, supprimez le texte par défaut “Hello, World!”, puis collez le code d’intégration de l’étape 1.
Étape 5 : redimensionner le bloc pour l’adapter à votre page
Ne sautez pas cette partie. Un bloc Code commence avec une largeur réduite, et un bloc étroit force la bibliothèque à passer sur une seule colonne. Sélectionnez le bloc Code et faites glisser son bord droit vers l’extérieur jusqu’à ce qu’il couvre la largeur souhaitée pour la bibliothèque, généralement toute la page. Assurez-vous d’être en vue Ordinateur (l’icône de moniteur en haut) pendant cette opération, afin de donner à la bibliothèque assez d’espace pour afficher l’ensemble de ses colonnes.
Étape 6 : enregistrer et afficher votre bibliothèque
Cliquez sur Enregistrer. Le bloc indiquera “Script Disabled” pendant que vous modifiez encore la page, ce qui est attendu. Une fois votre site publié, ouvrez la page pour voir la bibliothèque fonctionner, où les visiteurs peuvent la rechercher, filtrer par catégorie et télécharger ou prévisualiser n’importe quel document.
Utiliser le bloc Code plutôt que le bloc Intégrer
Squarespace propose à la fois un bloc Code et un bloc Intégrer. Pour Document Library Pro, utilisez le Code bloc.
Si vous ajoutez votre code d’intégration à un Intégrer bloc, Squarespace peut afficher la bibliothèque dans un cadre court d’environ 200 pixels de haut. Vous pouvez voir le champ de recherche, les en-têtes de colonnes et seulement le premier document, avec un espace vide en dessous.
Pour corriger cela, supprimez le bloc Intégrer et ajoutez plutôt un bloc Code. Collez ensuite de nouveau votre code d’intégration en suivant les étapes ci-dessus.