Une option supplémentaire, selon le type de paramètres que vous devez transmettre. Appelons-le (2a). Vous pouvez également créer des scripts PHP qui génèrent dynamiquement text/cssou text/javascriptplutôt text/html, et leur fournir les données dont ils ont besoin en utilisant les paramètres GET plutôt qu'en chargeant WordPress. Bien sûr, cela ne fonctionne que si vous devez transmettre un nombre relativement petit de paramètres relativement compacts. Ainsi, par exemple, supposons que vous ne deviez transmettre que l'URL d'une publication ou le répertoire d'un fichier ou similaire, vous pouvez faire quelque chose comme ceci:
Dans header.php:
<script type="text/javascript" src="<?php print get_stylesheet_directory_uri();
?>/fancy-js.php?foo=bar&url=<?php print urlencode(get_permalink($post->ID)); ?>"></script>
Dans fancy-js.php:
<?php
header("Content-type: text/javascript");
?>
foo = <?php print json_encode($_GET['foo']); ?>;
url = <?php print json_encode($_GET['url']); ?>;
etc.
Mais cela vous permet uniquement d'accéder aux données directement transmises dans les paramètres GET; et cela ne fonctionnera que si le nombre de choses que vous devez transmettre est relativement petit et la représentation de ces choses relativement compacte. (Fondamentalement, une poignée de chaînes ou de valeurs numériques - un nom d'utilisateur, par exemple, ou un répertoire; pas une liste de tous les messages récents d'un utilisateur ou quelque chose comme ça.)
Quant à savoir laquelle de ces options est la meilleure - je ne sais pas; cela dépend de votre cas d'utilisation. L'option (1) a le mérite d'être simple et de vous permettre clairement d'accéder à toutes les données WordPress dont vous pourriez avoir besoin, sans les performances de chargement de WordPress deux fois. C'est presque certainement ce que vous devez faire, sauf si vous avez une bonne raison de ne pas le faire (par exemple, en raison de la taille de la feuille de style ou du script que vous devez utiliser).
Si la taille devient suffisamment grande pour causer un problème en termes de poids de votre page, vous pouvez essayer (2) ou (2a).
Ou bien - c'est probablement la meilleure idée - vous pouvez essayer de séparer les parties du script ou de la feuille de style qui utilisent réellement les données dynamiques des parties qui peuvent être spécifiées statiquement. Ssay vous avez une feuille de style qui doit passer un répertoire de WordPress afin de définir un paramètre d'arrière-plan pour l'élément # my-fancy. Vous pouvez mettre tout cela dans l'élément head:
<style type="text/css">
#my-fancy-element {
background-image: url(<?php print get_stylesheet_directory_uri(); ?>images/fancy.png);
padding: 20px;
margin: 20px;
font-weight: bold;
text-transform: uppercase;
font-size: 12pt;
/* ... KB and KB of additional styles ... */
}
#another-fancy-element {
/* ... KB and KB of additional styles ... */
}
/* ... KB and KB of additional styles ... */
</style>
Mais pourquoi auriez-vous besoin de faire cela? Il n'y a qu'une seule ligne ici qui dépend des données de WordPress. Mieux vaut ne séparer que les lignes qui dépendent de WordPress:
<style type="text/css">
#my-fancy-element {
background-image: url(<?php print get_stylesheet_directory_uri(); ?>images/fancy.png);
}
</style>
Mettez tout le reste dans une feuille de style statique que vous chargez avec un élément de lien standard (style.css ou autre):
#my-fancy-element {
/* background-image provided dynamically */
padding: 20px;
margin: 20px;
font-weight: bold;
text-transform: uppercase;
font-size: 12pt;
/* ... KB and KB of additional styles ... */
}
#another-fancy-element {
/* ... KB and KB of additional styles ... */
}
/* ... KB and KB of additional styles ... */
Et laissez la cascade faire le travail.
Il en va de même pour JavaScript: plutôt que de faire ceci:
<script type="text/javascript">
// Here comes a huge function that uses WordPress data:
function my_huge_function () {
// Do a million things ...
jQuery('#my-fancy').append('<a href="'+<?php json_encode(get_permalink($GLOBALS['post']->ID)); ?>+'">foo</a>);
// Do a million more things ...
my_other_function(<?php print json_encode(get_userdata($GLOBALS['post']->post_author); ?>);
}
function my_other_function (user) {
// Do a million things ...
}
</script>
Au lieu de cela, mettez quelque chose comme ça dans l'élément head:
<script type="text/javascript">
var WordPressPostData = {
url: <?php print json_encode(get_permalink($GLOBALS['post']->ID)); ?>,
author: <?php print json_encode(get_userdata($GLOBALS['post']->post_author)); ?>
}
</script>
Ensuite, déposez le reste dans un fichier JavaScript statique, réécrivant my_huge_function () et my_other_function () pour utiliser les globaux WordPressPostData.url et WordPressPostData.author.
40K de CSS ou 40K de JS peuvent presque toujours être divisés en <1K qui dépend en fait des données dynamiques, et le reste, qui peut être spécifié dans un fichier externe statique et ensuite recombiné en utilisant soit la cascade (pour CSS) ou globalement accessible variables (globales, éléments DOM, ou tout autre cubby-hole que vous préférez, pour JS).