高度なカスタム フィールドでできることを知らなかった 7 つのこと

公開: 2023-04-09

Advanced Custom Fields (ACF) は、WordPress 開発とほぼ同義です。 450 万以上のサイトを動かしているこのプラグインは、WordPress を新たな高みへと成長させてきました。 あなたはプラグインを知っています。 おそらくプラグインを使用してビルドしたことがあるでしょう。 しかし、あなたはそれを十分に活用していますか？

このセッションでは、ACF を活用して、これまでで最もダイナミックでパワフルで魅力的な WordPress エクスペリエンスを構築する、あまり知られていないいくつかの方法を簡単に見ていきます。

ビデオ: 高度なカスタム フィールドでできることを知らなかった 7 つのこと

スピーカー:

  • Iain Poulson 氏、WP Engine のシニア プロダクト マネージャー
  • Rob Stinson、WP Engine のプロダクト マーケティング マネージャー

セッションのスライド:

高度なカスタム フィールドを使用して実行できる 7 つのことダウンロード

転写:

Iain Poulson: こんにちは。Advanced Custom Fields プラグインのセッションへようこそ。 私は WP Engine の ACF のプロダクト マネージャーである Iain Poulson です。プロダクト マーケティング マネージャーである Rob Stinson も参加しています。 今日は、Advanced Custom Fields プラグインでできることを知らなかった 7 つのこと、かなり新しいこと、あまり知られていないことについて、かなり短いセッションで説明します。 そして、Rob が設計した架空のサイトを中心に機能を追加する予定です。したがって、基本的には抽象的なものよりも実例のファンですが、映画の大ファンでもあります。

したがって、このサイトは映画の最高の時代、おそらく間違いなく 90 年代の映画を祝うものであり、このサイトは 90 年代の最も人気があり、最も愛された映画を認識して授与することに基づいています。 サイトは映画を紹介し、ユーザーがお気に入りに投票できるようにする必要があり、真のロブ スタイルで、サイトは見栄えがします。 それでは、最初から始めて、ACF をインストールしましょう。 方法を教えて、ロブ。

ロブ・スティンソン: いいね、ありがとう、イアン。 ええ、ありがとう、男。 かなりいいですね。 それを設計するのにかなりの時間がかかりました。楽しい時間を過ごしました。 それで、私たちは契約を勝ち取りました。 私たちはプロジェクトを手に入れ、物事を開始しています。私たちが最初にしたことは、それが特定された場合、これが最初に ACF にとって理にかなっているということでした。 いくつかのカスタム投稿タイプ用に大量のカスタム フィールドを設定し、興味深いテンプレート作成などを行う必要があります。 ACF は、ここでの仕事のためのツールです。 もちろん、最初に ACF をインストールする必要があります。これが一番です。 通常、プラグインを zip ファイルとして取得し、それを WordPress 管理画面にアップロードするだけでよいことがわかっています。

これはプラグインをインストールする標準的な方法ですが、最近の開発者は依存関係を少し異なる方法で管理したいと考えていることもわかっています。 私は通常、それをコード内で管理するのが好きで、PHP の世界では、通常は Composer で行われます。 これまで、Composer を使用して WordPress.org リポジトリから WordPress プラグインを簡単にインストールできましたが、ACF Pro などのプレミアム プラグインをインストールするのは少し困難でした。

しかし、数週間前の最新リリースでは、実際には約 1 か月前に、Composer を介して ACL Pro をインストールできるようになりました。これはすばらしいことです。 これを行う方法は、ステップ 1 です。ACF Pro Composer Repo URL を composer.JSON ファイルに追加する必要があります。 ステップ 2 は、資格情報用の auth.JSON ファイルを作成し、それをプロジェクトのルート (ローカルとデプロイ先への途中) に配置することです。そのファイルに必要な資格情報は、advancedcustomfields.com のアカウント エリアで利用できるようになりました。

ログインすると、ライセンス領域が表示され、いくつかの追加のタブやそのようなものがあります。実際にコード全体を取得したり、全体をコピーして貼り付けたり、個々のユーザー名を取得してパスワードを作成し、作成したファイルである auth.JSON ファイルに渡します。

