OxygenBuilderで「トレンド投稿」セクションを作成する-チュートリアル
公開: 2022-06-22この記事とビデオチュートリアルでは、リピーター要素、WordPress人気投稿プラグイン、および高度なクエリを使用して、OxygenBuilderでトレンド/人気投稿セクションを構築します。
このブログでOxygenに関連して公開した最初のチュートリアルの1つは、人気のある投稿セクションを作成する方法でした。 さて、2022年に、最新の方法とその仕事に最適なプラグインを使用して、このトピックを再検討します。
私たちの代理店は、多くのニュースや大規模なコンテンツのWebサイトに取り組んでいます。 これらのタイプのWebサイトの継続的な要件は、トレンドの人気のある投稿を表示する機能です。 これらのウィジェットのそれぞれが同じものを使用するメカニズム-最初に、特定の投稿が取得しているビューの数を理解する必要があり、次にそれに基づいてクエリを実行できます。

酸素ビルダーコース-近日公開!
Oxygen Builder Masteryコースでは、初心者からプロまで、ACF、MetaBox、WooCommerceモジュールが含まれています。
人気のある投稿は通常、長期間にわたる投稿の全体的な閲覧数を調べます。 たとえば、ブログでこれまでで最も人気のある投稿や、特定の年の最も人気のある投稿を表示できます。
トレンドの投稿は、より短い期間、通常は1日または1週間の全体的な視聴回数を調べます。 たとえば、1つの投稿が1日に100回表示された場合、Webサイトの平均表示回数は33回であるのに対し、これはトレンドであることがわかります。
WordPressリポジトリには、これらのタイプのウィジェットをWordPressWebサイトにすばやく追加できるプラグインが多数あります。 ただし、酸素リピーターと簡単なポスト要素により、各ポストの動的データ出力を真剣にカスタマイズできます。 私たちのプロジェクトでは、リピーターを使用して完全にカスタムのディスプレイとカードを作成します。
この方法では、リピーターを使用して、人気のある投稿やトレンドの投稿をOxygenBuilderに簡単に組み込むことができます。
ビデオチュートリアル
ビューを取得
最初のステップは、個々の投稿が取得しているビューの数を理解することです。
ビューを取得するには、「 WordPressPopularPosts 」と呼ばれる人気のあるプラグインを使用する予定でした。 これは非常に強力なツールです。多言語をサポートし、キャッシュが付属し、GitHubで十分に文書化されており、WP管理者に統計ダッシュボードがあり、APIもサポートしています。

箱から出して、それはあなたのウェブサイトで最も人気のある投稿を簡単に表示するためにあなたにカスタマイズ可能なウィジェットを提供します。 ショートコードを使用して、それらをOxygenに挿入できます。
ただし、さらに一歩進んで、Oxygen Builderリピーター要素を使用して、最も人気のあるトレンドの投稿を表示したいと思います。 このようにして、ビルダーを使用して、最も人気のある投稿のルックアンドフィールを完全にカスタマイズできます。
ただし、このプラグインがビューカウントを管理する方法にはわずかな問題があります。 ビューは、 posts
またはpostmeta
とは別のデータベーステーブルに保存されます。 酸素ビルダーで標準のWordPressSquareを使用してクエリを実行するには、メタフィールドを介してこのデータにアクセスできる必要があります。
投稿メタにビューを追加する
WordPressのPopularPostsプラグインをインストールしたら、このデータをクエリで使用できるようにします。
これを行うには、最新のビュー番号を取得し、投稿に関連付けられたカスタムフィールドの下に入力する必要があります。
このデータにアクセスできるようになると、それを使用して、カスタムWordPressクエリで人気のある投稿を並べ替えることができます。
まず、コードスニペットマネージャーを使用して、このコードをWebサイトに追加します。 OxygenBuilderWebサイト用のスクリプトオーガナイザーをお勧めします。
このコードは、プラグインの背後にある開発者によって作成され、必要なことを正確に実行します。クエリに使用できるデータを提供します。
これにより、4つの新しいメタフィールドviews_total, views_daily, views_weekly, views_monthly
ます。
合計ビューと月次ビューは、人気のある投稿セクションに使用するのに最適です。 日次および週次のビューは、トレンドの投稿に最適です。
各フィールドには、対応するビューの番号が含まれています。たとえば、特定の投稿では、投稿に適用されるテンプレートのOxygenコードブロックにこれを追加することで、フロントエンドの合計ビューを表示できます。
ちょっとまって!
Webサイトが取得するトラフィックに応じて、これを最適化して、サーバーリソースが使い果たされ、すべてのビューがデータベースに書き込まれるようにします。 幸い、このコードスニペットには、これだけに対処する組み込み機能があります。
このコードスニペットの上部近くに、正確さのセクションがあります。 コードにコメントされているのは指示です。
精度は0〜100の範囲で制御されます。 100に設定すると、すべてのページビューがデータベースに記録されます。 1に設定すると、10回に1回の訪問で視聴回数が更新されます。
トラフィックの多いWebサイトでは、精度を下げる必要があります。 これにより、サーバーの負荷とパフォーマンスの問題が最小限に抑えられます。
このプラグインは、分析ソリューションに代わるものではないことに注意してください。 したがって、投稿に対する視聴者の比率が同じになるため、精度はそれほど重要ではありません。 どの投稿が人気があるかはまだわかります。
トレンド投稿セクションを作成する
それでは、トレンドの人気のある投稿セクションをすばやく作成しましょう。
リピーターを使用して、注目の画像、投稿タイトル、抜粋をすばやく追加し、詳細リンクを読みます。 Oxygenに含まれている高度なクエリ機能を使用するため、簡単な投稿を使用することもできます。


