WordPress にスクリプトを追加する
公開: 2022-09-19WordPress へのスクリプトの追加は、いくつかのステップで完了する簡単なプロセスです。 まず、WordPress ディレクトリに新しいファイルを作成する必要があります。 次に、ファイルを編集してスクリプトを追加する必要があります。 最後に、ファイルを WordPress ディレクトリにアップロードする必要があります。
フロントエンドでスクリプトとスタイルをエンキューするには、WordPress_enqueue_scripts フックを使用する必要があります。 関数をフックしたい場合は、WP_register_script、WP_enqueue_script、WP_register_style、および WP_enqueue_style 関数を使用できます。
WordPress 本体にスクリプトを追加する

WordPress 本体にスクリプトを追加することは、サイトに機能を追加する優れた方法です。 これを行うにはいくつかの方法がありますが、最も一般的な方法は、スクリプトをテーマの header.php ファイルに追加することです。 これにより、スクリプトがサイトのすべてのページに読み込まれます。 もう 1 つのオプションは、サイトのヘッダーまたはフッターにスクリプトを挿入できる、Head、Footer、Post Injections などのプラグインを使用することです。
WordPress では、body タグにスクリプトを追加する方法がいくつかあります。 これを実現するために、header や FooterScripts などのプラグインを使用できます。 もう 1 つのオプションは、テーマの header.php ファイルを追加または変更するか、子テーマを使用することです。 script タグは、JavaScript の外部で使用するJavaScript ファイルの URL である必要があります。
WordPressの投稿にJavascriptを追加する方法
WordPress_enqueue_scripts 関数は、投稿に JavaScript を追加する簡単な方法です。 WordPress_enqueue_script ('my_script,'path/to/my/script.js') コマンドを使用してそれらをキューに入れることができます。
WordPress ヘッダーにスクリプトを追加

WordPress サイトのヘッダーにスクリプトを追加するのは、非常に簡単なプロセスです。 まず、/wp-content/themes/yourtheme/ ディレクトリに新しいファイルを作成し、header.php という名前を付ける必要があります。 次に、header.php をテキスト エディターで開き、次のコードをファイルの一番上に追加します: wp_enqueue_script( 'script-name', get_template_directory_uri() . ' /js/script-name.js', array(), '1.0.0'、真); ? > script -name をスクリプトの実際の名前に置き換えます。 ファイルを保存し、サーバーにアップロードします。 それだけです! これで、WordPress サイトのヘッダーにスクリプトが適切に読み込まれるはずです。
ヘッダー スクリプトが必要になる理由はさまざまです。 この記事では、ページに必要な Analytics、Marketing、またはその他の 1 行の JavaScript を追加するために必要なコード スニペットを追加する方法についてのみ説明します。 このタスクは、PHP や JavaScript の予備知識がない人でも実行できます。
WordPress エンキュー スクリプト

WordPress へのスクリプトの追加は、2 段階のプロセスです。 まず、 wp_register_script 関数を使用してスクリプトを WordPress に登録する必要があります。その後、 wp_enqueue_script 関数を使用してスクリプトをキューに登録できます。 wp_register_script 関数は、スクリプトの名前とスクリプトの URL の 2 つのパラメーターを取ります。 スクリプトの名前は、後でスクリプトをエンキューするために使用するものです。 URL はスクリプトの場所です。 wp_enqueue_script 関数は、スクリプトの名前と依存関係の配列の 2 つのパラメーターを取ります。 依存関係は、スクリプトが依存する他のスクリプトです。 WordPress は、スクリプトの前にこれらのスクリプトを自動的にロードします。
WordPress の Loop() 関数
loop() 関数は、テーマの開発に代わるものです。
WordPress スクリプト プラグイン

WordPress スクリプト プラグインは、WordPress サイトにインストールして機能を追加できるソフトウェアの一種です。 スクリプト プラグインは PHP プログラミング言語で記述されており、カスタム フォームの作成、ユーザー権限の管理、WordPress サイトへの新機能の追加に使用できます。
すべてのプラグイン、テーマ、およびコアは、WordPress のエンキュー スクリプト機能を通じてアクセスできます。 プラグインとテーマが要求するスクリプトとスタイルをロードしますが、それぞれが一度だけロードされるようにします。 コードの複雑さを軽減することで、サイトのコードをスリムに保つことができ、読み込み時間とコードの競合が減少します。 WP_enqueue_script() は WordPress のスクリプト言語で、スクリプトを処理して必要な場所に送信できます。 www.wpsi.com/css/stylesheets/ にアクセスすると、WP を使用してスタイルシートを簡単に追加できます。 この方法により、他のプラグインやサイト所有者は、プラグインのコンテキストで何もコーディングせずにスクリプトを削除できるため、スクリプトは何もコーディングせずに削除できます。 さらに、場合によっては、スクリプトまたはスタイルが特定のページにのみ読み込まれるように条件を追加できる場合があります。
WordPressスクリプトとは?
@wordpress/scripts を編集する必要があります。 この再利用可能なスクリプトのセットは、WordPress 開発者を支援することを目的としています。 このパッケージには、すべてのツールの構成機能が含まれているため、構成が簡単です。
WordPress プラグインは Javascript ですか?
これが、「 JavaScript WordPress プラグイン」などがない理由です。
WordPressスクリプトが書かれています
WordPress は PHP プログラミング言語で書かれており、MySQL データベースを使用しています。

このパッケージの各ツールの構成は、そのツールの推奨構成と統合されています。 このパッケージの作成には、react-script と kcd-script が使用されています。 また、 JavaScriptScriptScript アプリケーションの作成方法を学ぶこともお勧めします。 この記事では、ビルド スクリプトと開始スクリプトの使用方法について、他のほとんどのスクリプトよりも詳しく説明しています。 @wordpress/scripts に簡単にアップグレードできるように、重大な変更を最小限に抑えます。 コードの変換後、本番環境で使用できるようになり、最高のパフォーマンスが得られるように最適化されます。 ノード、npm (または yarn) バージョンのセマンティック バージョン範囲がチェックされ、それらが一致することが確認されます。
インストールが不十分な場合は、必要なバージョンに関する情報が公開されます。 ファイルにコーディング スタイルのガイドラインを適用することで、コーディングの完全性を保護できます。 デフォルトでは、node_modules、ベンダー フォルダー、またはビルドに関連付けられているファイルは無視されます。 プロジェクトの無視されたファイルとディレクトリを .prettierignore ファイルに追加することでカスタマイズできます。 マークアップは標準を実施するために使用されるため、システムは markdownlint を使用してそれを追跡します。 その結果、build、node_modules、および vendor フォルダーにあるファイルは無視されます。 CSS コーディング標準に従って、WordPress には @wordpress/stylelint-config 構成が必要です。
プロジェクトの WordPress パッケージを最新バージョンに更新する必要があります。 WordPress プラグインの zip ファイルは、このプロセスを使用して作成されます。 指定された構成を使用してコードを変換すると、開発の準備が整います。 Jest JavaScript テスト フレームワークは、シンプルなユーザー インターフェイス用に設計されています。 このライブラリを使用すると、DevTools プロトコルを使用して高レベル API で Chrome または Chromium を制御できます。 次の一般的な命名規則のいずれかが含まれている場合、テスト ファイルが検索されます。 パッケージの最上位ディレクトリに webpack 構成が見つかった場合は、それが使用されます。
Jest は、次の推奨オプションをデフォルトとして採用しています: @wordpress/jest-preset-default。 Jest のドキュメントでは、独自のオーバーライド オプションを選択することもできます。 テストのデバッグは、Chrome DevTools プロトコル対応のインスペクター クライアントを使用して行うことができます。 例として、Google Chrome および Visual Studio Code ライブラリを使用できます。 PHP デバッガーをインストールするには、WordPress ブラウザーを開き、WP スクリプトをダブルクリックします。 テストが実行され、実行中の行に応じて実行が一時停止されます。 その後、devtools を使用して、ブラウザー コンテキストでブレークポイントを生成します。
推奨される構成ファイルを使用して、このパッケージを実装できます。 さらに、CSS モジュールにプレフィックスを付けて単一のモジュールを作成できます。 style.scss などのモジュールを拡張機能に追加できます。 Webpack を使用すると、CSS からフォント (woff、woff2、eot、ttf、および otf) と画像ファイル (bmp、png、jpg、jpeg、gif、および webpb) を参照できます。 このパッケージは、Gutenberg プロジェクトのコンポーネントの 1 つです。
Javascript は WordPress で使用できますか?
WordPress を使用して、JavaScript を使用して投稿、ページ、または Web サイト全体に動的要素を追加できます。
WordPress プラグインとはどの言語ですか?
PHP は WordPress のコア言語であり、WordPress のテーマとプラグインの大部分は PHP で記述されているため、WordPress は PHP で記述されていると言うのが最も正確です。
プラグインなしで WordPress に Javascript を追加する
プラグインなしで Javascript を WordPress に追加することは可能ですが、お勧めしません。 これは、プラグインが Javascript を WordPress に追加するためのより簡単で安全な方法を提供するためです。 プラグインがないと、WordPress テーマ ファイルを編集する必要があり、正しく行わないとサイトが破損する可能性があります。
この記事の手順に従えば、プログラミングのスキルがなくても、WordPress を使用して 19 種類の Web サイトを作成できます。 プラグインは最も簡単な方法です。 次のファイルを [設定] に挿入します: ヘッダーとフッター。 リストから適切なボックスを選択し、保存ボタンをクリックして、保存するコードを選択します。 コードを追加した領域にコードを出力できるようになります。 JavaScript を使用すると、フレームワークに関係なく動作するプラグインを作成できます。 カスタム JavaScript を WordPress サイトに追加する場合は、プラグインを使用するか、子テーマの functions.php ファイルを変更する必要があります。 タグにフィールドを追加すると、管理者はフィールドにアクセスし、フィールドに保存されている JavaScript ソース ファイルまたはコードを埋め込むことができます。
WordPress サイトにスクリプトを追加する方法
WordPress はコンテンツを公開するための強力なプラットフォームですが、さらに優れたものにするためにカスタム スクリプトが必要になる場合があります。 これは、プラグインを使用するか、子テーマの functions.php ファイルを変更することで実行できます。 ソース ファイルを編集したくない場合は、プラグインを使用することをお勧めします。これにより、カスタム スクリプトが正しい順序で適切に読み込まれます。 簡単なスクリプトを WordPress サイトに追加できます。 zip ファイルの内容は、WordPress インストールの WP-content/plugins/ というディレクトリに保存する必要があります。 プラグインがアクティブな期間アクティブになった後、[設定] > [スクリプト] に移動します。 コードを Web ページに貼り付けたり、プラグインを使用してコードを生成したりすることもできます。
カスタム WordPress Javascript
WordPress サイトにカスタム機能を追加する優れた方法の 1 つは、カスタム JavaScript を使用することです。 これは、サイトに特殊効果や双方向性を追加したり、単純にユーザーフレンドリーにするために使用できます。 ただし、JavaScript は複雑な言語であるため、WordPress サイトに JavaScript を追加する前に、いくつかのことを理解しておくことが重要です。 まず、コードの操作に慣れる必要があります。 次に、カスタム コードが WordPress コードベースと互換性があることを確認する必要があります。 そして 3 番目に、サイトにカスタム コードを追加することの潜在的なリスクを認識する必要があります。