そして 3 番目のステップでは、Composer コマンドを実行します。これは 3 ステップのプロセスであり、とても簡単です。しかし素晴らしいのは、前述のように、開発者がどのように制御するかをもう少し微調整したいということを意味するからです。彼らはプロジェクトの依存関係を管理していますが、ACF Pro でこれを行うことができます。これは素晴らしいことです。 もちろん、それに関するドキュメントは他にもあるので、さらに深く掘り下げてすべての展開方法を確認するには、Web サイトのドキュメントにジャンプしてください。 クール、2 番目のイアンに投げるつもりです。

Iain Poulson: では、サイトのデータの設定について話しましょう。 したがって、カスタム投稿タイプは、投稿やページだけではないサイトを構築する方法において、WordPress で非常に基本的なものです。 これは、WordPress のバージョンに関係なく、それを適切な CMS に変換するカスタム投稿タイプ機能であり、通常、開発者がサイトを構築するときに行う最初のステップです。 そして、それは常にACFの外で起こったことです. 歴史的には、投稿タイプをコードで登録するか、別のプラグインを使用して登録しますが、それは ACF と非常にうまく接続する旅の一部です。 そのため、ACF 6.1 の一部として、その機能がプラグインに組み込まれるので、それが旅の自然な出発点になります。

データ構造データを使用してサイトを構築したい場合は、投稿タイプを構築します。 そこにフィールドを追加し、いくつかの分類法を追加してから、そのデータの編集を開始します。 ええ、それは私たちが 6.1 に組み込んだものであり、CMS でビルドの完全なフローを持つことは非常にエキサイティングです。 ということで、VHSのアワードサイトを探してみましょう。 データを構造化し、必要なことを WordPress に実行させる必要があります。投稿タイプに関しては、投稿とページを使用したくないため、カスタム投稿を作成します。動画用の型、動画データ、データ オブジェクト、またはデータ モデルを保存しますが、明らかに WordPress の用語では、それはカスタム投稿タイプです。

ユーザーが特定のジャンルの映画を簡単に見られるように、映画を分類法で分類したいと考えています。そうすれば、簡単なフロントエンド表示、特定の映画にアクセスできる単純な URL を取得できます。ジャンル。 また、映画に関する構造化データを保存するために追加のフィールドが必要になるため、たとえば、ディレクターはテキスト フィールドにする必要があります。 映画が公開された年を数字で表す必要があります。また、映画を相互に関連付けるには、なんらかの形の関係が必要です。もちろん、得られる投票数を保存する必要があります。それが数値フィールドです。

それでは、ACF 6.1 でどのようにそれを行うのかを簡単に見てみましょう。 これは ACF 6.1 の画面です。サイドバーにメニューがあり、少し違うことに気付くでしょう。 カスタムフィールドだけでなく、ACFになりました。これが投稿タイプの画面です。 これは私が映画の投稿タイプを設定しただけです。 ここでの最も単純なワークフローは、投稿タイプに単一のラベル、つまり複数のラベルの映画を追加するだけで、投稿タイプのキーが自動的に生成されます。 パブリック設定は、フロントエンドの投稿タイプで表示し、管理者で編集できるようにするため、デフォルトでオンに設定されています。

保存して追加したら、ここで ACF と接続することの良い点は、ジャーニーの次のステップは、投稿タイプを作成したこと、投稿タイプにフィールドを追加したいのか、それとも追加したいのかということです。既存のフィールドを投稿タイプにリンクするか、分類法を作成しますか? ここからすべてを行うことができるので、明らかにこれらのフィールドを追加する必要があります。 OK、その通知をクリックして新しいフィールドを映画投稿タイプに追加すると、フィールド グループ エディターが表示され、設定メタボックスの下部に事前入力されます。

