Gutenbergブロック

AFFINGERブロック ~ Gutenbergの基本と注意事項

ver2.8.0より「Gutenberg用プラグイン」は「AFFINGERブロック」プラグインに名称変更しました。

Gutenbergは現在、頻繁に仕様変更が行われる為、WordPress本体アップデートに伴いレイアウト崩れや不具合などが起こる可能性もございます。

ブロックや機能によっては未対応及びテーマ側で機能を停止している場合がございます

記載している機能は変更及び削除される可能性がございますので予めご了承ください

最初の設定

ACTIONでGutenbergを利用する上で知っておくべき内容及び注意点をご説明いたします。

「AFFINGERブロックプラグイン」のインストール

専用の「AFFINGERブロックプラグイン」を「プラグイン」>「新規追加」よりzipファイル(st-blocks.zip)のままインストール、有効化して下さい。

「AFFINGERブロックプラグイン」は商品内フォルダ内または現時点では各購入ユーザー限定ページにてダウンロードできます。

初期設定

サイドメニュー又は管理バーの「Gutenberg設定」を開きます。

「Gutenberg設定」ではGutenbergブロックを使用するのに便利な設定を行うことが可能です

全般設定

投稿画面の幅

ブロックエディタ編集画面の最大幅を指定します

自動保存間隔

Gutenbergに実装されている自動保存間隔を変更します

Gutenbergブロック厳選モード

Gutenbergブロック厳選モードでは使用頻度が低いと思われるブロックを非表示にしています。

「ブロックタイプ又はスタイルを変更」の項目をシンプルにする

 

「ブロックタイプ又はスタイルを変更」の項目をシンプルにするを有効化するとブロック変換の内容から「スタイル」を非表示にしてシンプルにします。

マイ細マーカー設定

段落メニューのプルダウンにて選択できる「マイ細マーカー」の色を設定できます(ClassicEditor兼用)

「ストライプ」を有効化するとマーカーがストライプデザインになります。

フォントサイズ

ACTIONのフォントサイズ設定では「小・標準・大・超大」の4パターンを用意しています。

「標準」は基本、デフォルトと同じですが段落スタイルのデフォルトフォントサイズが90%(正確には.9em)となっているため、通常サイズに戻したいときに「標準」を使用して下さい。

ボーダー設定

段落やグループ、リストブロックなどで使用できるボーダー設定の色や丸みを設定できます。

オリジナルカラーパレット

Gutenbergの色設定にあるカラーパレットの最後の4カラーを指定できます。

デザインによってはカスタムカラーに対応していないので、よく使うカラーはパレットに登録しておきましょう

次はコチラをチェック

注意事項

解決しないことは検索もしてみてね

人気の解析ツールをセットにしたお得なパックです。サイトの状況や改善点を視覚化することで目標達成のためやるべきことが明確になります。

  • シンプルでわかりやすいアクセス解析
  • クリック計測・広告管理機能
  • ABテスト機能

今ならお得なキャンペーン中!

さらに詳しくみる

テーマ固有の機能説明となります(WordPress自体の機能説明は省略しております)

Gutenbergブロックご利用の注意点

  • 当マニュアルにて記載(説明)していないブロック及び設定には対応していない場合がございます
  • ウィジェットブロックエディター及びメニューブロックエディター、テンプレートエディター機能には非対応です(対応予定は未定です。)
  • ブロック機能は原則としてコンテンツ(記事)内での利用を想定しております。以外の箇所では正常に反映されない場合やレイアウトが崩れる場合がございます。
  • オリジナルスタイルのカラーはパレットのみ対応しております(カスタムカラーには未対応です)
  • WordPress本体(デフォルト)のブロックパターンは非表示になっております
  • Gutenbergで設定できる数値等は柔軟性を持たせておりますが、極端な数値はレイアウトが破たんする場合がございます
  • 記事一覧(カテゴリ・タグ含む)、会話ふきだし、目次、URLカード等は「追加 CSS クラス」非対応です。
  • 原則としてパソコン端末での編集を想定しております(モバイル管理画面ではレイアウトが崩れる場合がございます)
  • クラッシックエディターとは別仕様となります。(できることや設定、デザインは異なります)
  • ブラウザ側と投稿画面のデザインは同一ではございません。(仕様上、Gutenberg側は簡潔又は別デザインとなる場合がございます)
  • AMP非対応(クラッシックブロックのみ対応※条件等はWING同様)
  • LPワイド(レイアウト)非対応(クラッシックブロックのみ※条件等はWING同様)
  • テーマのデザインや設定は原則として第一階層での使用を想定しております。入れ子による使用は状態によってレイアウトが崩れる場合がありますのでご注意下さい。
  • 幅が狭くなるカラムブロック内ではレイアウトが崩れる場合がございます。
  • 従来のショートコードはクラッシックブロック又はブロックに直接記入してご利用ください。
  • 従来のショートコードのによるデザインや設定とGutenbergブロックは名称が同じでも内容及びデザインが異なる部分がございます。
  • デザインにbefore、after属性をしているため編集時に(管理画面内にて)軽微なレイアウト崩れが起こるケースがございます
  • WordPressの仕様変更により、オリジナルブロックの「文字サイズ」設定の名称が「カスタム」に変更になりました。

基本と注意事項

Gutenbergブロックの基本と注意事項

グループ

マイブロック

ACTION 専用ブロック

SUGOI MOKUJI(すごいもくじ)[PRO] - 【公式】STINGER STORE
SUGOI MOKUJI(すごいもくじ)

本を買うときに目次を確認するように、ブログやサイトにとって目次はユーザーが記事を読むかどうかを決定す ...

on-store.net

外部サイトやリンクもブログカードにできるWordPressプラグイン
外部サイトやリンクもブログカードにできるWordPressプラグイン

セール対象商品 3,980円 → 2,980円 このプラグインを利用するには別売のWordPress ...

on-store.net

AFFINGERデザインカード

オススメ記事

no image 1

ver20240115よりレイアウト及びウィジェットエリア名称を一部変更いたしました。 下部にPDF ...

2

https://action-sample.com/ 上のサイトのようなカテゴリーで分けた記事一覧の ...

3

AFFINGERブロックプラグインプラグインを有効化しよう 当テーマは「AFFINGERブロックプラ ...

-Gutenbergブロック

--時間---

10月のキャンペーン商品はコチラ

AFFINGER公式マニュアル

パスワードを入力してください

- 不明な方はコチラ -

PAGE TOP