web-dev-qa-db-ja.com

WordPressにJavaScriptコードを正しく追加する方法

コードエディタで、次のように貼り付けます。

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script>
    var words = [];

    words.Push('vocabulary');
    words.Push('Lexicon');
    words.Push('lexicons');

  </script>

それを作るでしょう：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script><br />
    var words = [];</p>
<p>    words.Push('vocabulary');<br />
    words.Push('Lexicon');<br />
    words.Push('lexicons');</p>
<p>  </script>

バージョンは4.9.8です。適切に追加する方法


FYI： jQueryを正しくインクルードする方法

javascripthtml-editorline-breaks
1
Ooker

コーデックス（ 投稿のJavaScript ）はまさにこのシナリオをカバーしています。ジャバスクリプトを1回限りの投稿に含める。ですから、あなたのJavascriptが過去に機能したかどうかに関係なく、現在最良のアプローチはコーデックスで説明されている慣習を使用することです。

これらは私が従ったステップです：

1 - JavaScriptをファイルに保存して、サイトの適切なフォルダに保存します。私は私のテーマの "js"フォルダに私のものを入れます。

これは私の例です。私はそれが機能しているかどうかを証明するためにいくつかのコードを追加しました。

function vocab(){
var words = [];
words.Push('vocabulary');
words.Push('Lexicon');
words.Push('lexicons');
    for (var key in words) {
            var value = words[key];

            console.log(key + ' : ' + value);
    }
}

2 - [テキスト]タブを使用して、投稿エディタに以下をコピーします。

JavaScriptファイルの名前とフォルダの場所が、手順1の名前と場所と一致していることがわかります。

<script type="text/javascript" src="/wp-content/themes/twentysixteen-child/js/vocab.js"></script>
<script type="text/javascript">
<!--
vocab();
//-->
</script>

3-投稿を見る

投稿は空白/空に見えます（タイトルを除く）。しかし、JavaScriptは実行されます。

これが私のjavascriptの出力を示すChromeのコンソールのスナップショットです。

enter image description here 

更新：

テキストやメディアを挿入したり、「ビジュアル」タブをクリックしたりすることについても、細心の注意を払う必要があります。いずれにせよ、JavaScriptが危険にさらされて実行されないように見えます。

これは、単に[ビジュアル]タブをクリックし、次に[テキスト]タブをクリックした後のコードです。投稿が保存されて表示されたとき、JavaScriptはnotを実行しました。

<script type="text/javascript" src="/wp-content/themes/twentysixteen-child/js/vocab.js"><span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_start"></span></script>
<script type="text/javascript">
<!-- vocab(); //--></script>

投稿にテキストやメディアを入力する予定の場合、その解決策は次のようになります。

  • [テキスト]タブに（適切なHTMLで）入力します

または

  • [ビジュアル]タブを使用したら、[テキスト]タブをクリックして
  • それに応じてJavaScriptコードを編集します。
  • まだ[テキスト]タブにある間に保存/更新します。

更新＃2：2018年8月23日

Javascriptおよび「ビジュアル」タブに問題がある可能性については、Codexの最後まで読んで（私は明らかにそうではありませんでしたが）、問題は「 トラブルシューティング 」で説明しています。 テキストコントロールプラグイン が推奨される解決策です。

"jQueryをロードする必要がありますか？"または、「あいまいさを避けましょう」

短い答え=いいえ.
長い答え=このQ&Aは、1回限りのWordPress投稿のJavascriptに関するものです。しかし、JavascriptとjQueryは同じものではありません（ Source ）。したがって、1回限りの投稿にjQueryコードを含めたい場合は、このQ&Aは適用されません。

WordPressには、jQueryと関連するjQueryコードをロードするためのプロトコルが大きく異なります。それは難しいことではありません、そして wp_enqueue_script と " jQueryの使用 "は読むのにふさわしい場所です。

1
Tedinoz