はじめに
最近のウェブデザインでは、Carousel（カルーセル）は多くのサイトで利用されています。Carouselを適切に設定することで、ユーザーがコンテンツを視覚的に楽しむことができるだけでなく、SEOの観点からも有益です。Googleなどの検索エンジンはスキーママークアップを使用してウェブページの情報を理解しやすくします。
症状・背景
このテーマが必要になる主な場面:
- ウェブサイトにCarouselを導入したい場合
- Carousel内のコンテンツが検索エンジンに正しく認識されない場合
- サイト訪問者のユーザーエクスペリエンスを向上させたい場合
- SEOの評価を改善したい場合
手順・設定方法
ステップ1: Carouselプラグインをインストールする
# WordPress管理画面にログインして、『プラグイン』 > 『新規追加』を選してください。
# 「Carousel」または「Slider」のワードで検索し、適切なプラグインを見つけてインストールします。
# プラグインが正常にインストールされたら、有効化する必要があります。プラグイン一覧から該当のプラグインを探して、「有効化」ボタンをクリックします。ステップ2: Carouselコンテンツを作成・設定する
# 『Carousel』または『Slider』メニューを選択し、新規Carouselを作成します。
# 新しいCarouselが作成されたら、画像やリンクなどのコンテンツを追加します。それぞれのアイテムに対してタイトル、説明、URLなどを記入してください。ステップ3: Carouselにスキーママークアップを適用する
# WordPressテーマのfunctions.phpファイルを開きます。編集する前にバックアップを作成することをお勧めします。
# functions.phpファイルに以下のようにコードを追加して、Carouselに対してSchema.orgのArticleマークアップを適用します。
add_filter('wpseo_json_ld_output', 'custom_carousel_schema');
function custom_carousel_schema($json) {
$carousel_items = array(
// Carouselアイテムの配列
);
foreach ($carousel_items as $item) {
$article['@type'] = "Article";
$article['name'] = $item['title'];
$article['description'] = $item['description'];
$article['url'] = $item['url'];
// その他の必要なプロパティを追加
$json['@graph'][] = $article;
}
}ステップ4: Carouselの表示と監視
# WordPress管理画面からCarouselを公開します。その後、Google Search Consoleを使用して、サイトが適切にインデックスされていることを確認してください。
# また、Google Structured Data Testing ToolでCarouselのスキーママークアップが正しく設定されているかテストすることをお勧めします。注意事項
- プラグインの更新時にfunctions.phpファイルが上書きされる可能性があるため、常にバックアップを取る
- スキーママークアップはGoogle検索結果の表示に影響を与えるので、適切な設定を行うこと
- Carousel内のすべてのコンテンツがユーザビリティとSEOにとって有益であることを確認すること
- セキュリティ上の問題: プラグインやテーマが最新の状態であることを定期的に確認する
- パフォーマンス/運用上の注意: 多すぎるCarouselはページロード速度を遅くする可能性があるため、適切な数で管理すること
まとめ
1. Carouselプラグイン: 適切なプラグインを選択しインストールします。
2. コンテンツの追加: Carouselに必要な画像やリンクなどのコンテンツを追加します。
3. スキーママークアップ: Schema.orgを使用してCarouselアイテムに対して適切なマークアップを適用します。
4. 表示と監視: Google Search Consoleでサイトが正しくインデックスされているか確認し、Google Structured Data Testing Toolで設定が正しいことをテストします。
関連記事: