〜導入編〜「BurgerEditor」プラグインのスタイル調整について

みなさんこんにちは!
今回は、ベーサーマーケットで人気のプラグイン「BurgerEditor」とはなんぞや、からデザインと装飾の変え方について紹介したいと思います。

「BurgerEditor」は、ブログ記事や固定ページの入力や更新がとっても楽になるプラグインです。
ブログ記事や固定ページの編集画面で、ブロックを積み上げる様にコンテンツを作る事ができます。

ブロックごとのデザインは元から調整されていてるのでレスポンシブ対応済。なので、インストールしてそのまま使う事ができます。
タイトルや色味などの装飾を「用意したデザインに適用させたい!」という時はぜひこの記事をご参考いただけると嬉しいです。

プラグインについての紹介や導入の仕方などを書いていたら長くなってしまったので、さっさとスタイル変更について知りたいぜ!って方は〜実践編〜へ。笑
https://catchup.co.jp/blog/media/archives/416
        
BurgerEditor初めましての方はぜひ↓↓このまま↓↓どうぞ♪

直感的な操作でカンタン更新!|BurgerEditor
https://burger.d-zero.co.jp/

BurgerEditorプラグインについて

BurgerEditorは、ベーサーマーケットからダウンロード(購入)することができます。
カテゴリ「プラグイン」の中にbaserCMS[5系対応版]と[4系対応版]の2種類があり、[5系対応版]には無料お試しができる機能限定版もあるので、今利用しているbaserCMSのバージョンに合わせて、選んでくださいね。

ちなみに、対応しているbaserCMSとバージョンが違うと、プラグインインストール後、編集画面を開いた際にこのようなエラーになってしまうのでお気をつけください。

製品版

【baserCMS5系対応】BurgerEditor
https://market.basercms.net/products/detail.php?product_id=161

【baserCMS4系対応】BurgerEditor (v2) 
https://market.basercms.net/products/detail.php?product_id=66

お試し無料版

【baserCMS5系対応】BurgerEditor Limited Editon(機能限定版)
https://market.basercms.net/products/detail.php?product_id=61  

マーケットにも記載がありますが、無料お試しの機能限定版では使えるブロックの数に制限があります。(製品版で使えるブロック数のおよそ半分以下)
また、プログラムの改変やブロックの追加は禁止されています。

逆に、製品版は40種類以上のコンテンツブロックを利用できる上に、オリジナルのコンテンツブロックも追加できるので、繰り返し使うレイアウトパターンやパーツを用意しておく事ができるそうです。

せっかくなので数えてみると、製品版には2024年5月時点で48種類のコンテンツブロックがありました。
「画像とテキスト」のコンテンツブロックだけでも様々なパターンの種類があり、「ボタン」パーツも2カラム・3カラムで配置できるコンテンツブロックが用意されています。できない事はないぐらいのパターンがあります。
※メンテナンスやバージョンアップなどで、コンテンツブロックの内容や利用できるパーツ、種類は変動されて更新されています。

「BurgerEditor」を利用することで、ページをまたいでコピペコピペ・・・エディター内のソースを開いて細かい調整・・・などせずとも、編集画面でポチポチとするだけでブログ記事やページの追加・更新ができちゃうんです。とても楽ちん。

キャッチアップでは、ほぼほぼの案件でBurgerEditorを導入させてもらっています〜。

エディター設定

baserCMSをインストールした時点ではデフォルトで「CKEditor」が設定されています。

BurgerEditorプラグインをインストール、有効化した時点でエディタの設定が「BurgerEditor」に切り替わるので、あえて設定画面にいくこともありませんが、
「システム基本設定 > エディタ設定」で設定ができます。

入力について

記事内での使い方はとってもカンタン。
新しいページを作る時にはまっさらな状態なので、コンテンツ編集エリアの「下に要素を追加」ボタンからブロックコンテンツを選びます。
選んで設置されたコンテンツブロックのそれぞれにボタンがあります。

①:コンテンツブロックをひとつ上(下)に移動
②:上にコンテンツブロックを追加
③:下にコンテンツブロックを追加
④:オプション設定
⑤:ブロックをコピー
⑥:ブロックを削除

コンテンツブロックの「位置の入れ替え」の他にも、
「オプション設定」ではカラムの幅の設定、id・classを直接指定、下のブロックとの余白指定、背景色・枠線の指定などを細かく調整・指定ができます。

ちなみにテーブルのブロックはポチポチと簡単に行を増やせるので、タグまみれの中、タグやタグと格闘する日々とはオサラバできますよ。 

コンテンツブロックの中で、CKEditorもバッチリ使えます。

リストの入力やタグだったりのHTMLタグをそのまま入力したい時などには「1カラムテキスト」ブロックでCKEditorの機能を堪能することもできます。

 

その他にもギャラリースライダーやYoutubeの動画のコンテンツブロックもあります。
コンテンツブロックを積み上げるだけで、簡単楽ちんにブログやページの編集ができるので、お客様にも喜んでいただきやすい上に、自分でサイトを作るときにも便利なプラグインです。

ご紹介だけで結構長くなってしまいましたので、
この先のデザインや装飾の変更の仕方は「〜実践編〜「BurgerEditor」プラグインのスタイル調整について」にて紹介しているので、ぜひ続けてご覧ください!

 

baserCMSやWebサイト構築のご相談など
お気軽にお問い合わせください

お問い合わせ
  • このエントリーをはてなブックマークに追加

AUTHOR

濱地 麻実

濱地 麻実 エンジニア

福岡県生まれ、福岡育ち、冬時期はもっぱら水炊きばかり作っています。
WEBの世界を知ってから、物事の見方がぐっと面白く広がり、それからずっとWEB制作の何かしらをしてきました。

「ああ、やっときゃよかったってことが絶対ないように。やったけどダメだったねってほうがマシ」
という宮崎駿さんの言葉を胸に、とりあえずチャンスがあったらやってみるスタイルで今このページの自己紹介があります。
時間も体力も環境も限りは必ずありますが、今出来ることに尽力します。

お客様が、チームが、自分が安心できるお仕事を心がけて
日々頑張っていきたいと思っていますので、
どうぞ(引き続き)よろしくお願いいたします!


お仕事中に流すBGMはその日の気分にもよりますが、
私は邦楽・洋楽の他には主に、ゲームのサウンドトラックを流すことが多いです。

少し前まではゲームのサウンドトラックCDやアルバムを買ってコンポで流してましたが、
今の時代サブスクで色々選べてすぐに聞けるのでとてもありがたいですね。

■ 流すことの多いサウンドトラック
・聖剣伝説レジェンドオブマナ
・FF9
・FF10(祈り子の歌、歌えます)
・サガ・フロンティア
・ヴィーナス&ブレイブス~魔女と女神と滅びの予言~ 
・クロノ・トリガー
・クロノ・クロス
・アルトネリコ

BGMに限らず、「このゲーム、良いよ!」などあれば教えてください♪

こんな記事も書いています