そのため、映画の投稿タイプを編集しているときに、これらのフィールドを表示するように場所のルールが既に設定されています。その後、先に進んでフィールドを追加できます。これは、スクリーンショットで既に行っています。 これで、監督、年、投票、および関連する映画が得られました。 そしてもちろん、先ほど説明したカスタム分類法を登録して、ジャンルを追加し、ジャンル分類法を映画の投稿タイプに関連付けることができます。 これらはムービー オブジェクトに追加されたフィールドですが、よりグローバルまたはサイト全体のデータを保存するために必要なフィールドについてはどうでしょうか。 ロブ、そのために私たちは何を手に入れましたか?

ロブ・スティンソン: いいね、ありがとう、イイン、いい感じだね。 私たちのコンテンツ モデルは順調に進んでいますが、まだ終わっていません。 Composer を使用して ACF Pro をインストールする方法については既に説明しました。カスタム投稿タイプと ACF のカスタム分類法についても説明しました。 これらの 2 つのことは非常に新鮮ですが、3 番目に取り上げたいのは、古き良きものですが、優れたものです。 そして、プラグインには何年も前から存在していますが、誰もがそれについて知っているわけではなく、誰もがこの値を完全に理解しているわけではないため、オプションページでグローバルフィールドを見ていきます.

通常、カスタムフィールドと、特定の投稿、ページ、またはカスタム投稿タイプのデータを保存する方法について考えます。 しかし、サイト全体に関連するデータを保存する必要がある場合もあります。素晴らしい VHS アワード サイトの好例は、この種のトップ通知またはプロモーション バーです。 これは、サイトのホームページのすべてのページに表示したいバーです。映画のページに行くと、そこにあります。 概要ページ、連絡先ページ、またはブログ ページに移動すると、ユーザーがどこに移動しても、この小さなバーがサイト全体に表示されるため、その関連データを投稿や投稿に関連付けても意味がありません。映画。

それはサイトに関連付けられるべきものです。 設定をしたいので、このバーのオンとオフを切り替えられるようにしたいのですが、おそらく、1 年の特定の時期にこれをオンにしたいと思うでしょう。 特定のプロモーションやキャンペーンがあるかもしれないので、ブール値フィールドを持つ機能が必要で、これをオンまたはオフに切り替えることができます。 また、呼び出されたアクション自体、またはボタン内のテキストを更新できるようにしたいので、もちろん、カスタム フィールドはそのために非常に理にかなっています。

オプション ページを設定するには、これを可能にする ACF 内の機能を使用します。ステップ 1 は通常、関数、.PHP ファイルで行います。または、もちろん、別の場所に登録することもできます。開発中のプラグイン。 ただし、オプション ページ自体を登録するつもりであり、その設定で実行できる小さな構成がいくつかあります。 1 つのオプション ページを作成することもできますが、実際には複数のページを作成することもできます。それらは入れ子になっているため、子ページや親ページなどを使用して、興味深いことができます。

私たちにとって、私たちのものは非常に単純です。 ここでは通知バーを設定しているだけなので、1 つのページだけが必要なので、ステップ 1 はそのオプション ページを登録することです。 ステップ 2 では、通常どおり、フィールド グループを作成します。 これをプロモーション バー フィールド、またはそのようなもの、または通知バー フィールドと呼びます。上部にブール値フィールドがあることがわかります。true または false はプロモーション バーがアクティブです。 メッセージ用のテキスト フィールド、ボタン テキスト用のテキスト フィールド、ボタン リンク用の URL フィールドがあります。また、通知タイプもあるかもしれませんが、おそらくアラートまたはプロモーション スタイルが必要です。おそらく、そこで選択されたものに基づいて、いくつかの興味深い条件付きスタイリングを行います。

フィールド グループを追加し、フィールドを追加します。ステップ 3 はそのすぐ下にあります。 ご存知のように、場所のルールで、[オプション ページが等しい] を選択できるようになりました。そこにあるサイト設定が表示されます。これは、ステップ 1 で登録した [オプション] ページです。 すべてが完了すると、WordPress 管理画面の左側に表示されるようになり、管理バーに [サイト設定] が表示されます。それをクリックすると、予想どおり、すべてのフィールドが表示されます。

