A maneira mais eficiente de adicionar arquivo javascript a post e / ou páginas específicas?


17

Gostaria de saber qual é o método mais eficiente para adicionar um arquivo javascript especificamente para uma postagem e / ou página.

Aqui estão algumas soluções que eu criei:

  • Alterne para a visualização de edição HTML e publique seu JavaScript (solução muito ruim)
  • Campos personalizados com o JavaScript específico para essa postagem / página nos pares chave e valor
  • No footer.php, carregue arquivos JavaScript, dependendo da página em que você está (isso leva a muitos condicionais)

Em uma nota lateral, nenhum dos arquivos JavaScript será compartilhado entre as páginas - ele será literalmente específico para o que você está visualizando no momento.

Alguma ideia?


Meta boxes / campos personalizados são a melhor opção
Miha Rekar 10/10

Como você definiria eficiência?
fuxia

11
Por 'eficiente', quero dizer a menor quantidade de redundância de código e a maneira mais eficaz de fazer isso especificamente para uma única postagem / página.
Mousesports

Respostas:


29

Eu acho que o melhor equilíbrio entre eficiência e o uso de métodos wordpress adequados para adicionar javascript seria adicionar algo nesse sentido ao seu arquivo functions.php de temas. Por exemplo:

functions.php:

function load_scripts() {
    global $post;

    if( is_page() || is_single() )
    {
        switch($post->post_name) // post_name is the post slug which is more consistent for matching to here
        {
            case 'home':
                wp_enqueue_script('home', get_template_directory_uri() . '/js/home.js', array('jquery'), '', false);
                break;
            case 'about-page':
                wp_enqueue_script('about', get_template_directory_uri() . '/js/about-page.js', array('jquery'), '', true);
                break;
            case 'some-post':
                wp_enqueue_script('somepost', get_template_directory_uri() . '/js/somepost.js', array('jquery'), '1.6', true);
                break;
        }
    } 
}

add_action('wp_enqueue_scripts', 'load_scripts');

Isso dá a você controle total sobre o que é carregado onde, um local centralizado nos seus temas functions.php para editar o que é carregado onde: e, dessa maneira, usa métodos wordpress para adicionar javascript às suas postagens e páginas com segurança .


11
Pequena função agradável. Você está certo quanto a ser útil ter um 'local centralizado'. Muitíssimo obrigado.
Mousesports #

3
Eu acho que isso pode ser limpo um pouco. Você está basicamente checando a mesma coisa com dois casos de troca diferentes. Eu diria que combina os dois casos de troca e o condicional, se possível if (is_page() || is_single()). O que você acha Ben?
Mousesports

Parece uma melhoria para mim. Um bom!
Ben HartLenn

@ Ben é o functions.php um tema interno ou no wp-includes ? o título da minha página é Acesso à página inicial on - line e eu mudei sua função homepara Access to Home Onlinemas não está funcionando?
Ciasto piekarz

@Ciastopiekarz Atualizei minha resposta para mostrar melhor que o código está no seu arquivo functions.php de temas.
Ben HartLenn

2

O que eu faria é colocar no rodapé ou no cabeçalho e usar condicionais php.

Por exemplo:

<?php if (is_page ('your-page')){?>

  <script type="text/javascript" src"the file path"></script>

<?php } elseif ( is_page ('another')){?>

  <script type="text/javascript" src"the file path"></script>

<?php } else { ?>

  <script type="text/javascript" src"the file path"></script>

<?php } ?>

Dessa forma, você não chama todos os scripts o tempo todo em cada página carregada e apenas os que você precisa.

Aqui está um link para o codex do Wordpress http://codex.wordpress.org/Conditional_Tags

E se você tiver scripts especiais que talvez precisem ser chamados apenas por postagem, use campos personalizados.


Obrigado Nicole - este foi # 3. É uma solução decente, considerando que não terei muitas páginas ... ainda considerando.
Mousesports

O que eu tenho acima pode ser usado com os vários itens do codex wordpress, como: is_categories, is_single (para posts), is_post_type ... Adicionei um link para a lista condicional do wordpress na minha resposta acima.
Nicole

0

A outra maneira testada abaixo é adicionar a página diretamente do editor e adicionar comentários com a tag de script, caso contrário, não funcionará.

<script type="text/javascript">
<!--
var a = 5;
alert("hello world. The value of a is: " + a);
-->
</script>
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.