無料
Twenty Twenty

作者: the WordPress team
始めてみよう

Twenty Twenty  は、WordPress の新しいデフォルトテーマです。ブロックエディターの柔軟性を持たせたデザインになっています。組織やビジネスに使用する場合は、カラム、グループ、メディアを組み合わせてダイナミックレイアウトを作成し、サービスや製品を際立たせることができます。従来のブログでこれを使用する場合は、コンテンツカラムを中央に配置してタイポグラフィを使用する方法でも十分に目立つページを作成できます。

1440px のノートパソコンの画面では、メインカラムの幅は最大で580px になります。幅広ブロックの幅は最大1200px で、全幅ブロックは画面の横全体に拡張します。

全幅ブロックエディターサポート

Twenty Twenty のブロックエディター

Twenty Twenty は、ブロックエディターによる自由な創作性を最大限に活用する仕組みになっています。特に、カラムブロックとグループブロックを組み合わせることで複雑なブロックレイアウトを実現でき、印象的なランディングページに仕上げることができます。Twenty Twenty にはブロックエディターの全幅エディタースタイルが含まれているため、エディターには実際のサイトとほとんど変わらない内容が表示されます。

Twenty Twenty ではサイトロゴがサポートされており、個人ブログのアバターとして、またはビジネスロゴやアイコンとして使用できます。サイト上でロゴを変更するには、以下の手順で実行します。

  1. 「参加サイト」 → 「カスタマイズ」を開き、「サイト基本情報」セクションをクリックします。
  2. 「ロゴを追加」ボタンをクリックして、メディアライブラリを開きます。
  3. 新しい画像をアップロードするか、メディアライブラリにある画像を選択します。
  4. 「ロゴに設定」をクリックすると、プレビューにロゴが表示されます。
  5. 上部の「公開」ボタンをクリックして、変更を保存します。

Twenty Twenty では投稿やページ上のアイキャッチ画像に太字加工を施します。


アイキャッチ画像の推奨サイズは、幅1980 x 高さ1485px です。

カスタムカラー

Twenty Twenty には3つの色設定があり、サイトに独自のタッチを加えることができます。色設定を変更するには、「カスタマイズ」 → 「色」に移動します。

Twenty Twenty に含まれる色設定 :

  • 背景色 (デフォルトはライトベージュ)
  • ヘッダーとフッターの背景色 (デフォルトは白)
  • メインカラー (デフォルトはピンク)

サイト上の要素の色は、選択した背景色に基づいて自動的に算出されます。これにより、すべての訪問者にとって見やすい色のコントラストを実現できます。

カバーテンプレート

Twenty Twenty には、「カバーテンプレート」と呼ばれるページテンプレートがあり、投稿やページのタイトルがアイキャッチ画像の上部に表示されます。

Twenty Twenty のカバーテンプレート

投稿やページでカバーテンプレートを使用するよう設定するには、右側のサイドバーの「ドキュメント」タブを選択し、「投稿 / ページ属性」タブを展開し、「テンプレート」ドロップダウンで「カバーテンプレート」を選択します。

Twenty Twenty では、カスタマイザーの「カバーテンプレート」タブにカバーテンプレートのさまざまなオプションが用意されています。ここでは、画像オーバーレイの背景色や透明度、オーバーレイの上に表示されるテキストの色を設定できます。さらに、訪問者がスクロールしたときに背景画像が固定される、パララックス効果を持たせることができます。

ウィジェット

Twenty Twenty では、サイトのコンテンツ下のフッターに2つのウィジェットエリアがあります。カラムの最大幅は570px です

画面の幅が700px 以上の場合、ウィジェットは自動的に2カラムで表示されます。

ソーシャルアイコンを追加する

Twenty Twenty にはソーシャルアイコンメニューがあります。ソーシャルメディアのプロフィールへのリンクを追加でき、フッターにロゴとして表示されます。

この機能を使用するには、まず「ソーシャルリンクメニュー」を作成する必要があります。

次に、メニューの配置を決めます。

  1. 「カスタマイズ」 → 「メニュー」に進みます。
  2. 「メニュー位置」パネルを選択します。
  3. 作成したメニューを「ソーシャルリンクの位置」に割り当てます。
  4. 上部の「公開」ボタンをクリックして、変更を保存します。

Twenty Twenty のソーシャルアイコンメニューには、以下のアイコンが含まれます。

  • Behance
  • CodePen
  • DeviantArt
  • DockerHub
  • Digg
  • Dribbble
  • Dropbox
  • Facebook
  • Flickr
  • Foursquare
  • GitHub
  • Google+
  • Instagram
  • LinkedIn
  • Meanpath
  • 普通
  • Pinterest
  • Periscope
  • Pocket
  • Reddit
  • Skype
  • SlideShare
  • Snapchat
  • SoundCloud
  • Spotify
  • StumbleUpon
  • Tumblr
  • Twitch
  • Twitter
  • Vimeo
  • Vine
  • VK
  • WordPress
  • Yelp
  • YouTube

主な仕様 (単位はすべてピクセルです) :

  1. 1440px のノートパソコンの画面では、メインカラムの幅は最大で1032px になり、1カラムのレイアウトになります。
  2. フッターには、ウィジェットエリアが1つあります。カラム幅は1032px です。
  3. アイキャッチ画像の推奨サイズは、幅2000 x 高さ1200px です。

このテーマをダウンロードして、インストール型 WordPress のインストールに使用できます。

ダウンロード
WordPress の使い方を学ぶ初心者でも簡単に、初めてのウェブサイト＆ブログ作りを学べます。
コースを視聴