ウェブサイト検索

Getwid - Gutenberg 用のカスタマイズ可能な WordPress ブロック

グーテンベルク。その言葉を聞くだけで氷が溶けるかもしれません。通常、「グーテンベルク！」と叫んだ後に続く静寂の中で、ピンが落ちる音が聞こえます。いくつかの場所で。おそらく叫ぶべきではないかもしれませんが、それが重要ではありません。グーテンベルクの編集者にとっては寒い日ですね？

Gutenberg が WordPress のデフォルトのコンテンツ エディターになったとき、多くのユーザー (初心者も開発者も同様) は懐疑的でした。それは苦痛な移行でした。なぜなら、変化するからです。新しいエディターは、ユーザーが WordPress でコンテンツを作成する新しい方法を学び、適応する必要があることを意味しました。

確かに古いやり方を変えるのは難しいので、おそらくそれがグーテンベルクが最初は激しい抵抗に直面した理由かもしれません。しかし、時間の経過とともに状況は大きく変わりました。多くのユーザーは最初は当惑しましたが、特に使いやすく、さらに重要なことにプラグインで拡張できるため、人々は新しいエディターをすぐに気に入りました。

今日のレビューの主題である Getwid などのプラグインのおかげで、これまで想像もできなかった方法で Gutenberg を強化できます。そして、この勢いが続けば（そしてそうなるでしょう）、Gutenberg には非常に明るい未来があります。私の意見では、印象的なページや投稿を作成するために WordPress ページビルダーをほとんど必要としないユーザーはますます増えていくでしょう。

今日のレビューでは、Getwid をウェブ上で見つけられる最高の Gutenberg プラグインの 1 つにするすべての機能を見ていきます。何が期待できるかを示すために、プラグインをテストし、Getwid がすでに強力な Gutenberg エディターにもたらす 30 以上のブロックを簡単に説明します。

この前文では、カバーすべきことが山ほどあるので、 それを理解していたほうがよいでしょう。私がそこで何をしたかわかりますか？あはは。さて、始めましょう。

ゲットウィドとは何ですか?

まず最初に、Getwid とは一体何ですか? Getwid は、Gutenberg エディターを大幅に拡張するのに役立つ気の利いたプラグインです。とてもシンプルですか？言い換えれば、Gutenberg で素晴らしいコンテンツを作成できる 34 ブロックの美しいコレクションです。

開発者の Motopress 氏によると、Getwid は Gutenberg にシームレスに接続されており、「Gutenberg への全体的な移行のストレスが軽減されます。」スムーズな移行は、初めてのユーザーにとって特に重要です。最も良い点は、プラグインが WordPress.org から無料でダウンロードできることです。つまり、すぐに使い始めることができます。

Getwid は最高の WordPress コーディング標準に従っており、コードを掘り下げることなくコンテンツを充実させるための完璧なソリューションを提供します。さらに、すべての Gutenberg 対応 WordPress テーマと完全に互換性があるため、非互換性の問題が発生することはありません。

さらに、Getwid は他のサードパーティの Gutenberg プラグインと互換性があり、希望する魅力的なコンテンツを作成するためのより多くの機能を提供します。また、Getwid には、ブランドや好みに合わせて各ブロックのスタイルを設定できる豊富なオプションが付属しています。

使いやすい Gutenberg ブロック

さらに、このアドオンはセットアップと使用が非常に簡単なので、開発者が手を握る必要はありません。コーディングの知識も必要ありません。さらに、Getwid は CSS 縮小などの最新のパフォーマンス トリックを備えているため、WordPress サイトの速度を気にせずに素晴らしいコンテンツを作成できます。

素晴らしいコンテンツと言えば、Getwid は「効率的なランディング ページの作成、活気に満ちたサービス ページの紹介、人目を引くポートフォリオの構築」、美しいスライダーの追加、素晴らしい見出しの実装、価格表の表示などをサポートします。 「…ビジネス Web サイト、スタートアップ、クリエイティブ プロジェクト、その他の多様なニッチ」を強化するために必要なすべてのブロックを提供します。

Getwid Gutenberg ブロックのリスト

Getwid には、かなりの数の Gutenberg ブロックが付属しています。覚えておいてください。これはコアの Gutenberg ブロックでも機能するため、Web サイトで機能する素晴らしいコンテンツの作成を妨げるものは何もありません。 Getwid で利用できる Gutenberg ブロックのリストは次のとおりです(警告: かなり長いものです):

  • セクション
  • メディア&テキストスライダー
  • 画像スライダー
  • アイコン
  • アイコンボックス
  • バナー (はい、アニメーション付きです – うおお!)
  • アコーディオン
  • タブ
  • トグル
  • 画像スタック ギャラリー
  • グーグルマップ
  • 最近の投稿
  • 高度な見出し
  • 画像ボックス
  • アドバンスドスペーサー
  • ソーシャルリンク
  • ボタングループ
  • お客様の声
  • パーソンボックス
  • インスタグラム
  • プログレスバー
  • 円形の進行状況バー
  • カウンター
  • プライスボックス
  • お問い合わせフォーム
  • ポストカルーセル
  • ポストスライダー
  • カスタム投稿タイプ
  • 価格表
  • メールチンパンジー
  • ビデオポップアップ
  • 画像ホットスポット
  • 秒読み
  • コンテンツのタイムライン

