カラムで設定が出来る内容についてご案内します。
■共通エリアを使用している場合はこちら
＞【画面説明】サイト／共通エリア一覧
目次
カラムのカスタマイズ設定
1.「行・カラムの編集」をクリックします。
2.「カラム」の編集パネルにある「カスタマイズ」ボタンをクリックします。
2.のボタンをクリックすると、編集画面の右側にカスタマイズのためのメニューバーが表示されるので、各項目を編集してください。
＜編集項目＞
編集中要素
デザインパーツ（パーツ）名、ナビゲーション、ヘッダー、フッター、右サイドバー、左サイドバーのいずれかが表示されます。
表示要素について下部で編集していきます。
追加するclass名
class名を入力します。
背景設定
背景のカラーまたは画像を設定していただけます。
・カラー：背景色をコードまたはパレットで選択いただけます。
・背景画像：編集中要素の背景画像を、「ライブラリから選択する」より、選択していただけます。
余白
編集中要素の縦横幅を広げたい場合は余白を設定します。
上下左右のフォームにピクセル単位で数値を入力してください。
■余白調整の詳細はこちら
＞余白を調整する方法・注意点
枠線
編集中要素に枠線をつけることができます。
・カラー：枠線の色を指定します。
・太さ：枠線の太さをピクセル単位で指定します。
・種類：1本線、2本線、窪んだ線、隆起した線、破線、点線より選択します。
3. 編集画面より項目に値を入力し、最後に一番下にある「保存」ボタンを押してください。
背景色変更
色を指定する場合は、変更希望箇所のカスタマイズをクリックします。
カスタマイズで変更内容を指定後、「保存」をクリックして完了します。
背景画像変更
変更希望箇所のカスタマイズをクリックし、変更内容を指定後「保存」をクリックして完了します。
■背景画像の詳細設定についてはこちら
＞ヘッダーを設定・編集する方法
余白設定
カスタマイズボタンをクリックし、表示されるカスタイマイズメニュー内の【余白（px）】から余白調整が可能です。
■余白調整の詳細はこちら
＞余白を調整する方法・注意点
カラムの追加／削除
【カラムの追加方法】
1.各カラム内にカーソルがある時、該当するカラムの下箇所に「行・カラムを編集」ボタンが出てくるので、クリックします。
2.「行・カラムを編集」ボタンをクリックすると、カラムの右上にメニューが出てきます。
クリックした数に応じてカラムが分割され、完了です。
【カラムの削除方法】
1.各カラム内にカーソルがある時、該当するカラムの下箇所に「行・カラムを編集」ボタンが出てくるので、クリックします。
2.「行・カラムを編集」ボタンをクリックすると、カラムの右上にメニューが出てきます。
ゴミ箱ボタンをクリック⇒「削除」をクリックし削除完了です。
※1カラムしかない時に行のゴミ箱ボタンを押すと、エラーメッセージが表示され、削除できません。
クリップボードでの複製
「クリップボード」では、よく使うレイアウトを、セクション・行・カラム・パーツ毎に登録することができます。
- ページ内で同じコンテンツを使いまわしたい
- デザインは同じでテキストや画像、ボタンだけを変更したい
- 別ページでも使いたい
といった際に、セクション・行・カラム・パーツをクリップボードへ登録することで、同一ページ内、もしくは他のページでも再度同じものをドラッグ&ドロップしてして配置することができます。
※クリップボードは、コピー元のページのCSSをコピーしないので、CSSで実装されているスタイルがある場合は反映されない可能性があります。
※共通エリア、共通パーツにはクリップボードの機能はありません。
クリップボードはブラウザに記憶されていますので、別アカウントと同期することはできません。また、キャッシュのクリアといった初期化で消えてしまいますのでご注意ください。
【設定方法】
１.クリップボードをドラッグ&ドロップで登録する
登録する際は、ページ編集画面から「移動」マークをドラッグして、クリップボードのアイコンの上にドロップしてクリップしてください。
※ページに設置済みの共通パーツであれば、クリップボードに登録することは可能です。
２.パーツ名を設定し、完了
クリップボードのパーツを編集するモーダルが表示され、パーツ名を任意で設定できます。
■クリップボードの詳細についてはこちら
＞【画面説明】サイト／ページ編集 クリップボード
【使用方法（動画）】
任意の位置にドラッグ&ドロップし、完了。
※動画は新契約画面になります
【項目について】
①編集
パーツの名称を変更することができます。
②削除
パーツを削除します。
クリップボードで複製（コピー）する場合の注意点
クリップボードを使用し複製（コピー）後にデザインが適用されない、表示崩れなどが起きる場合には、
以下のような場合が想定されますので、ご注意ください。
- ページにCSSが適用されている場合のページのCSSのコピー忘れ
- 配置箇所（ヘッダーとセクションなど）の違いによるCSS適用範囲の違い
- カスタマイズの「追加するclass名」の記載忘れ
※「追加するclass名」の記載は、複製した対象パーツ以外に、セクションや行・カラムにclass名の記載がある場合もあるので確認ください