Una opción adicional, dependiendo del tipo de parámetros que necesita pasar. Llamémoslo (2a). También puede crear scripts PHP que generen text/css o text/javascript generados dinámicamente en lugar de text/html , y proporcionarles los datos que necesitan utilizando parámetros GET en lugar de cargar WordPress. Por supuesto, esto solo funciona si necesita pasar un número relativamente pequeño de parámetros relativamente compactos. Entonces, por ejemplo, digamos que necesita pasar solo la URL de una publicación o el directorio de un archivo o similar, puede hacer algo como esto:
En 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>
En fancy-js.php:
<?php
header("Content-type: text/javascript");
?>
foo = <?php print json_encode($_GET['foo']); ?>;
url = <?php print json_encode($_GET['url']); ?>;
etc.
Pero esto solo le permite acceder a los datos directamente pasados en los parámetros GET; y solo funcionará si el número de cosas que necesita pasar es relativamente pequeño, y la representación de esas cosas es relativamente compacta. (Básicamente, un puñado de valores numéricos o de cadena: un nombre de usuario, por ejemplo, o un directorio; no una lista de todas las publicaciones recientes de un usuario o algo así).
En cuanto a cuál de estas opciones es la mejor, no lo sé; Eso depende de tu caso de uso. La opción (1) tiene el mérito de ser simple, y le permite claramente acceder a cualquier información de WordPress que pueda necesitar, sin el impacto en el rendimiento de cargar WordPress dos veces. Es casi seguro que deberías hacer lo que quieras, a menos que tengas una buena razón para no hacerlo (por ejemplo, debido al tamaño de la hoja de estilo o secuencia de comandos que necesitas usar).
Si el tamaño es lo suficientemente grande como para causar un problema en términos del peso de su página, entonces puede probar (2) o (2a).
O bien, esta es probablemente la mejor idea: puede intentar separar las partes del script o la hoja de estilo que realmente hace uso de los datos dinámicos de las partes que se pueden especificar de forma estática. Dice que tienes una hoja de estilo que necesita pasar un directorio de WordPress para establecer un parámetro de fondo para el elemento # my-fancy. Podrías poner todo esto en el elemento principal:
<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>
¿Pero por qué necesitarías hacer eso? Aquí solo hay una línea que depende de los datos de WordPress. Es mejor dividir solo las líneas que dependen de WordPress:
<style type="text/css">
#my-fancy-element {
background-image: url(<?php print get_stylesheet_directory_uri(); ?>images/fancy.png);
}
</style>
Coloque todo lo demás en una hoja de estilo estática que carga con un elemento de enlace estándar (style.css o lo que sea):
#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 ... */
Y deja que la cascada haga el trabajo.
Lo mismo ocurre con JavaScript: en lugar de hacer esto:
<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>
En su lugar, coloca algo como esto en el elemento principal:
<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>
Y luego coloque el resto en un archivo JavaScript estático, reescribiendo my_huge_function () y my_other_function () para hacer uso de los globales WordPressPostData.url y WordPressPostData.author.
40K de CSS o 40K de JS casi siempre se pueden dividir en < 1K que realmente depende de datos dinámicos, y el resto, que se puede especificar en un archivo externo estático y luego se puede combinar usando la cascada (para CSS) o variables accesibles globalmente (globales, elementos DOM o cualquier otro agujero de cubículo que prefiera, para JS).