Comment conserver le contenu en bas de mes bons de livraison ?

Pour toujours forcer l'impression du contenu en bas de votre bon de livraison, vous devez d'abord définir où se trouve le « bas », puis insérer ce contenu dans une balise <div> avec des attributs de position spéciaux.

Important

Le contenu que vous fixez en bas de votre bon de livraison ne bougera jamais !

Cela peut entraîner un chevauchement avec un autre contenu lorsque la commande comporte un trop grand nombre d'articles ou une longue note de pied de page. Il peut être utile de disposer d'un modèle de remplacement qui exclut les modifications suivantes, au cas où le problème se présenterait.

Le code que vous devez ajouter varie en fonction de la disposition de votre bon de livraison. Pour ajouter ce code à votre modèle de bon de livraison, accédez au modèle de bon de livraison dans les Paramètres des modèles et procédez comme suit :

  1. Ajoutez le code suivant au début de la section En-tête de la commande (avant la première balise <table>) pour définir où se trouve le bas du bon de livraison :

    • 220 × 280 mm (8,5” x 11”) page entière :

      <style>
       .customStyle {
          position: relative;
          height:11in;
        } 
      </style>  
    • 220 mm x 280 mm (8,5” x 11”) demi-feuille :

      <style>
       .customStyle {
         position: relative;
         height:5.5in;
        } 
      </style>  
    • 100 mm × 150 mm (4" × 6") papier pour imprimante thermique :

      <style>
       .customStyle {
         position: relative;
         height:6in;
        } 
      </style>  

      Vous devrez peut-être ajuster la valeur de hauteur dans les extraits CSS ci-dessus, en fonction de votre contenu.

    Voici à quoi devrait ressembler le code de la page entière de 220 × 280 mm (8,5” x 11”) :

    Bon de livraison HTML : extrait de CSS pour personnaliser le style mis en surbrillance dans la section En-tête de commande.
  2. Repérez l'élément qui comporte le contenu que vous souhaitez fixer en bas de votre bon de livraison.

  3. Ajoutez le code suivant avant l'élément souhaité :

    <div style="bottom:0; position:absolute;width:100%;"> 
  4. Ajoutez ensuite le code suivant après l'élément souhaité :

    </div>
  5. Enregistrez vos modifications.

Voici un exemple de ce à quoi cela devrait ressembler (ici, l'élément <p> contenant le message de pied de page du bon de livraison est poussé vers le bas du bon de livraison) :

HTML du bon de livraison : la position >div et le HTML dans la section Pied de page de la commande sont mis en surbrillance.

Voici une image du bon de livraison obtenu, avec le message de pied de page fixé en bas :

Exemple de bon de livraison avec une flèche rouge pointant vers le texte de pied de page, imprimé en bas de la page.