また、通知バーをオンまたはオフにすることができます。 テキストを更新し、ボタンを更新すると、そのデータがテンプレートで使用できるようになります。そのため、オプション ページ内のデータ フィールドを使用したテンプレート エクスペリエンスは、それ以外の場合とほぼ同じです。 これが投稿ではなくオプション ページであるという事実を具体的にターゲットにする方法には、いくつかの微妙なニュアンスがありますが、advancedcustomfields.com のドキュメントにジャンプすると、それを処理する方法がすべて説明されます。 4番、あなたに投げ返します、イイン。

Iain Poulson: ありがとう、ロブ、ええ。 ここで、プログラムでフィールドを ACF に登録する方法についてお話したいと思います。 したがって、ACF でのフィールドの作成は、フィールド エディターのユーザー インターフェイスを使用すると非常に簡単です。これは、以前に見た、私たちが知っていて気に入っている種類のものですが、フィールドを定義する方法は他にもあります。 ACF を使用すると、フィールド定義を含む JSON ファイルと PHP ファイルの両方をエクスポートでき、それを使用してフィールドを作成できます。

しかし、実際には、ACF コミュニティには ACF ビルダーと呼ばれるパッケージがあり、PHP コードで流暢な API のようなものを使用してフィールドを作成できることをご存知ですか? これは実際にはサードパーティのパッケージであり、StoutLogic の ACF Builder Package と呼ばれています。 ええ、GitHub リンクがあります。 基本的に、PHP で ACF がフィールド データを必要とする複雑さを知らなくても、コードから直接フィールドを作成できます。 それを行うために、本当に一種の表現力豊かな方法を使用しています。 再利用可能でポータブルになります。

PHP ファイルをバージョン管理に使用すると、コラボレーションが容易になるため、フィールド定義をコミットできます。 展開メカニズムに送信するのは簡単で、フィールド グループ エディターの UI を取り除くこともできるので、これらのフィールドをコードで定義して、クライアントが UI に触れる必要がないようにします。やれ。 これはパッケージであるため、インストールする必要があります。Composer については以前に説明しました。 これは、次のコマンドでインストールできる Composer パッケージです。Composer は、StartLogic、ベンダー、ACF Builder を取得します。コードは次のようになります。

Fields Builder のインスタンスをインスタンス化し、フィールド グループとなるもののスラッグをそれに与えています。 そして、このフィールド グループに、Director というテキスト フィールドを追加しましょうと言っています。 年という数値フィールドを追加しましょう。次に重要なのは、映画の投稿タイプに表示されるフィールド グループの場所を設定することです。

これらはすべて、何も考えずに多くのことを行うため、フィールド ラベルのディレクター名を指定すると、処理が進み、明らかに、フィールドのスラッグまたはキーが作成されます。それを追加すると、多くのタイピング、多くの思考、およびエラーが発生しやすい多くの作成が不要になります。 2 番目の部分では、そのフィールド定義を ACF にロードし、フィールド グループを作成します。

Rob Stinson: わかりました。5 番目の双方向の関係です。 さて、これは興味深いものです。 エージェンシー時代に私が実際に取り組んだこの特定のプロジェクトを覚えていると思いますが、それは一種のゲームチェンジャーでした. したがって、これが以前に ACF で行ったことがない場合は、注意してください。これは非常に便利なことなので、例を見てみましょう。 もちろん、私たちの VHS アワード サイトを見ると、100 本ほどの映画の名簿があり、明らかにこれらを結び付けるさまざまな方法があります。

前に、ジャンルのカスタム分類法があります。 タグやグループ化などを処理するいくつかの異なるフィールドがある場合があるため、双方向の関係は、2 つの投稿 (この場合は 2 つの映画) 間に特定のタイプの双方向接続を作成する場合に役立ちます。 この例では、データベースにこれら 3 つの映画があり、それらはすべてアニメーション化されているので、それらとの双方向の関係を作成したいとします。

これが意味することは、ここに最初の映画「トイ・ストーリー」という素晴らしい映画があり、それを関連付けたい他の 2 つの関連映画があることを特定したとします。 そこで、カスタム投稿タイプである映画用のリレーションシップ フィールドを作成し、そこにリレーションシップ フィールドを作成して、映画「ライオン キング」とプリンセス モノンを選択します。 私はこの言葉につまずき続けます。 私はそれを解体していますが、その映画は「もののけ姫」と呼ばれています。 ははは。 私を嫌いにならないでください。 どういうわけか、その単語を発音するのに苦労しています。

