Posso adicionar estilos ao rodapé com $ wp_styles-> add_data?

Estou trabalhando em um script para mover facilmente scripts js e css para o rodapé usando a function add_data em $ wp_scripts e $ wp_styles. Eu sei para scripts que, se o grupo for maior que 0, a chamada de script será movida para o rodapé (primeiro, abaixo, isso). No entanto, definir o grupo para estilos não tem o mesmo efeito (e o grupo está configurado corretamente com o segundo padrão). Existe uma maneira de mover estilos para o rodapé com o mesmo método, ou devo procurar uma alternativa?

function mod_scripts(){ global $wp_scripts, $wp_styles; foreach($wp_scripts->queue as $script){ if ( ! $wp_scripts->get_data( $script, 'group' ) ){ $wp_scripts->add_data( $script, 'group', 1 ); } } foreach($wp_styles->queue as $style){ if ( ! $wp_styles->get_data( $style, 'group' ) ){ $wp_styles->add_data( $style, 'group', 1 ); } } } 

EDITAR: O motivo da solicitação é que estou tentando remover o css de bloqueio para fazer uma página carregar mais rapidamente. O método recomendado é basicamente apenas incorporar o css diretamente na página, mas isso nunca funcionou bem. E agora percebo que a pergunta, como eu perguntei, é defeituosa. Estou apenas procurando uma maneira efetiva de carregar estilos que ainda mantenham a compatibilidade adequada com os plugins.

Solutions Collecting From Web of "Posso adicionar estilos ao rodapé com $ wp_styles-> add_data?"

Eu não sei qual é o seu motivo exato para isso, mas você deve remover a idéia de mover estilos para o rodapé. Se você tiver um ganho de velocidade, você pode ganhar uma quantidade não possível, se houver, mas isso será ao custo de outras coisas maiores.

Os estilos sempre devem ser adicionados dentro da tag . A razão é que as tags

fora das tags principais são HTML inválido. É por isso que você não possui essa opção para carregar estilos no rodapé com wp_enqueue_style e wp_register_style como você tem com scripts.

Eu repensaria seriamente essa idéia.

EDITAR

Como um sidenote de um comentário para esta resposta da @GM

wp_enqueue_style adicione tag, e não

one. No entanto, a marca não é permitida fora de também

Como @ pieter-goosen e @birgire em outras respostas e comentários, as especificações W3C não permitem css no rodapé, citar a página de especificações associada:

Um elemento de link deve ter um atributo rel .

Se o atributo rel é usado, o elemento é restrito ao elemento head .

Além disso, você deve notar que, quando você adiciona css no rodapé, quando alguém abre sua página, parece que não está cheio até que o CSS completo seja carregado: com conexões lentas sua página aparecerá quebrada por alguns segundos, os elementos ocultos por css serão visíveis, Os controles deslizantes aparecem como ul listas de imagens visíveis …

Então, na verdade, acho que é uma má idéia.

Dito isto, não gosto do tipo de respostas “não faço isso”, eu prefiro “você pode fazer isso desse jeito, mas sugiro não fazer isso”.

Então, aqui o jeito de fazer isso, mas oi, eu sugiro não fazer isso.

As coisas são mais fáceis, como você pode esperar: os scripts e os estilos devem ser adicionados no wp_enqueue_scripts hook, mas se você wp_head estilos depois que o wp_head hook foi triggersdo, os scripts e os estilos serão adicionados no rodapé.

Uma aplicação útil disso é quando os scripts são enqueados dentro de um callback curto, adicionando a possibilidade de adicionar scripts específicos do shortcode com facilidade.

Quanto aos estilos, o WordPress não é intransigente com as declarações do W3C e colocará os estilos no rodapé sem problemas.

