WordpressのレスポンシブメニューのJavascript

申し訳ありませんが、これは基本的な質問ですが、私のウェブサイトでJavascript/jQueryスクリプトを使用する方法を理解できません。（これが十分に文書化されていて、適切な条件がわからない場合は、何を探すべきかを分けてください - 私は、私が知っていることでオンラインで運がなかった）WordpressのレスポンシブメニューのJavascript

私はすでに静的なページは、ちょうどブログがありませんでした。 Wordpressをページの1つに配置し、header.phpとfooter.phpファイルを使って既存のサイトのメニューにHTML/CSSデザインを追加する方法を考え出しました。しかし、メニューデザインを変更するためにページのサイズを変更したときにロードされるjQueryスクリプトは動作しません。

Iは<body onresize="myFunction()" <?php body_class(); ?>>にbodyタグを調整し、ファイルの<head>一部で<script type="text/javascript" src="jquery.min.js"></script>コードを貼り付け、そして</body>タグ上に、footer.phpファイルに「MyFunctionを」スクリプトを追加しました。上にもfunction myFunction() {私もwindow.onload=myFunction();が動作していない - ので、どのようなサイズでページが読み込まれているか、どのようなサイズに変更されても、メニューには反応しません。

エンキューコードブロックをfunctions.phpファイルに追加しようとすると、ページ全体が破損し、500エラーが発生しました。

アドバイスをいただければ幸いです！

出典

2016-09-19 L. Thane

コードを投稿できますか？ – spozun

jQueryライブラリに指定したパスが正しいことを確認してください。あなたのスクリプトタグのsrc="jquery.min.jsは相対パスです。これは、ファイルjquery.min.jsがあなたのsrcパスに従って、あなたのhtml/php/templateと同じディレクトリにあることを意味します。

CDNを使用することをおすすめします。相対パスはなく、jqueryファイルをロードする必要があります。また、他のページやサイトが同じファイルをロードしている場合は、ブラウザのキャッシュが有効になります。

3倍

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

2倍

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

出典

2016-09-19 19:51:20 mhatch

ハハ、オハイオ州の男、よろしくお願いします。私はそれに気付き、phpファイルと同じフォルダに新しいjquery.min.jsファイルを作成しましたが、あなたの提案を試してみると、今すぐ動作します。なぜそれがサーバー上のファイルを読んでいないのかわからないので、あなたの提案に感謝します！ –

うれしかった！あなたのWPページのパスは、おそらく静的なサイトと同じではないので、jsが同じフォルダにあってもパスは異なります。 – mhatch

あなたは、このようなワードプレスへのscripsやスタイルシートなどのリソースを追加するときは、機能wp_enqueue_script()とwp_enqueue_style()を使用してそれらをエンキューする必要があります。

このようにすると、scirpt/styleが一度だけ含まれ、依存関係を宣言することができます。また、スクリプトの場合は必要に応じてフッターに追加することができます。

あなたはコーデックスでこれらの関数の詳細情報を見つけることができます - これらの機能と連動して

を、あなたのスクリプトことを保証し、wp_enqueue_scriptsアクションを使用する必要がありますスタイルは正しい時刻にエンキューされます。

たとえば、functions.phpファイルに、このようなものを配置する必要があります。jQueryはWP内に既に存在するため、場所を指定する必要はなく、WPにエンキューすると伝えるだけです。 -

add_action('wp_enqueue_scripts', 'my_enqueue_jquery'); 
function my_enqueue_jquery(){ 
    wp_enqueue_script('jquery'); 
}

出典

2016-09-19 20:11:58

WordpressのレスポンシブメニューのJavascript

答えて

関連する問題