そして、これら 2 つの映画が関連していることを特定したので、関係フィールドからそれらを選択します。 この場合、たとえば「ライオン キング」は「トイ ストーリー」に関連しているため、「トイ ストーリー」は「ライオン キング」に関連しているということは理にかなっています。 通常は「ライオン キング」の編集画面に移動し、「トイ ストーリー」を見つけてそこに追加しますが、そこで作業を倍増させます。 つまり、双方向の関係が行うことは、その接続を自動的に作成することであり、これは非常に便利です。

たとえば、「ライオン キング」を「トイ ストーリー」に追加すると、「トイ ストーリー」が自動的に「ライオン キング」に追加されます。これは非常に便利です。 コンテンツ クリエーターとコンテンツ マネージャーの時間を大幅に節約できます。 忘れるリスクを減らします。または、1 つの投稿から 1 つを削除し、別の投稿から削除するのを忘れる可能性があります。 コンテンツ編集の経験を本当に、本当に簡素化するので、特にこのような興味深いサイトで使用できる本当に便利なものです. では、どうすればよいのでしょうか。 現在、これを行うには 2 つの方法があります。3 つ目の方法については、今年後半に予定されている可能性があります。

どのようにそれが行われるかというと、第一に、コードでこれを行うことができます。 したがって、ACF Pro プラグインをインストールするだけで、これを行うコードを記述できます。 また、ACF Update Value Filter にフックする関数を作成できます。このフィルターは、値が保存される前に実行されます。基本的には、編集中の現在の投稿を取得し、投稿の投稿 ID を識別します。それが追加され、他の投稿が更新され、そのような照合がバックグラウンドで行われるので、非常に便利です。

少しのコードなので、それに慣れている限り、重労働ではありません。 ただし、ここにもリンクまたは URL があり、高度なカスタム フィールドのドキュメントで確認して、その方法を確認できます。 ただし、オプション 2 はコードなしです。 つまり、これは実際には ACF Extended と呼ばれるエコシステム プラグインです。 これは WordPress.org で入手できます。その機能は、その機能を ACF UI 自体に組み込むだけです。

したがって、この拡張機能である ACF Extended をインストールし、ACF Pro をインストールしている場合は、関係フィールドを作成するときにオンにできる双方向トグルがあるというオプションが表示されます。 UI 内からすぐにコレクションに設定できます。これは非常に便利です。 現在、このプロジェクトは非常に興味深い方向に進んでいますが、頭を悩ませないようにしましょう。 イアン、あなたに。

Iain Poulson: ええ、ありがとうロブ。 ACF に関しては、ヘッドレスを呼び出す価値があります。 ACF にはヘッドレス サポートがあるため、基盤となるヘッドレス サイト、サイトの分離された性質があります。 多くの API 通信が行われており、ACF には API サポートがあります。 5.11 または 5.11 の時点で ACF にネイティブに追加された REST API であり、WP GraphQL 用の ACF アドオンを備えた WP GraphQL プラグインで GraphQL をサポートしているため、ACF はヘッドレス サイトをサポートします。 適切なヘッドレス WordPress サイト用の WP Engine Atlas プログラムと統合されていますが、VHS WordPress サイトにあるデータをどのように取得し、それを分離した方法で使用するかについて、実際の例について話しましょう.

たとえば - 聞いてください - 人々は基本的に VHS アワードのサイトで投票しています。最も人気のあるものを見ていきます。 私たちは地元の映画館を持っており、最も投票された90年代の映画の二重請求を行っています. 彼らは映画館に看板を持っていて、それはオンラインです。 これは Web に接続されており、ビルボードに表示される内容を動的に強化できるため、WordPress サイトに接続する必要があります。