Fluxo de trabalho:

  1. 'wp_print_styles' , quando todos os scripts e estilos já estão emtacados, mas não impressos
  2. armazene a fila atual para scripts e estilos em variables
  3. esvaziar a fila para scripts e estilos, desta forma, quando o WordPress olhar para imprimir scripts e estilos na cabeça não encontrará nada para imprimir
  4. 'wp_footer' com prioridade 0 e restaure os estilos e a fila de scripts que você armazenou no ponto 2 , assim, quando o WordPress procurar estilos e scripts para imprimir no rodapé pode encontrá-los e imprimi-los.

Tudo pode ser feito em algumas linhas de código:

 add_action('wp_print_styles', function() { if ( ! doing_action( 'wp_head' ) ) { // ensure we are on head return; } global $wp_scripts, $wp_styles; // save actual queued scripts and styles $queued_scripts = $wp_scripts->queue; $queued_styles = $wp_styles->queue; // empty the scripts and styles queue $wp_scripts->queue = array(); $wp_styles->queue = array(); $wp_scripts->to_do = array(); $wp_styles->to_do = array(); add_action( 'wp_footer', function() use( $queued_scripts, $queued_styles ) { // reset the queue to print scripts and styles in footer global $wp_scripts, $wp_styles; $wp_scripts->queue = $queued_scripts; $wp_styles->queue = $queued_styles; $wp_scripts->to_do = $queued_scripts; $wp_styles->to_do = $queued_styles; }, 0 ); }, 0); 

Nota

O código acima requer o PHP 5.3+ para o uso do fechamento e o WP 3.9 para o uso de doing_action .

Estava recentemente pesquisando esta questão especificamente devido ao requisito do Google PageSpeed ​​Insights:

Elimine o JavaScript e o CSS de bloqueio de renderização no conteúdo acima do dobra

Sua página possui 1 recurso de bloqueio de script e 1 bloqueio de resources CSS. Isso causa um atraso na renderização da sua página.

Nenhum dos conteúdos acima da dobra da sua página pode ser processado sem aguardar os seguintes resources para serem carregados. Tente adiar ou carregar assíncronamente resources de bloqueio, ou inline as partes críticas desses resources diretamente no HTML.

Otimizar CSS Entrega do seguinte:
… / style.min.css? ver = 4.8

A recomendação do Google era incorporar CSS crítico usando um bloco

em linha ... e carregar CSS não crítico via JavaScript.

Não consegui descobrir como usar as funções nativas do WordPress para enqueue um bloco de estilo nativo sem primeiro exigir uma folha de estilo externa (veja: wp_add_inline_style . Então, acabei de completar a tarefa usando o meu próprio template header.php e footer.php arquivos:

header.php

  < ?php wp_head(); ?>    

footer.php

     < ?php wp_footer(); ?>   

Nota: Meu bloco de estilo crítico inclui: body { opacity: 0; } body { opacity: 0; } como uma forma de ocultar conteúdo não denominado. Uma vez que minha folha de estilo diferida é carregada, ela inclui body { opacity: 1; } body { opacity: 1; } para limpar este atributo com uma transição.

A velocidade de carregamento da página provavelmente está sendo afetada por outros pedidos.
Como Pieter Goosen disse que provavelmente não vai notar a diferença.
Para provar isso: Remova esses pedidos de scripts e verifique a diferença na carga da página.

Com o Firefox ou as Ferramentas de desenvolvimento do Google Chrome, você pode verificar facilmente todos os pedidos e ver quais estão diminuindo o seu site.

Acelerar a carga da página:

  • verifique consultas SQL e otimize-as
  • minify scripts
  • use um plugin de cache

Felicidades

Independentemente das sugestões para não carregar o CSS no rodapé (e eu concordo com isso) se você realmente precisa carregar seu CSS no rodapé do frontend, então a maneira mais simples é conectar a function enqueue no wp_footer hook (ou admin_footer no caso de Admin) onde você encaue suas folhas de estilo:

 // change these variables to fit your needs $handle = 'my-css'; $css_url = plugins_url( 'plugin_style.css', __FILE__ ); $priority = 10; // make it 9999 if you want to enqueue it just before  add_action('wp_footer','enqueue_my_styles', $priority); function enqueue_my_styles(){ wp_enqueue_style( $handle, $css_url); }