La diff\u00e9rence n’est pas facile \u00e0 expliquer, car les deux crochets peuvent faire presque 1:1 la m\u00eame chose. Mais l’intention des actions est d’ajouter du contenu suppl\u00e9mentaire et l’intention d’un filtre est de modifier des donn\u00e9es d\u00e9j\u00e0 fournies par un plugin, un th\u00e8me ou le noyau de WP.Le plugin WooCommerce Print Products PDF utilise des crochets de filtrage pour modifier le HTML qui est plac\u00e9 dans le fichier PDF du produit. Nous allons utiliser le filtre woocommerce_print_products_product_html pour cr\u00e9er un mod\u00e8le personnalis\u00e9.Pour utiliser WP Hooks, il est recommand\u00e9 de cr\u00e9er un th\u00e8me enfant. Un th\u00e8me enfant h\u00e9rite de toutes les fonctionnalit\u00e9s du th\u00e8me principal. Ici, vous pouvez cr\u00e9er des fonctions personnalis\u00e9es ou modifier des styles sans tout perdre lors de la prochaine mise \u00e0 jour du th\u00e8me principal. La plupart des mod\u00e8les de Themeforest, par exemple, proposent un th\u00e8me enfant directement dans les fichiers t\u00e9l\u00e9charg\u00e9s. Il suffit d’installer le th\u00e8me principal + le th\u00e8me enfant, d’activer le th\u00e8me enfant et le tour est jou\u00e9. Dans l’apparence, vous verrez alors 2 th\u00e8mes, celui de l’enfant doit \u00eatre actif.<\/p>\n
Cr\u00e9ation de notre mod\u00e8le HTML personnalis\u00e9<\/h2>\n
As said we are going to use thewoocommerce_print_products_product_html filter. Ce filtre modifie la partie HTML compl\u00e8te du PDF, mais ne touche pas \u00e0 l’en-t\u00eate et au pied de page, que vous pouvez d\u00e9finir dans les param\u00e8tres du plugin.Ouvrez donc les fonctions.php dans votre th\u00e8me enfant et effectuez un petit test en ajoutant cette fonction :add_filter(‘woocommerce_print_product_product_html’, ‘custom_print_products_template’, 10, 2) ;function custom_print_products_template($html, $product_id){produit=wc_get_product($product_id) ;si(!$product) {retourner $html ;}$product_id=$product->get_id() ;$html=’test’ ;retourner $html ;}Appelez maintenant votre produit d’impression PDF URL comme ceci : https:\/\/yourdomain.com\/product\/YOUR_PRODUCT_URL\/?print-products=pdfVous verrez une simple cha\u00eene de test \u00e0 l’int\u00e9rieur du fichier incluant l’en-t\u00eate et le pied de page pr\u00e9d\u00e9finis, qui proviennent du plugin. C’est aussi simple que cela, vous pouvez maintenant ajouter du HTML personnalis\u00e9 au PDF comme vous le souhaitez.Nous allons ajouter d’autres donn\u00e9es sur les produits au format HTML :<\/p>\n
- \n
- Image du produit align\u00e9e \u00e0 gauche<\/li>\n
- Titre du produit + description \u00e0 droite<\/li>\n
- Champ m\u00e9ta personnalis\u00e9<\/li>\n<\/ul>\n
Ajouter l’image, le nom et la description du produit au PDF<\/h3>\n
Modifions donc la fonction ci-dessus et ajoutons quelques donn\u00e9es suppl\u00e9mentaires. Nous commen\u00e7ons par ajouter l’image, le titre et la description de notre produit. L’image sera plac\u00e9e dans une colonne de gauche et le bloc de titre dans une colonne de droite, nous avons donc besoin d’une feuille de style CSS personnalis\u00e9e pour assurer le flottement.add_filter(‘woocommerce_print_product_product_html’, ‘custom_print_products_template’, 10, 2) ;function custom_print_products_template($html, $product_id){\/\/ V\u00e9rifier si le produit existeproduit=wc_get_product($product_id) ;si(!$product) {retourner $html ;}\/\/ Obtenir l’identifiant du produit$product_id=$product->get_id() ;\/\/ Stylisation CSS personnalis\u00e9e$html=’.conteneur {padding : 20px ;}.col-12 {largeur : 100 % ;padding : 10px ;}.col-6 {largeur : 45% ;float : left ;padding : 10px ;}’ ;\/\/ Commencez par un conteneur$html .= ” ;\/\/ Obtenir l’URL de l’image du produit$product_image_url=get_the_post_thumbnail_url($product_id) ;si($product_image_url) {$html .= ‘
‘ ;}\/\/ Obtenir le nom et la description du produitNom du produit=$product->get_name() ;$product_desc=$product->get_description() ;si(Nom du produit) {$html .= ‘<\/p>\n
‘ . Nom du produit . ‘<\/h1>\n
‘ . $product_desc . ‘<\/p>\n
‘ ;}$html .= ” ;retourner $html ;}Nous avons ajout\u00e9 des feuilles de style CSS personnalis\u00e9es pour les blocs flottants et ajout\u00e9 un peu de rembourrage. Nous utilisons ensuite l’objet $product et appelons des fonctions pour recevoir des donn\u00e9es telles que le nom, la description, etc. Vous pouvez trouver une liste compl\u00e8te des fonctions \u00e0 appeler sur l’objet produit de WooCommerce ici. Nous avons ensuite renvoy\u00e9 le code HTML et voici ce que cela donne :<\/p>\n
Ajout d’un champ de produit personnalis\u00e9 au PDF<\/h3>\n
Si vous utilisez des champs d’articles personnalis\u00e9s, vous pouvez utiliser la fonction get_post_meta de WordPress pour recevoir les valeurs. WooCommerce stocke \u00e9galement les m\u00e9tadonn\u00e9es dans la table post_meta. Par exemple, le prix, qui peut \u00e9galement \u00eatre r\u00e9cup\u00e9r\u00e9 en utilisant $product->get_price() ; function. Ainsi, pour les champs m\u00e9ta vraiment uniques comme ceux du plugin ACF ou d’autres plugins personnalis\u00e9s, la fonction ci-dessus est cruciale pour obtenir les donn\u00e9es. Un exemple d’utilisation de get_post_meta pour g\u00e9n\u00e9rer un champ personnalis\u00e9 dans notre pdf WooCommerce :$html .= ” ;\/\/ Obtenir un champ personnalis\u00e9$custom_field=get_post_meta($product_id, ‘custom_field’, true) ;si($custom_field) {$html .= ‘<\/p>\n
‘ . $custom_field . ‘<\/p>\n
‘ ;}$html .= ” ;Et c’est tout. Si vous utilisez ACF par exemple, vous pouvez utiliser la fonction ACF get_field au lieu de get_post_meta.Si vous avez d’autres questions sur la fa\u00e7on de cr\u00e9er un mod\u00e8le PDF personnalis\u00e9 pour un produit, n’h\u00e9sitez pas \u00e0 commenter cet article ci-dessous.<\/p>\n","protected":false},"excerpt":{"rendered":"
En tant que propri\u00e9taire de boutique, vous voudrez peut-\u00eatre donner \u00e0 vos clients la possibilit\u00e9 de t\u00e9l\u00e9charger des PDF directement depuis WooCommerce. Que ce soit parce que vos utilisateurs ont besoin d’une version imprim\u00e9e, que vos vendeurs ont besoin de brochures sur les produits lorsqu’ils rendent visite \u00e0 des partenaires ou que vos clients ont…<\/p>\n","protected":false},"author":1,"featured_media":788,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[4],"tags":[],"class_list":["post-672","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-woocommerce"],"_links":{"self":[{"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/posts\/672","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/comments?post=672"}],"version-history":[{"count":10,"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/posts\/672\/revisions"}],"predecessor-version":[{"id":8987,"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/posts\/672\/revisions\/8987"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/media\/788"}],"wp:attachment":[{"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/media?parent=672"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/categories?post=672"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.welaunch.io\/fr\/wp-json\/wp\/v2\/tags?post=672"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}