WordPressを使っていると、自分でjavascriptを書きたい場合などがでてきます。パターンとしてはサイト全体に適用したい場合と、個別のページで適用したい場合があると思います。
全体に適用したい場合はSimple Custom CSS and JS というプラグインを使うと容易に設定することができます。また、個別ページにのみ適用したい場合はScripts n Stylesというプラグインを使うことをおすすめします。
この記事ではSimple Custom CSS and JS と Scripts n Styles の使い方などを色々と試してみたいと思います。
Simple Custom CSS and JS の使い方
Simple Custom CSS and JS を使って書いたコードはサイト内のすべてのページに対して適用されます。すべてのページで共通して行いたい処理(JavaScript)やデザイン(CSS)などを一括で設定することができます。
プラグインのインストール
まずはプラグインをインストールします。その後有効化します。
JavaScript コードを追加
有効化すると、左のメニューに「カスタム CSS & JS」が表示されます。こちらのカスタムJSの追加を選択します
下記のコードを追加して公開してみます。ページを開いた際にポップアップでメッセージを表示します
jsが適用されていることが確認できました！
このほかにもHTMLのHEAD、CSSを設定することもできます。
Scripts n Styles の使い方
Scripts n Styles を使って書いたコードはサイト内の個別のページに対して適用されます。投稿ページにそれぞれ入力する場所があるので、そこでそのページに対して追加したいコードを記述する形になります。
プラグインのインストール
まずはプラグインをインストールします。その後有効化します。
JavaScript コードを追加
有効化した後に新規投稿ページを開くと、このような画面になります。
同様にalert でポップアップを表示するように設定したページを用意しました
こちらではこのページのみに適用されていることが下記リンクから確認できました！
これはテストページです。
…