Twenty Twenty-One

作者: the WordPress team
このデザインを選択

名前のとおり、Twenty Twenty-One は2021年のデフォルトの WordPress テーマです。このテーマはあなたのアイデア用の空白のキャンバスであり、ブロックエディターを活用できます。

わずか数秒で美しいレイアウトを作成できる新しいブロックパターンでは、このテーマの柔らかい色彩と人目を引く (かつ色あせない) デザインでコンテンツを輝かせることができます。Twenty Twenty-One は、ポートフォリオ、ビジネスサイト、個人ブログに最適です。

3つの異なるデバイスで表示される Twenty Twenty-One テーマ1440px のノートパソコンの画面では、メインカラムの幅は最大で610px になります。幅広ブロックの幅は最大1240px で、全幅ブロックは画面の横全体に拡張します。主な仕様 (単位はすべてピクセルです) :

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

パターン

Twenty Twenty-One は、複数の魅力的なブロックパターンをサポートしています。お好みに合わせて、ストーリーまたはブランドにマッチするコピー、画像、色でパターンをカスタマイズできます。

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

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

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

Twenty Twenty-One は、ブロックエディターの機能を最大限に活用するよう構築されています。Twenty Twenty-One にはブロックエディターの全幅エディタースタイルが含まれているため、エディターには実際のサイトと変わらない内容が表示されます。また、テーマにはカスタムカラーとタイポグラフィオプションがすべて備わっており、幅広ブロックと全幅ブロックもサポートしています。

カスタムの背景色

Twenty Twenty-One には、事前選択されたさまざまなパステルの色パターンがあり、それらはすべてコントラストの AAA 規格に準拠しています。テーマの独自の背景色を選択することもでき、アクセシビリティを考慮したテキスト色が自動的に選択されます。

柔らかなパステル調のレインボー

背景色を変更するには、「カスタマイザー」→「色」に移動します。

カスタマイザーでサイトの背景色を変更する

カスタマイザーで背景色を編集

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

ダークモード

Twenty Twenty-One は、デフォルトのテーマで初めてダークモードに対応しています。「カスタマイザー」>「色とダークモード 」パネルでダークモードのサポートを切り替えます。 カスタマイザーのダークモード表示の切り替え設定

ウィジェット

Twenty Twenty–One では、サイトのコンテンツ下のフッターのウィジェットをサポートしています。

ホームページへのコンテンツの追加

Twenty Twenty-One では、ブロックエディターを完全サポートしています。利用可能なブロックを選択して、サイトに幅広いコンテンツを作成できます。こちらのデモサイトでは、ホームページの作成方法をブロックごとに説明しています。

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

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

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

Twenty Twenty–One には、フッターのすぐ上にサブメニューを設定するオプションがあります。ソーシャルメディアのプロフィールへのリンクを追加する場合などに使用でき、ロゴとして表示されます。ソーシャルアイコンこれを使用するには、まずソーシャルリンクメニューを作成する必要があります。https://youtu.be/3rTooGV_mlg その後、そのメニューの配置場所を指定します。

  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

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

ダウンロード
このテーマについて質問がありますか ?このデザインを選択してサイトを始めましょう。私たちがお手伝いします。
Twenty Twenty-One テーマのスクリーンショット