{"id":3304,"date":"2013-01-26T15:51:12","date_gmt":"2013-01-26T14:51:12","guid":{"rendered":"https:\/\/www.creativejuiz.fr\/blog\/?p=3304"},"modified":"2013-06-02T11:34:34","modified_gmt":"2013-06-02T09:34:34","slug":"astuce-wordpress-charger-fichiers-js-css-contact-form-7","status":"publish","type":"post","link":"https:\/\/www.creativejuiz.fr\/blog\/tutoriels\/astuce-wordpress-charger-fichiers-js-css-contact-form-7","title":{"rendered":"Astuce WordPress : charger les fichiers JS et CSS de Contact Form 7 uniquement si n\u00e9cessaire"},"content":{"rendered":"

Contact Form 7<\/a> est devenu l’un des plugins de r\u00e9f\u00e9rence pour quiconque souhaite construire un formulaire enti\u00e8rement personnalisable sur WordPress. Comme tout plugin, il tente de r\u00e9pondre \u00e0 une probl\u00e9matique en englobant un maximum de contextes, aussi, les fichiers JS et CSS qu’il embarque sont ins\u00e9r\u00e9s sur toutes les pages de votre site par d\u00e9faut.<\/p>\n

La probl\u00e9matique<\/h2>\n

Charger ces fichiers sur la totalit\u00e9 de vos pages web demande au visiteur des ressources inutiles.
\nL’impact est moindre sur un visiteur qui poss\u00e8de une bonne connexion internet, mais \u00e0 l’\u00e8re du mobile (entendez par l\u00e0, mobilit\u00e9, donc tablette, mini-tablette, smartphone etc.) et des connexions souvent moins bonnes que notre bon vieux 56k, la moindre \u00e9conomie est bonne \u00e0 prendre.<\/p>\n

Je ne sais pas si le probl\u00e8me est commun, mais comme je vois beaucoup d’articles qui proposent de d\u00e9sactiver les fichiers JS et CSS de Contact Form 7<\/a> (merci pour l’astuce au passage !), j’en vois beaucoup moins qui proposent de les charger uniquement en cas de besoin, ce qui permettrait de continuer \u00e0 b\u00e9n\u00e9ficier des fonctionnalit\u00e9s et styles de base du plugin.<\/p>\n

Une solution ?<\/h2>\n

Il doit en exister des meilleures, mais pour le moment j’en ai trouv\u00e9 une qui fonctionne plut\u00f4t bien.
\nCollez ce code \u00e0 la fin de votre fichier functions.php<\/code>.<\/p>\n

\/**\r\n * Contact Form 7 - Load files only if necessary\r\n *\/\r\n\r\nif (!function_exists('juiz_wpcf7_dequeue_scripts_styles')) {\r\n\tfunction juiz_wpcf7_dequeue_scripts_styles() {\r\n\t\tif ( WPCF7_LOAD_JS && WPCF7_LOAD_CSS ) {\r\n\t\t\tglobal $post;\r\n\t\t\tif ( !strpos($post->post_content, '[contact-form-7') ) {\r\n\t\t\t\twp_dequeue_script('contact-form-7');\r\n\t\t\t\twp_dequeue_style('contact-form-7');\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\tadd_action( 'wp_enqueue_scripts', 'juiz_wpcf7_dequeue_scripts_styles' );\r\n}<\/code><\/pre>\n
Quelques explications s’imposent peut-\u00eatre.<\/p>\n
Les constantes WPCF7_LOAD_JS<\/code> et WPCF7_LOAD_CSS<\/code> sont d\u00e9finies par le plugin lorsqu’il est activ\u00e9. Elles retournent true<\/code> lorsqu’elles existent, false<\/code> si un r\u00e9glage particulier est fait, et ne sont pas d\u00e9finies si le plugin n’est pas activ\u00e9.
\nDu coup mon code propose d’intervenir uniquement si le plugin est activ\u00e9, et si les fichiers demandent \u00e0 \u00eatre charg\u00e9s.<\/p>\n
Le reste du code v\u00e9rifie si on trouve le shortcode de Contact Form 7 dans le contenu, si ce n’est pas<\/strong> le cas, alors on retire les fichiers du chargement gr\u00e2ce aux fonctions wp_dequeue_script()<\/code> et wp_dequeue_style()<\/code>.<\/p>\n
Il est possible d’\u00eatre beaucoup plus pr\u00e9cis en v\u00e9rifiant si la constante CSS existe d’une part pour d\u00e9sactiver uniquement CSS en cas de besoin, d’autre part la JS pour ne d\u00e9sactiver que la JS.
\nPersonnellement je ne d\u00e9sactive pas l’un sans l’autre en g\u00e9n\u00e9rale \ud83d\ude42<\/p>\n
Je n’ai pas encore trouv\u00e9 de probl\u00e8me \u00e0 cette mani\u00e8re de faire, mais j’ai encore le nez dedans, donc n’h\u00e9sitez pas \u00e0 commenter si vous trouvez \u00e0 redire ! La seule limite c’est le preg_match()<\/code> qui s’ex\u00e9cute sur chaque contenu, m’enfin on a rien sans rien.<\/del>
\nMerci \u00e0 jb pour l’optimisation<\/a><\/ins><\/p>\n","protected":false},"excerpt":{"rendered":"
Contact Form 7 est devenu l’un des plugins de r\u00e9f\u00e9rence pour quiconque souhaite construire un formulaire enti\u00e8rement personnalisable sur WordPress. Comme tout plugin, il tente de r\u00e9pondre \u00e0 une probl\u00e9matique en englobant un maximum de contextes, aussi, les fichiers JS et CSS qu’il embarque sont ins\u00e9r\u00e9s sur toutes les pages de votre site par d\u00e9faut.<\/p>\n","protected":false},"author":4,"featured_media":3307,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bluesky_dont_syndicate":"","_bluesky_syndication_accounts":"","_bluesky_syndication_text":"","footnotes":""},"categories":[9,13],"tags":[437,228,539,540],"coauthors":[],"class_list":["post-3304","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutoriels","category-wordpress","tag-add_action","tag-astuce","tag-wp_dequeue_script","tag-wp_dequeue_style"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts\/3304","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/comments?post=3304"}],"version-history":[{"count":0,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts\/3304\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/media\/3307"}],"wp:attachment":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/media?parent=3304"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/categories?post=3304"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/tags?post=3304"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/coauthors?post=3304"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}