Uma opção adicional, dependendo do tipo de parâmetro que você precisa passar. Vamos chamá-lo (2a). Você também pode criar scripts PHP com saída gerada dinamicamente text/css
ou text/javascript
melhor text/html
, e fornecer a eles os dados de que precisam usando os parâmetros GET em vez de carregar o WordPress. Obviamente, isso só funciona se você precisar passar um número relativamente pequeno de parâmetros relativamente compactos. Por exemplo, digamos que você precise passar apenas o URL de uma postagem ou o diretório de um arquivo ou similar, você pode fazer algo assim:
No 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>
Em fancy-js.php:
<?php
header("Content-type: text/javascript");
?>
foo = <?php print json_encode($_GET['foo']); ?>;
url = <?php print json_encode($_GET['url']); ?>;
etc.
Mas isso permite apenas o acesso aos dados transmitidos diretamente nos parâmetros GET; e só funcionará se o número de coisas que você precisa transmitir for relativamente pequeno e a representação dessas coisas relativamente compacta. (Basicamente, são poucos os valores numéricos ou de seqüência de caracteres - um nome de usuário, por exemplo, ou um diretório; não uma lista de todas as postagens recentes de um usuário ou algo parecido.)
Quanto a qual dessas opções é a melhor - eu não sei; isso depende do seu caso de uso. A opção (1) tem o mérito de ser simples e permitir claramente o acesso a qualquer dado do WordPress que você possa precisar, sem o impacto no desempenho de carregar o WordPress duas vezes. É quase certamente o que você deve fazer, a menos que tenha uma forte razão para não fazê-lo (por exemplo, devido ao tamanho da folha de estilo ou script que você precisa usar).
Se o tamanho se tornar grande o suficiente para causar um problema em termos de peso de uma página, experimente (2) ou (2a).
Ou então - provavelmente essa é a melhor idéia - você pode tentar separar as partes do script ou da folha de estilo que realmente usam os dados dinâmicos das partes que podem ser especificadas estaticamente. Diga que você tem uma folha de estilo que precisa receber um diretório do WordPress para definir um parâmetro de segundo plano para o elemento # my-fancy. Você pode colocar tudo isso no elemento 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>
Mas por que você precisaria fazer isso? Existe apenas uma linha aqui que depende dos dados do WordPress. Melhor dividir apenas as linhas que dependem do WordPress:
<style type="text/css">
#my-fancy-element {
background-image: url(<?php print get_stylesheet_directory_uri(); ?>images/fancy.png);
}
</style>
Coloque todo o resto em uma folha de estilo estática carregada com um elemento de link padrão (style.css ou o que for):
#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 ... */
E deixe a cascata fazer o trabalho.
O mesmo vale para JavaScript: em vez de fazer isso:
<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>
Em vez disso, coloque algo assim no elemento 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>
Em seguida, solte o restante em um arquivo JavaScript estático, reescrevendo as funções my_huge_function () e my_other_function () para fazer uso das globais WordPressPostData.url e WordPressPostData.author.
40K de CSS ou 40K de JS quase sempre podem ser divididos em <1K que realmente depende de dados dinâmicos e o restante, que pode ser especificado em um arquivo externo estático e depois recombinado usando a cascata (para CSS) ou acessível globalmente variáveis (globais, elementos DOM ou qualquer outro cubículo que você preferir, para JS).