たとえば、ビルボードは単純なノード アプリであり、VHS サイトからデータを取得する必要があるため、カスタム REST API エンドポイントを使用してそれを行う方法を簡単に見てみましょう。 GraphQL をサポートしました。 両方の方法で行うことができますが、これはおそらくより簡単な例です。 まず、基本的に必要なデータを取得する関数を作成します。これを実行すると、「映画が欲しい」または「映画のタイプの投稿タイプ」という WP クエリになりますが、私は2つ欲しい。 しかし、私はそれをACFフィールドで並べたいと思っています。フィールド名はvotesで、降順で並べているので、トップを取得し、トップを取得します二。

次に、前のスライドで作成したコールバック関数を使用するカスタム REST エンドポイントを作成します。これにより、ヒットして 2 つのムービーを取得できるエンドポイントが得られます。 これが実際にどのように見えるか - これは単なるテストです - URL は vhsawards.com、つまり WP-JSON であり、API を変更したい場合に備えて VHS バージョン 1 の名前空間を与えました。これで、popular の非常に単純な URL 構造が得られました。

そして、これは 2 つのアイテムを含む JSON オブジェクトを返しているだけです。上位 2 つの投票されたアイテムは、たまたま「Fight Club」と「Goodfellas」でした。 これは、ACF がデカップリングされたヘッドレス サイトにどのように力を与えるかを示すのは間違いなく良いことですが、現時点では、ブロックに言及せずに WordPress について話すことはかなり困難です. ブロックについて言及せずにここまでやってきたなんて信じられません。 それを変えるために、ロブ、あなたは私たちに何を持っていますか?

ロブ・スティンソン: 間違いなくブロックについて話す必要があります。 その前に、双方向の関係に関する 5 番目を見ていた直前に、それを行う 3 番目の方法をほのめかしたことに気付きました。 私はそれをカバーしませんでしたので、私が言いたいのはこのスペースを見てください.サードパーティのものを必要とせずにACFプラグイン内にあるので、このスペースを見てください。タイミングに関するコミットメントはありません. それは私たちが見ているものです。

7番ですね、はい。 ACF を使用してカスタム ブロックを作成する方法を見てみましょう。 現在、ほとんどの人はこれを ACF で実行できることを知っていますが、必ずしもすべての人が試したわけではありません。 したがって、あなたがその陣営にいて、長年 ACF を使用しており、現在カスタム ブロック機能を使用していない場合は、これを見てください。この機能の価値を確認するよう促すだけかもしれません. しかし、これを VHS アワードでどのように使用するのでしょうか? おそらく、サイトにさまざまな場所を追加できるブロック コンポーネントが必要です。それがカスタム ブロックまたは任意のブロックの利点であり、サイト全体のページや投稿に使用および配置できることです。アクションブロックへのカスタム呼び出しを作成します。

これは非常に単純なブロックであり、カスタム ブロックを使用するとさらに興味深いことができます。 ここでは簡単に説明します。 しかし、この青いバナー、コール・トゥ・アクション・ブロックは、ホームページやブログの投稿などに配置して、読者やサイト訪問者にそのボタンをクリックして先に進むよう促したいと考えています。彼らのお気に入りの 90 年代の映画に投票してください。 では、このカスタム ブロックを ACF でどのように構築するのでしょうか? そして、私たちがカスタムブロックとしてそれをやっている理由は、それにはユニークなデザインがあるからです.

この繰り返しのドット パターンに対して興味深い背景のグラデーションが行われています。 WordPress コアを備えたシェルフ。 では、どうすればよいのでしょうか。 ステップ 1 は、通常は functions.PHP、またはこの種のコードを記述している場所にカスタム ブロックを登録することです。 素晴らしくシンプルで、カスタム ブロックのテンプレート ファイルが最終的に配置されるディレクトリを指定するので、これがステップ 1 です。

ステップ 2 では、フィールド グループを作成し、フィールドを追加します。 したがって、Called Action ブロックには、テキスト、ボタン テキスト、ボタン リンク、および背景色も必要です。 おそらく、このためのスタイリングにいくつかのバリエーションのオプションを提供したいと考えています. 3 番目は、ロケーション ルールでブロックを選択します。これは等しいと言い、先ほど CTA ブロックを登録しました。そのドロップダウンに私たちがいます。 テンプレート ファイルに移ります。すべてのフィールドとすべてがセットアップされました。 さて、テンプレート化は、おそらく伝統的に ACF でテンプレート化する方法とはいくつかの点で異なります。

