Mise en page des tableaux avec HTML et CSS

Dans les fiches de description de nos articles dans Prestashop nous avons besoin de tableaux avec certaines caractéristiques.

Les modèles des tableaux que nous voulons utiliser existent déjà dans un blog qui présente une partie de la gamme que nous allons distribuer. Exemple avec cette page sur notre drisse de compétition.

Comme notre site est fait avec WordPress, la mise en page des tableaux est réalisée avec le plugin « WP-table reloaded »

Ce plugin ajoute un fichier CSS à WordPress. Ce fichier CSS est accessible dans l’onglet « options du plugin » (chemin complet : admin WordPress > Outils > WP-table reloaded > options du plugin).

Pour pouvoir utiliser la mise en forme des tableaux de WordPress il faut :

1. Copier le fichier CSS des tableaux de WordPress (voir chemin ci dessus) dans le fichier CSS de Prestashop (fichier global.css dans le répertoire CSS de votre thème Prestashop).
2. Afficher le code source de la page WordPress comprenant le tableau initial
3. Copier la partie du code entre <table> et </table> dans l’affichage du code source
4. Coller dans l’écran HTML (accessible par le bouton html de l’interface d’écriture des description de prestashop)
5. Sauvegarder et se réjouir du résultat.

Critique de cette méthode :

1. Très lourd. C’est un rouleau compresseur pour écraser une mouche.
2. Si les valeurs du tableau change, ce sont à la fois le blog WordPress et le site Prestashop qui sont à mettre à jour avec cette procédure très très lourde.
3. Globalement, je ne recommande pas cette méthode de bourrin.

Autres pistes à développer.

1. Faire des copier / coller depuis Excel. Pas propre du tout mais plus facile.
2. Inclure des images des tableaux : lourd à mettre en place et pas souple. Permet un partage entre plusieurs site des mêmes tableaux.
3. Faire des « include » de codes html des tableaux. Je ne sais pas si c’est envisageable et comment.