GCCデータセンターからのお知らせ
ニュース追加の検証
ノーサイドさんのマニュアルに従って操作したうえで、その他の捕捉についてまとめました。
前提
データセンターサイトは「ブロックエディタ」というフォーマットを使っていて、
基本的には「ブロック」と呼ばれる行単位で画面を構成していきます。
例えば、このようにシンプルなテキストを表示したい場合、ブロックに直接文章を入力して段落を構成していきます。
Enterでの改行は別ブロック、Shift+Enterでの改行は同一ブロックとなります。
また、ブロックには種類(役割)を設定できます。テキストを表示するブロックの他にも
見出しを表示するブロック、画像を挿入するブロック、テーブルを挿入するブロックなどをそれぞれ作り、それらの組み合わせで記事を作っていきます。
公開について
公開の前に、記事の公開に関する設定をサイドバーの「投稿」タブで設定します。(※サイドバーが表示されない場合はヘッダー右の「設定」マークをクリックします。)
・表示状態: 記事を公開する対象者を設定します
・公開: 記事を公開するタイミングを設定します
・投稿者: 「gccdc」を選択
・カテゴリー: ページ上中央部に表示されるカテゴリーを設定します。基本的に「GCCデータセンターからのお知らせ」のみを選択します。
・タグ: 検索キーワードなどを追加できる?(後ほど調べます)
記事の公開はヘッダー右上の「公開」ボタンから行います。
クリックすると、記事の公開に関する設定の再確認が表示されます。※「公開前チェックを常に表示する」のチェックは外さないでください。
問題がなければ再度「公開」ボタンをクリックし、記事を公開します。
ブロックの種類について
ブロックにはそれぞれ種類(役割)を設定して使用します。テキスト、見出し、画像、テーブルetc…。代表的なもののサンプルは以下に説明します。
種類の設定は、未入力ブロック右側に表示される「+」マークから行います。画面左上の「+」マークも同様です。
一度種類を設定すると、その後は関連する種類への変更しかできなくなるようです。
また、サイドバーの「ブロック」タブから詳細を設定可能です。(※サイドバーが表示されない場合はヘッダー右の「設定」マークをクリックします。)
フォントサイズや文字色、画像のスタイルなど、選択中のブロックの種類に応じてメニューが表示されます。
*段落
デフォルトの種類です。シンプルにテキストを表示させたいときに使用します。
*カラム
1ブロックを縦に割り、複数のカラムに分割します。カラムごとに個別のスタイルの設定が可能です。



*グループ
複数のブロックをグループにまとめます。編集画面で一つ上のブロック末尾から下へカーソル移動するとグループであることが確認できます。
ブロック1
ブロック2
ブロック3
*リスト
番号なし、または番号付きのリストを作成します。
- リスト1
- リスト2
*テーブル
挿入してスタイルを設定すると、このような見た目の表は簡単に使えます。
サイドバー「表の設定」から「表のセル幅を固定」を設定すると行の幅が勝手に変わることを防げます。
| テーブル(デフォルトスタイル) | |
| 行2 |
| テーブル(ストライプスタイル) | |
| 行2 |
テキストのデザインについて
テキストにデザインをつけたい場合、以下のパターンがあります。
なお、ブロック自体にデザインをつけたい場合には「テキストセット」を使用できます。▼見出し&テキストセット みためサンプル参照。
パターン1
ブロックの種類「段落」を設定し、サイドバーからフォントサイズや色を変更します。
「色設定」…ブロック全体を設定。ブロック自体に背景色をつけたい場合などに使用できる。
「テキストの色」…選択したテキストのみ設定。
パターン2
ブロックの種類「見出し」を設定し、サイドバーから「クラス」を設定します。
クラスではノーサイドさんが作成した見出しスタイルを選択できます。▼見出し&テキストセット みためサンプル参照。
※ブロックの種類「見出し1」を設定した場合も、上記手順でクラス「見出し1」を選択した場合と同じ見た目になります。
個人的に、ブロックの種類「見出し」を設定するとサイドバーで作業でき後々編集しやすかったのでお勧めです。
空行の挿入について
文章の行間を開けたい場合には、ブロックの種類「スペーサー」を使います。
ただし、当サイトの場合「スペーサー1」しか選択できないため幅を調整できません。
↓ここに「スペーサー1」を入れています。このくらいの幅が固定です。
↑
1行程度の間隔を開けたい場合には、空ブロックの追加で対応可能です。(※Shift+Enterで挿入した空行は画面に表示されません)
画像の挿入について
画像を挿入するには、ブロックの種類「画像」を選択します。

