かんたん便利！
WordPressのタイトルを装飾
( Gutenberg )
WordPressの新エディタをかんたんに使いこなす方法をご紹介します！
（無料プレゼントあり）
- やっぱり新エディタは使いにくい
- びっくり！カスタムブロックを使えばきれいなレイアウトもかんたんに！
- どんなカスタムブロックを作れる？ 便利ブロック大公開 ！
やっぱり新エディタは使いにくい
WordPress 5.0 より新しい編集画面(Gutenberg)が採用されましたが、投稿の仕方がよく分からないので、旧エディタを使っているといった事はありませんか？
私も感じましたが、使い方がよく分からないですよね。
私の場合は、お仕事で新エディタをがっつり使う事になりかなり研究出来ましたが、やっぱり使いにくい部分があります。
特に最初から新エディタ内に用意されている「ブロック」では、文字の大きさを変更できないなど戸惑うと思います。
画像についても、配置した画像の縦横比を自動的に合わせてくれないため、結局はHTML文を直接編集したくなります。
雑誌のように、写真と文書を左右に配置しながら文書を画像に回り込ませる配置にしたいことも多いと思いますが、これも標準では見つけられませんでした。
びっくり！カスタムブロックを使えばきれいなレイアウトもかんたんに！
前述の、雑誌のような文書の回り込みですが、こちらは作成する機会がありましたので、カスタムブロックにするとどのような配置ができるのかをご紹介します。非常にかんたんに設置できます。
右側に画像、左側に文書（またはその逆）というレイアウトを
当社作成のカスタムブロックで配置してみました。
実際に、この文書の→側に画像が来てますよね。
長い文書を書いていくと、自動的に画像に沿って文書が回り込みます。
新エディタでは、文書と画像を配置するブロック「メディアと文書」が標準で存在しています。
しかし、残念なことに標準のブロック「メディアと文書」を使って文を作成してみると、画像が右側に配置されますが、回り込んではくれません。
このように細かい部分で使い勝手が悪い部分があります。
当社ではいち早くあたなが普段使うブロックを制作してご提供することが可能です。カスタムブロックを使えば、日々のブログや記事作成などの時間が大幅に短縮できます！
標準の画像とメディア配置ブロックを使用した例
右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。右側に画像があり、左側に文書を配置していますが、回り込みはされません。
回り込み画像を作成するブロックの使い方
by LOCOAPPS
動画では、回り込み画像のカスタムブロックの使い方についてご紹介しています。
背景色付きのタイトルもかんたんに作れます
by LOCOAPPS
以下のような、本投稿の見出しにも使用した「３行の背景色付きタイトル」（もちろん１行や２行としても使えます）もかんたんに作成できます。
この動画では、標準のブロックについてのご説明と、３行タイトルブロックの使い方についてご紹介しています。
どんなカスタムブロックを作れる？便利ブロック大公開 ！
カスタムブロックは便利です。
しかし問題もあります。
プログラムに詳しくなければ自分で作ることができません。
システムを制作している私でも、新たな開発環境の構築、ネットの情報（英語情報も合わせても）の乏しさもあり、１週間ほどの試行錯誤が必要でした。
１度手に入れたスキルはそのまま使えますので、かんたんなもので、環境が固定されていれば１ブロック数時間で作成できるようになりました。
そこで、
- 新エディタに対するブロック作成スキルを手に入れた
- 現状の新エディタは使いにくく、カスタムブロックの必要性は高い
- 私は自分で作れるので良いが、他の人も困っているはず
という点から、ご要望に応じたブロックを作成していこうかなと考えました。
では、どのようなブロックが作成できるのでしょうか？
３つの種類のブロックをご紹介します。
シンプルな配置タイプ
画像回り込み文書
画像を文書の左右に配置できるシンプルなブロックです。
スマホ表示時は回り込みを止め、上部に画像、下部に文書というレイアウトに自動的に変化させることも可能です。
テーブルタイプ
行や列を追加削除が可能なブロック
テーブルだけでなくリスト形式など、行や列を増やしたり消したりできるレイアウトです。
この画像のように、当社と他社の価格比較表を作成することも可能です。
独自レイアウト
プロフィールブロックなど
この画像では、プロフィールをサンプルにしていますが、様々な形式の入力フォーマットを作成することが出来ます。
ここでは、「顔写真」「肩書き」「名前」「スキル」「説明文」を入力できるようにしています。
まとめ
細かいスタイルの指定を行う必要がなく、設定画面で設定を行うだけでかんたんに見出しなどのブロックを追加することができます。
少々クセがありますが、使い慣れるとスタイル（css）の知識やHTMLの知識がほとんど無くても使えますので非常に便利です。
ご紹介した
３行ブロックのプラグインを無料プレゼント！
ご紹介した３行タイトルのブロックが無料でご利用頂けます。
ご指定のメールアドレスに「３行タイトルブロックが使えるWordPressのプラグイン」をダウンロードできるURLをお送りいたします。
是非、ダウンロードして快適な投稿をご体験ください！
今すぐダウンロードするにはこちらから！
独自のブロック制作について
あなた独自のブロックの制作をご希望の場合、下記のお申し込みフォームよりご連絡をお願いいたします。
価格は下記の通りとなります。
既存のブロックをそのまま利用する場合 | 既存ブロックをカスタマイズする場合 | 完全にオーダーメイド | |
|---|---|---|---|
入力項目数 | (税抜)10,000円 | (税抜)15,000円 | (税抜)20,000円 |
入力項目数 | (税抜)20,000円 | (税抜)30,000円 | (税抜)40,000円 |
入力項目数 | (税抜)40,000円 | (税抜)60,000円 | (税抜)80,000円 |
入力項目数 | (税抜)60,000円 | お見積り | お見積り |
補足事項１ | ご使用のテーマやプラグインとの相性により、そのまま既存ブロックをご利用頂けない場合もございます。その場合は全額返金で対応させて頂きます。 | ご使用のテーマやプラグインで動作するようにカスタマイズを行います。 | ご使用のテーマやプラグインで動作するように制作を行います。 |
補足事項２ | ご紹介しているブロックであっても、ブロックの制作をご依頼された方次第では、既存品を販売できない場合もございます。 | カスタマイズブロックを当社から他社へ販売可能な場合、制作費を20% OFFさせて頂きます。 | 制作したブロックを当社から他社へ販売可能な場合、制作費を20% OFFさせて頂きます。 |
補足事項３ | ご依頼者様による２次販売はご容赦ください。 | ご依頼者様による２次販売はご容赦ください。 | ご依頼者様による２次販売はご容赦ください。 |
補足事項４ | ー | テーブル形式やリストなど、動的に項目が増える場合は、１か所辺り(税抜)+20,000円で対応いたします。 | テーブル形式やリストなど、動的に項目が増える場合は、１か所辺り(税抜)+20,000円で対応いたします。 |
補足事項５ | ー | 完成形のブロック配置は手書きでも結構でsのでイメージ図をご提出ください。 | 完成形のブロック配置は手書きでも結構でsのでイメージ図をご提出ください。 |
独自ブロックの制作をご希望の方は、下記よりお問い合わせください。
他にもあります！便利ブロックの操作動画
以下、当社で作成したその他の便利ブロックをご紹介します。