トレンド投稿のクエリ
さて、トレンドの投稿からクエリを実行する時が来ました。 前述のように、その日の全体的な視聴回数を使用します。これにより、その特定の期間に何がトレンドになっているのかをよく理解できます。
これを行うには、リピーターまたはイージーポスト要素の高度なクエリ機能を使用します。

[クエリの編集]ボタンをクリックして、高度なクエリUIを開きます。
ここで、以下を追加します。 この使用例では、週ごとのビューに基づいて最も人気のある8つの投稿のみを表示したいと思いました。
私が設定した:
- posts_per_page = 8
- no_found_rows = true(これによりリピーターのページネーションが無効になります)
- post_type = post
- meta_key = views_weekly(これは、このフィールドのデータをクエリに関連付ける必要があることをWordPressに通知します。トレンドまたは人気のある投稿が必要かどうかに応じて、これを合計、日次、週次、または月次に変更できることを忘れないでください)
- order_by = meta_value_num(これは、メタ値に関連付けられた番号(この場合は週次ビュー)で並べ替えることを示しています)
- order = desc(これにより、投稿をほとんどのビューから最も少ないビューで並べ替えることができます)

次に、すべてを保存して、Oxygenサイトのフロントエンドに移動します。 これで、この特定のリピーターに、選択した期間のビュー数順に投稿が表示されます。
ボーナス
また、ブログのフロントエンドで読者に全体的な視聴回数を表示したいと思います。 これを行うために、短いコードを作成します。 このコードをスニペットマネージャーに追加します。
次に、次のショートコードを追加して、1つの投稿の視聴回数を挿入できます。
このチュートリアルでは、このショートコードをリピーターに配置して、投稿に関連付けられたビューを表示しました。 このようにして、クエリが設計どおりに機能していることを確認できました。


ここで注意すべき点は、これは前のコードスニペットで単一の投稿に追加したビューカウントフィールドを使用していないということです。 代わりに、このプラグインがインストール中に追加するデータベーステーブルからプルしています。 つまり、前のスニペットで述べた精度に関係なく、これは常に正確なビューカウントになります(2つの異なるものです)。
次のPHPを追加して、この情報を追加することもできます。単一の投稿に適用されたテンプレートのコードブロックに直接移動します。
結論
この記事では、このプラグインで作成されたWebサイトに、OxygenBuilderリピーターを使用して人気のある投稿セクションやトレンドの投稿セクションを追加する方法を説明しました。 ご質問やご提案がございましたら、以下の共通セクションにお気軽にお寄せください。
あなたは好きかもしれません