しかし、他の多くの点で非常によく似ているため、開発に通常使用する多くのパターンをカスタム ブロックを構築する際に使用できます。これは素晴らしいことです。 したがって、このプロジェクトでは、それがカスタム テーマであるとします。 blocks ディレクトリがあり、次に登録したブロックに一致する CTA ディレクトリがあります。通常、3 つのテンプレート ファイルがあります。スタイリング。

これがブロック タイプの JSON であり、これがブロックを登録した場所のようなものですが、これがもう少し物事を理解する方法であり、構成やさまざまなネイティブ コア機能に関して、ここでできることがたくさんあります。オンまたはオフに切り替えて、カスタム ブロックで使用できるようにすることができます。 したがって、これに関するドキュメントを必ずチェックして、何ができるかを理解してください。これは、私が言ったように、そのブロックを使用可能にする方法を構成し、表示し、通過できるコア機能を表示できる場所だからです。カスタムブロックに。

次に、テンプレート ファイル、PHP ファイルを用意します。ここでは、Get フィールドと対話する変数を設定し、そこでフィールド データと対話し、スタイリングに関する非常に単純な条件付きロジックを少し設定していることがわかります。次に、ブロック自体の HTML です。 そして、CSS について説明するつもりはありません。 あなたは CSS が何であるかを知っています。おそらく、私がここで書いたものよりも優れた CSS を書くことができると確信していますが、アイデアは理解できます。 ブロックのスタイル設定用の CSS ファイルがあり、フォントの周りにいくつかの興味深い機能があることがわかります。また、ドットの背景のような放射状のグラデーションの背景があり、これは楽しいものです。

繰り返しになりますが、このカスタム ブロックを作成する理由は、CSS やスタイリングを微調整して、現在取り組んでいるデザインを実際に実装できるようにするためです。 エディターでこれがどのように見えるかをお見せするために、Called Action ブロックを選択して、大きく照らすことができます。 フィールドを操作し、テキストとボタンにテキストを追加し、ボタンにリンクを追加することもできます。これは、コンテンツ エディターに渡すことができる非常に見栄えの良いカスタム ブロックです。

Iain Poulson: ええ、ありがとう、ロブ。 なんて格好良い光景でしょう。 私たちは本当にそれを生かす必要があります。 すごいです。 そうですね、今日話したことを振り返ってみましょう。 そこで、ACF Pro をインストールする方法を説明しましたが、Composer を使用します。 カスタム投稿タイプとタクソノミーを ACF に登録する方法について説明しました。 グローバルまたはサイト全体のフィールドをオプション ページに登録する方法を検討し、プログラムでパッケージにフィールドを登録する別の方法を検討しました。

Rob は、関係と双方向の関係を作成する方法について掘り下げました。 ACF を使用したヘッドレスについて触れましたが、Rob は ACF を使用してカスタム ブロックを作成する素晴らしい例を作成しました。PHP、HTML、および CSS 以外はほとんど何もせず、まったく反応しません。これは非常に良いことです。 よかったね、ロブ。 投票数は？ 私たちは何として出てきましたか？

ロブ・スティンソン: 90 年代の最高の映画は、紛れもなくロビン・ウィリアムズの「フック」です。 その中にたくさんの懐かしさを感じました。私はその映画が大好きです。 あなたはどうですか、イアン？

Iain Poulson: 私にとっては、Kevin Costner の「Robin Hood, Prince of Thieves」に違いありません。 それは古典です。 悪い髪、ボラ、英語のアクセントでさえない危険な英語のアクセントを忘れてください. これは史上最高のロビン・フッド映画であり、それは私が喜んで死ぬ丘です.

ロブ・スティンソン: ハ、ハ、いや、まあまあ。 ほら、みんな、付き合ってくれてありがとう。 皆さんが何かを学んだことを願っています。皆さんが ACF で構築したものを見るのを本当に楽しみにしています。乾杯。