Twenty SeventeenはビジネスサイトにフォーカスしたWordPressテーマ
この記事はプロモーションが含まれています。
Twenty Seventeenとは
WordPressテーマ「Twenty Seventeen」は、2016年12月にWordPress 4.7とともにリリースされたデフォルトテーマです。ビジネスサイトに重点を置いて設計されており、以下のような特徴があります。
Twenty Seventeenの主な特徴
- 没入感のあるヘッダーとトップページ:
- 大きなヘッダー画像や動画をフルスクリーンで表示できるのが特徴です。特にビジネスサイトの顔となる部分にインパクトを与えることができます。
- トップページは複数のセクション(固定ページ)を連結して表示できる構成になっており、企業のサービスや情報などを効果的に見せることができます。
- カスタマイズ性:
- テーマカスタマイザーから、ヘッダーメディアの変更、カスタム配色(ライト、ダーク、カスタム)、ロゴ設定、サイトアイコン設定などが可能です。
- ウィジェットエリアは、サイドバー、フッター1、フッター2が用意されており、コンテンツの配置を柔軟に調整できます。サイドバーに何も設定しない場合は1カラム表示になります。
- ビジネスサイト向け機能:
- ウィジェット、ナビゲーションメニュー、ソーシャルメニュー、ロゴなどの機能が充実しており、ビジネスサイトに必要な要素が盛り込まれています。
- 投稿フォーマットに対応しており、マルチメディアコンテンツを際立たせる表示が可能です。
- レスポンシブデザイン:
- さまざまなデバイス(PC、タブレット、スマートフォンなど)で適切に表示されるよう設計されており、ユーザーに快適な閲覧体験を提供します。
- アクセシビリティ対応:
- 多くの言語に対応し、アクセシビリティにも配慮されていま
現在のTwenty Seventeen
Twenty Seventeenはリリースから時間が経過していますが、WordPressのデフォルトテーマとして、現在も互換性のための更新が継続的に行われています。ブロックエディター(Gutenberg)が登場する前のテーマですが、ブログ記事や固定ページの作成にブロックエディターを使用することは可能です。
新しいWordPressのテーマはブロックエディターを前提とした「フルサイト編集」に対応しているものが多いですが、Twenty Seventeenは「クラシックテーマ」に分類され、従来のテーマカスタマイザーを中心とした設定方法になります。
ビジネスサイトやブログなど、シンプルなデザインで情報を効果的に伝えたい場合に、今でも選択肢の一つとして検討できます。
※最新の情報を公式ページで確認ください
Twenty Seventeenの使い方
Twenty Seventeenの主な特徴と使い方
- インストールと有効化
- 通常、WordPressを新規インストールするとTwenty Seventeenはデフォルトでインストールされています。
- WordPressの管理画面にログインし、「外観」>「テーマ」に進みます。
- Twenty Seventeenが表示されていることを確認し、「有効化」をクリックします。
- もしインストールされていない場合は、「新規追加」から「Twenty Seventeen」を検索してインストール・有効化できます。
- ホームページの表示設定
- Twenty Seventeenでは、トップページを「最新の投稿」にするか、「固定ページ」にするかを選ぶことができます。ビジネスサイトなどで特定の情報をトップに表示したい場合は、固定ページを設定すると便利です。
- 設定方法:「設定」>「表示設定」に進み、「ホームページの表示」で選択します。
- 固定ページをトップページにする場合は、まず表示させたい固定ページを新規作成しておく必要があります。
- ヘッダーメディア(動画・画像)
- Twenty Seventeenの大きな特徴の一つが、ヘッダーに動画や大きな画像をフルスクリーンで表示できる点です。サイトの印象を大きく左右する部分です。
- 設定方法:「外観」>「カスタマイズ」>「ヘッダーメディア」に進みます。
- 画像の場合: 「新規画像を追加」から、推奨サイズ(1200px × 280px以上)の画像をアップロードまたはメディアライブラリから選択します。複数の画像をアップロードすると、ランダムで表示されます。
- 動画の場合: YouTubeから動画のURLを貼り付けるか、自分でMP4ファイルをアップロードします。動画は自動再生されますが、音はミュートになっています。動画をアップロードする場合、ファイルサイズに注意が必要です。
- セクション(固定ページの内容をトップページに表示)
- Twenty Seventeenのビジネスサイト向けの機能として、トップページに複数の固定ページの内容をセクションとして表示できます。これにより、サービス紹介や企業情報などをトップページでまとめて見せることができます。
- 設定方法:「外観」>「カスタマイズ」>「テーマオプション」に進みます。
- ここで、「Section 1」から「Section 4」まで、それぞれ表示させたい固定ページを選択します。選択した固定ページのタイトル、アイキャッチ画像、抜粋(または最初のブロック)がトップページに表示されます。
- 固定ページを作成する際に、セクションとして表示されることを考慮して内容を作成してください。
- メニューの設定
- ウェブサイトのナビゲーションメニューを設定します。
- 設定方法:「外観」>「メニュー」に進みます。
- 「新しいメニューを作成」からメニュー名を入力し、表示させたいページや投稿、カスタムリンクなどを追加します。
- メニューの位置は「トップメニュー」と「ソーシャルメニュー」が用意されています。
- トップメニュー: 主なナビゲーションリンクが表示されます。
- ソーシャルメニュー: SNSのアイコンリンクを表示できます。メニュー項目にSNSのURLを追加すると、自動的にアイコンが表示されます。(例:FacebookのURLを追加するとFacebookのアイコンが表示される)
- ウィジェット
- Twenty Seventeenには、サイドバーとフッターにウィジェットエリアがあります。ウィジェットは、最近の投稿、カテゴリ、カレンダー、カスタムHTMLなど、様々な情報を表示できる小さなブロックです。
- 設定方法:「外観」>「ウィジェット」に進み、利用できるウィジェットをそれぞれのウィジェットエリアにドラッグ&ドロップして配置します。
- 色と背景
- サイトの色合いや背景画像を設定できます。
- 設定方法:「外観」>「カスタマイズ」>「色」または「背景画像」に進みます。
- 色: 基本的な配色(ライトまたはダーク)や、アクセントカラーを変更できます。
- 背景画像: サイト全体の背景に画像を設定できます。
- ブログ機能
- Twenty Seventeenはブログテーマとしても非常に優れています。投稿の表示方法やアイキャッチ画像の扱いに特徴があります。
- アイキャッチ画像: 投稿にアイキャッチ画像を設定すると、ブログのトップページやアーカイブページで美しく表示されます。
- 投稿フォーマット: 標準、ギャラリー、引用、ステータス、チャットなど、様々な投稿フォーマットに対応しており、それぞれに合わせた表示が可能です。
Twenty Seventeenを使う上でのヒント
- カスタマイザーを積極的に使う: Twenty Seventeenのほとんどの設定は、「外観」>「カスタマイズ」からリアルタイムでプレビューを確認しながら変更できます。試行錯誤しながら理想のサイトを構築しましょう。
- デモコンテンツの確認: Twenty Seventeenのデモサイト(WordPress.orgなどで確認可能)を見て、どのようなデザインが可能か参考にすると良いでしょう。
- 子テーマの利用を検討: もしCSSをカスタマイズするなど、テーマファイルを直接編集する場合は、将来のテーマアップデートで変更が失われないように「子テーマ」を作成して利用することを強く推奨します。
Twenty Seventeenは、シンプルながらも多機能で、写真や動画を効果的に活用できるテーマです。上記のポイントを押さえることで、あなたのウェブサイトを魅力的に構築できるでしょう。
Twenty Seventeenの注意点
WordPressのデフォルトテーマであるTwenty Seventeenは、シンプルでビジネスサイトに適したデザインが特徴ですが、利用する上でいくつかの注意点があります。
Twenty Seventeenの主な注意点
- 限られたカスタマイズ性
- デザインオプションの少なさ: Twenty Seventeenはシンプルさを重視しているため、デザインの柔軟性が限られています。例えば、レイアウト、フォント、細かいスタイルの変更は、他の多機能なテーマに比べてオプションが少ないです。大幅なデザイン変更を行いたい場合は、CSSの追加や子テーマの利用が必要になります。
- ウィジェットエリアの限定: サイドバーはブログページや個別投稿ページにのみ表示され、固定ページには表示されません。また、フッターには2つのウィジェットエリアがありますが、全体的にウィジェットエリアの自由度は高くありません。
- フロントページの機能と表示
- セクションの制限: フロントページに表示できるセクションは最大で4つまでです。これ以上のコンテンツをトップページに表示したい場合は、工夫が必要です。
- アイキャッチ画像の重要性: フロントページの各セクションは、設定された固定ページのアイキャッチ画像を大きく表示します。そのため、高品質で適切なサイズのアイキャッチ画像を用意することが非常に重要です。推奨サイズは幅2000px × 高さ1200pxです。画像が小さいと、ぼやけたり、デザインが崩れたりする可能性があります。
- 動画ヘッダーと画像の表示問題: 動画ヘッダーを有効にすると、固定ページのアイキャッチ画像が表示されなくなるという報告があります。これはテーマのバグとして認識されており、修正策としてCSSの追加が提案されることがあります。
- モバイルでのスクロールエフェクト: デスクトップで機能する一部のスクロールエフェクト(特に背景画像の固定スクロール)が、モバイルデバイス(特にiOS)で正常に動作しない場合があります。これはモバイルブラウザの仕様による既知の問題です。
- SEOとパフォーマンス
- 基本的なSEO機能: Twenty Seventeen自体には、構造化データマークアップなどの高度なSEO機能は組み込まれていません。SEOを強化するには、別途SEOプラグインの導入が推奨されます。
- ページの表示速度: 軽量でレスポンシブなテーマですが、画像が多いサイトでは表示速度が遅くなる可能性があります。パフォーマンスを最適化するには、画像の最適化、キャッシュプラグインの導入、Google Fontsの無効化などの対策が必要になる場合があります。
- 互換性と技術的な側面
- WordPressバージョン: WordPress 4.7以降で動作するように設計されています。古いWordPressバージョンでは正常に動作しない可能性があります。
- プラグインとの相性: 特定のプラグインとの競合が発生する可能性は他のテーマと同様に存在します。特に、CSSを大幅に変更するプラグインや、独自のスクリプトを持つプラグインでは注意が必要です。
- 子テーマの利用推奨: テーマファイルを直接編集すると、テーマのアップデート時に変更が上書きされてしまいます。カスタマイズを行う際は、必ず子テーマを作成し、子テーマ内で変更を行うようにしましょう。これにより、テーマのアップデート後もカスタマイズが保持されます。
Twenty Seventeenを最大限に活用するためのヒント
- 高品質なアイキャッチ画像の準備: フロントページの魅力を最大限に引き出すために、推奨サイズ(2000px × 1200px)以上の高品質な画像を各セクションの固定ページに設定しましょう。
- 子テーマの活用: デザインや機能のカスタマイズを行う際は、必ず子テーマを使用し、
functions.php
やstyle.css
を編集しましょう。 - 必要に応じてCSSを追加: より細かいデザイン調整が必要な場合は、カスタマイザーの「追加CSS」セクションや子テーマの
style.css
にCSSを記述します。 - パフォーマンス最適化プラグインの検討: 表示速度が気になる場合は、キャッシュプラグインや画像最適化プラグインの導入を検討しましょう。
- シンプルなビジネスサイト向け: Twenty Seventeenは、情報提供型のシンプルなビジネスサイトやブログには非常に適しています。高度な機能や複雑なレイアウトが必要な場合は、他のテーマの検討も視野に入れると良いでしょう。
これらの点を考慮することで、Twenty Seventeenを効果的に活用し、ウェブサイトを構築することができます。