以降で標準搭載されているエディタ(記事を編集する画面)です。コンテンツを「ブロック」単位で挿入することができ、HTMLやCSSの知識がなくても、直感的に幅広い機能を活用できる優れものです。■WordPressプラグイン【Gutenberg】ここでは、ブロックをテスト的にご紹介します。皆さんの今後のご参考にしていただければ幸いです。次(▶の項目は、リンク先へ移動できます。「新規追加」をクリックして、新しい記事の入力画面を開きます。記事のタイトルを入力します。1-2:パーマリンクの入力パーマリンクは、記事ページのアドレス表示です。アドレスに記事のタイトルが、そのまま日本語で自動的に設定されるため、英小数字に変更する必要があります。「編集」ボタンをクリックしてから入力し、「保存」ボタンをクリックして設定します。右サイドバーの「パーマリンク」でも設定できます。「URLスラッグ」の囲いの中に入力してください。※パーマリンクの入力欄が表示されない場合は、「下書きとして保存」をクリックして、一旦保存してみましょう。1-3:カテゴリのチェック記事の内容を分けるためのカテゴリは、前もって設定しておけば、チェックして選ぶだけです。新しいカテゴリが欲しい場合は、「新規カテゴリの追加」より設定してください。1-4:アイキャッチ画像の設定アイキャッチ画像は、記事のタイトル画像となり、最上部に表示される画像です。あると綺麗に表示してくれます。ボタンをクリックして「ファイルをアップロード」か、すでに登録してある「メディアライブラリ」より画像を選び設定します。※後から「置き換え」や「削除」も可能です。左上の「+」アイコンからブロックメニューを開き、追加したいブロックを選択する。入力したブロック上下の「+」アイコンからも追加できます。ブロックの詳細設定メニューから、ブロックの複製・挿入・削除などが行える。2-3:ブロックの移動・並び替えブロックにカーソルを合わせると、左側に移動アイコンが表示される。矢印で上下に、または中央アイコンをドラッグで、ブロックの並び替えができる。各ブロック毎に専用のアイテムが用意されていますので、必要に応じて設定してください。Color」の2種類が表示される場合がありますが、それぞれ役割が違いますので、試しながら特性を理解してください。※サイトに即した「カスタムカラー」の設定も可能です。▲目次へもどる3:ブロックの種類・役割と主な設定3-1:ブロックの種類ブロックは、最初に「よく使うもの」が表示されますが、その下に「一般ブロック」「フォーマット」「レイアウト要素」「ウィジェット」「埋め込み」の5種類があり、多種多様なブロックが数多く用意されています。※「よく使うもの」は、ブロックを選択する毎に更新されます。以下のリストのブロック名をクリックすると、詳しい説明へリンクします。★一般ブロック最も使用頻度が高く、通常の記事ならこの中のブロックで作成できます。ダウンロード可能なファイルを挿入する★フォーマットHTMLやテーブルなど、さらに表現を広げるためのブロック。ソースコードを表示する★レイアウト要素レイアウトを整えるためのブロック。余白を挿入する★ウィジェットウィジェットを記事内に設置するためのブロック。使用頻度は低いので、取説には設定画面のみ掲載しますが、必要に応じて追加してください。タグクラウドを挿入する★埋め込みサイト外のコンテンツを埋め込むためのブロック。(全34種類)別のプラグインが必要なブロックもありますが、良く使われるコンテンツのみ紹介します。Instagramの記事を埋め込む3-2:ブロックの主な設定ブロックの設定画面と表示画面を入れました。WPの設定環境によって多少の違いはありますが、右サイドメニューとの併用で、多くの設定が可能です。▲目次へもどる段落:文章を入力する先頭の文字を大きく表示する「ドロップキャップ」の指定ができます。▲目次へもどる見出し:見出しを入力する文字サイズは、これ以外に右サイドメニューに、H5・H6もあります。▲目次へもどるリスト:リストを作成する番号なし、または番号付きのリストを作成できます。▲目次へもどる画像:画像を挿入するサイズ変更やリンク先も設定できます。▲目次へもどるカバー:背景画像つきのテキストを入力するオーバーレイでテキストやボタンが設定できますので、ヘッダーに最適です。▲目次へもどるギャラリー:複数の画像を並べて挿入する右サイドメニューでカラムの数も設定でき、「メディアファイル」を設定すると、ポップアップで開きます。▲目次へもどる引用:引用ボックスを挿入する引用の内容と引用先のリンクが設定できます。▲目次へもどる動画:動画を挿入するmp4などのファイルをアップロードできるほか、URLを入力するだけでYouTube動画を埋め込むことも可能です。右サイドメニューで「ポスター画像」を設定すると、サムネイル画像の表示もできます。▲目次へもどる音声:音声ファイルを挿入するシンプルにmp3などをURL指定orアップロードで設定できます。▲目次へもどるファイル:ダウンロード可能なファイルを挿入するテキストも入力できますし、ボタンの色も変更可能です。エディターを使用します。▲目次へもどる整形済み:改行や半角スペースなどをそのまま表示するスペースやタブを含むテキストを追加し、スタイリングして表示します。▲目次へもどる詩:詩や歌詞などを入力する特別な余白形式を使ったり、歌詞を引用したりできます。▲目次へもどるテーブル:テーブルを挿入する表などの資料データの共有に最適です。▲目次へもどるプルクオート:強調された引用ブロックを挿入する引用したテキストに、特別な視覚効果を加える事ができます。▲目次へもどるカスタムHTML:HTMLコードで入力するHTMLコードでカスタマイズでき、編集しながらプレビューが可能です。▲目次へもどるソースコード:ソースコードを表示するHTMLなどのコードを、そのままテキストとしてブラウザ上に表示します。★メディアと文章:画像とテキストを横並びで配置する画像とテキストの位置を入れ替えたり、画像のサイズも変更できます。▲目次へもどるカラム:左右均等割のカラムレイアウトで配置する右サイドメニューで、レイアウトに合わせてカラム数を変更できます。▲目次へもどるボタン:リンクボタンを設置する右サイドメニューで、色や形などのスタイルを設定できます。※リンク先は、別タブで開く設定ができません。▲目次へもどる区切り:区切り線を挿入する右サイドメニューで、線とドットのスタイルを選択できます。▲目次へもどる続きを読む:アーカイブに表示するテキストを設定するこのブロックよりも前にあるテキストが、抜粋文として表示されます。▲目次へもどる改ページ:記事を複数のページに分ける長い内容のコンテンツを、分ける場合に便利です。▲目次へもどるスペーサー:余白を挿入する右サイドメニューで、余白の高さを設定できます。使用頻度は低いので、取説には設定画面のみ掲載しますが、必要に応じて追加してください。全34種類:別のプラグインが必要なブロックもありますが、良く使われるコンテンツのみ紹介します。YouTube:YouTubeの動画を埋め込むYouTube画面の「共有」よりアドレスをコピーして、埋め込み欄へペーストします。▲目次へもどるFacebook:Facebookの記事を埋め込むFBページを開き、アドレスをコピペしたのですが、埋め込みが反映されませんでした。」を使ってみることに!FBページの「timeline」や「events」「message」を埋め込むためのコードが取得できるサイトで、ある程度のカスタマイズもできますので、非常に便利です。FBページのURLをコピペして、取得したいタブ(timeline・events・message)を打ち込みます。下に原寸で表示されますので、必要に応じてサイズを打ち込んだり、表示したい項目にチェックを入れます。SDK」が表示されますが、今回は隣の「IFrame」をクリックして、表示されたコードをコピーします。本サイトへ戻り、「カスタムHTML」ボックスを選択し、取得したコードをペーストします。▼▼▼サイズ指定をしていませんので、デフォルトの状態です。Editorプラグインで旧エディタを使うことも可能ですが、2022年までのサポートですので、それ以降どうなるかは判っておりません。最初は使いづらいと感じられるかもしれませんが、使いながら慣れていけば、かなり便利なエディタだと思います。うまく活用できれば、コンテンツの幅が飛躍的に広がりますので、この記事を参考に深めていってください。あなたの管理・運営するHPは大丈夫?身体の土台(基礎)、それは「根っこ」。ありふれた日常に彩りを添えてくれます。明けましておめでとうございます。2020-01-01(Wed)身体の土台(基礎)、それは「根っこ」。Diaryお問い合わせContact。