ふー、何のリストだ？また、上記の各ブロックには豊富な設定、スタイル、オプションが付属しているため、コンテンツを好きなようにデザインできます。

これまでのところ、Getwid Gutenberg ブロック プラグインは非常に有望に見えます。

何を扱っているかがわかったので、Getwid をインストールしてさまざまなブロックを見てみましょう。私がプラグインをテストしたときと同じように、次のセクションも楽しんでいただければ幸いです。

Getwid Gutenberg Blocks プラグインをインストールする方法

Getwid は公式 WordPress プラグイン リポジトリで利用できるため、プラグインをコンピュータにダウンロードするのに時間を無駄にする必要はありません。代わりに、WordPress 管理ダッシュボード内からプラグインを直接インストールします。

さっそく、WordPress 管理者ダッシュボードにログインし、以下のスクリーンショットで示すように、[プラグイン] > [新規追加] に移動します。

以下に示すように、[プラグインの追加] ページで、キーワード検索ボックスに「Getwid」と入力し、[インストール今すぐ] ボタンを押します。

1 秒も無駄にせず、以下で強調表示しているように [有効化] ボタンをクリックしてインストールを完了します。

以上です; Getwid のセットアップは簡単だと言ったのは嘘ではありません 🙂

ここで、Gutenberg エディター内で Getwid が提供するものを見てみましょう。何が用意されているかを確認するには、新しいページまたは投稿を作成する必要があります。好きなものを使って作業してください。

新しいページの追加

純粋に説明目的でページを操作します。また、ランディング ページ テンプレートが付属する、尊敬されている Total WordPress テーマを使用しているためでもあります 🙂

ここまでで、WordPress に新しいページを追加する方法をすでにご存知かと思いますが、まったくの初心者の場合は、以下に示すように、[ページ] > [新規追加] に移動します。

ページ タイトルを追加し、必要な設定を選択します。たとえば、実際に作成したような全幅のランディング ページを作成したい場合は、以下に示すように、[ページ属性] セクションからオプションを選択します。

テーマに応じて、[ページ属性] セクションに異なるオプションがある場合があることに注意してください。

Getwid Gutenberg ブロックの追加

Getwid ブロックの追加は、一般的な Gutenberg ブロックの追加と同じです。 プラス (+) ボタンをクリックし、[Getwid ブロック] を下にスクロールして、目的のブロックを選択します。

セクションブロック

たとえば、Getwid セクションを追加するには、以下に示すようにセクション ブロックを追加するだけです。

A、B、C と同じくらいシンプルです。その後、適切と思われるセクションをデザイン/スタイルする必要があります。セクション ブロックを使用すると、コーディングせずにセクションごとに美しいページ レイアウトを作成できます。スライダー、背景画像、ビデオ、視差、アニメーション、図形、複数の色などをセクションに簡単に追加できます。セクション ブロックを使用して作成されたページを確認するには、次のセクション デモを確認してください。

下の図に示すように、セクション ブロック内に任意のブロックを追加できます。さらに、必要に応じてセクションをカスタマイズできます。

ページの右側には、セクションをカスタマイズするためのオプションが多数あります。オプションを上から下まで簡単に説明します。

  • サイズ – ここでセクションの寸法を設定します。この記事の執筆時点では、ボックス化、 全幅、カスタムという 3 つの幅のオプションがあります。さらに、デスクトップ、タブレット、モバイル デバイスごとに異なるセクションの高さを設定できます。最後に、セクション ブロック内のコンテンツ ブロック間のギャップを指定するオプションがあります。
  • パディング – このオプションを使用すると、デスクトップ、タブレット、モバイル デバイスのセクションの周囲にパディングを設定できます。
  • マージン – さまざまなデバイスのセクション ブロックの周囲にマージンを追加します。
  • 配置 – ここでは、さまざまなデバイスのセクションの垂直方向と水平方向を指定できます。
  • 背景色 – セクションに好きな背景色を追加できます。
  • 背景のグラデーション – このオプションは、セクションの背景のグラデーションを作成するのに役立ちます。このオプションは、単色の背景を使用したくない場合に便利です。
  • 背景画像 – ここでは、色を使用する代わりに、セクションに背景画像を追加できます。
  • 背景スライダー – ページ セクションに背景スライダーを追加できるようになりました。なんて素敵でしょ？
  • 背景ビデオ – 背景ビデオでセクションを充実させたいですか?もしそうなら、Getwid がサポートします。
  • 前景 – セクションに前景効果を追加します。
  • 仕切り – セクション間に仕切りを追加します。
  • 入口アニメーション – Getwid のおかげで、さまざまなセクションを好きなようにアニメーション化できます。
  • 詳細 – ここでは、HTML アンカーと CSS クラスを追加できます。