画像を「左寄せ」または「右寄せ」に設定すると、横に文章を入力することができます。画像の上から横にかけて文章の回り込みはできませんが、横から下にかけては回り込みができます。
挿入した画像を選択して表示されるメニューの「A」マークから、画像上に文字を入れることも可能です。(※画像は横幅がMAXになります)

GCCデータセンター
リンクの挿入について
リンクの挿入には以下のパターンがあります。
テキスト形式で挿入
入力したテキストを選択して、表示されるメニューの「リンク」から遷移先のURLを設定します。
GCCコーポレートサイトトップページ
画像形式で挿入
画像を挿入して、表示されるメニューの「リンク」から遷移先のURLを設定します。
URL形式で挿入 / 埋め込み形式で挿入
ブロックの種類「段落」を選択して遷移先のURLを設定すると、ブロックの種類が勝手に「埋め込みURL」に変わります。
「リンクへ変換」ボタンをクリックすると、URL表示のリンクを挿入できます。
!注意点!
埋め込みURLは本来、動画や他サイトの記事などを埋め込まれた見た目で表示できるものと思われます。
ただ、現在は「埋め込み」ボタンをクリックしても「このコンテンツを埋め込めませんでした。」が表示されて上手くいきません。
おそらく設定の問題なので、必要な時にノーサイドさんに質問します。
PDFの掲載について
PDFを掲載したい場合は、以下のパターンが可能です。
パターン1
ダウンロードできるPDFを掲載したい場合は、ブロックの種類「ファイル」を選択します。
パターン2
web上でPDFを表示させたい場合は、PDFをメディアにアップロードしてから、URLをリンクとして表示させます。
https://gcc-dc.demosvn.com/uploads/2021/06/TEST.pdf
ボタンの挿入について
ボタンを挿入するにはブロックの種類「ボタン」を選択します。
サイドバーからスタイル、色、サイズなど変更できます。
・枠線設定:ボタンの角の丸みを調整できます。0は四角、50に近くなるほど丸くなります。
・幅の設定:文字に対する横幅の長さを変更します。
※枠線設定が編集画面に反映されなかったり、左揃えがプレビューに反映されなかったりします。今のところわからないので、あとで確認します。
その他
・ページごとに、ページ名のバックに表示できるアイキャッチ画像を設定できます。
ですが、ニュースについてはすでに設定されているので、記事ごとの設定などはできなそうです。
・ブロックを選択すると表示されるメニューの「ドラッグ」を使用して、ブロックの位置をマウスのドラッグで変更できます。
見出し&テキストセット みためサンプル
見出し1
見出し2
見出し3
見出し4
見出し5
見出し6
見出し7
テキストセット1
テキストセット1の見た目のサンプルです。
ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ
テキストセット2
テキストセット2の見た目のサンプルです。
これは、文章が長いと紺のブロックから右にはみ出してしまうため
一文を短くして使うのがよさそうです。↓↓
あああああいいいいいうううううえええええおおおおおかかかかかきききききくくくくくけけけけけこここここさささささしししししすすすすすせせせせせそそそそそたたたたたちちちちちつつつつつてててててととととと
テキストセット3
テキストセット3の見た目のサンプルです。これは文字数が多いと上に伸びていくため、文章量が少ないもの向けです。