メディアとテキストのスライダー ブロック

メディアとテキスト スライダー ブロックを追加するには、プラス（+） アイコンをクリックし、Getwid ブロックまでスクロールして、メディアとテキスト スライダーをクリックします。下に示された。

ブロックを追加すると、メディアをアップロードしてテキストを追加できるようになります。さらに、下の画像に示すように、右側のサイドバーからブロックをカスタマイズできます。

ここでは、上に示した右側のサイドバーのメディアとテキスト ブロックのオプションに関するいくつかの注意事項を示します。

  • 設定 – 設定タブで、スライドの数、画像サイズ、スライダーの高さ、コンテンツの幅、垂直/水平の配置を指定できます。
  • テキストの色 – このオプションを使用すると、スライダーのテキストの色をカスタマイズできます。
  • オーバーレイ カラー – オーバーレイ カラーを設定し、オーバーレイの不透明度を指定できます。
  • パディング – このオプションを使用すると、メディアとテキスト スライダーの周囲にパディングを簡単に追加できます
  • スライダー設定 – ここでは、スライダーにアニメーションを追加し、スライドショーを有効にすることができます
  • テキスト アニメーション – スライダー上のテキストをアニメーション化します。
  • 上級 – カスタム CSS クラスを追加して、スライダーをさらにスタイル設定できるようにします

これは、メディアとテキストのスライダー ブロックが動作している優れた例です。

画像スライダー

メディア & テキスト スライダーの他に、Getwid では画像スライダー ブロックも提供しています。これを行うには、以下のスクリーンショットで詳しく説明しているように、Getwid ブロックに移動し、画像スライダーブロックをクリックします。

メディア ライブラリから画像をアップロードまたは追加したら、以下に示すように、右側のサイドバーからスライダーをカスタマイズできます。

右側のサイドバーには、次のようないくつかのオプションがあります。

  • 画像設定 – このタブから、画像サイズの選択、画像の自動トリミング、各画像をメディア ファイルまたは添付ファイル ページにリンクすることができます。これは、写真家で、画像スライダーを使用して作品を表示する場合に特に有益です。
  • スライダー設定 – ここでは、デスクトップ、ラップトップ、タブレット、モバイルなどのさまざまなデバイスに表示できるスライドの数を指定できます。
  • コントロール設定 – このタブでは、ナビゲーション矢印とドットを表示する場所を指定できます。
  • 詳細 – ここにカスタム CSS クラスを追加します

より良いイメージを得るために、ここに画像スライダーのデモがあります。

バナーブロック

バナー ブロックを使用すると、WordPress ウェブサイト上でボスのように広告を掲載できます。バナー ブロックの追加も同様に簡単です。以下に示すように、Gutenberg エディター内の Getwid ブロック に移動し、 バナー ブロックをクリックします。

バナー メディア ファイルを追加すると、以下の画像に示すように、いくつかのオプションが表示されます。

上の画像からわかるように、バナーにリンクを簡単に追加し、そのリンクを新しいタブで開くことができます。右側のサイドバーには、バナーをカスタマイズするためのその他のオプションがあります。ここでは、バナーのサイズ、配置、色、アニメーションをカスタマイズできます。

Web サイト用に魅力的なバナーを作成するためのオプションがたくさんあります。これらのバナーのデモを自由にチェックして、何が作成できるかを試してください。

その他の Getwid Gutenberg ブロック

どんなに魅力的でも、今日のレビューでさらに 30 個の Getwid ブロックを取り上げることはできません。そんなことをしてしまうと、記事が長すぎて読めなくなるので、あなたは一日中ここにいることになります。

それでも、必要な Getwid Gutenberg ブロックを追加してカスタマイズできることを願っています。 Getwid ブロックに移動し、目的のブロックをクリックするだけです。その後、コンテンツを追加し、他のブロックの場合と同様に、右側のサイドバーからブロックをカスタマイズします。

Getwid Gutenberg ブロックの動作例をさらに確認するには、MotoPress の Getwid プラグイン ページにアクセスしてください。また、プラグインが提供するものをさらに詳しく説明した Meet Getwid の投稿もここにあります。

Getwid は、素敵なブロック スイートを備えた強力な Gutenberg プラグインです。さらに、各ブロックには、魅力的なコンテンツをすぐに作成できる独自のオプション セットが付属しています。

その上、プラグインはセットアップと使用が信じられないほど簡単です。 Getwid の機能を活用して Web サイトでのエンゲージメントを促進するために、コーディングの知識や経験は必要ありません。

このプラグインは 100% 無料でオープンソースであるため、財布やライセンスを気にせずに広範囲に使用およびカスタマイズできます。これは、WordPress プロフェッショナル ツールキットに含めるのに最適なツールです。

Getwid を使用して、苦労せずに WordPress ページと投稿を生き生きとさせられることを願っています。そうでない場合は、コメントセクションに懸念や提案を表明してください。

それ以外で、お気に入りの Gutenberg ブロック プラグインはどれですか?