顧客との信頼関係強化やファン化が期待できるため、企業にとって大きなメリットがあるブログですが「構築するのが難しそう」というイメージを抱いている方も多いはずです。しかしSTUDIOではCMS機能があるため、Webサイト制作の知識がなくてもドラッグ&ドロップで簡単にブログ運営を始めることができます。そこで本記事では、STUDIOにおけるブログの構築手順を画像付きで丁寧に解説します。CMS機能を使った、ブログページ作成の8STEPブログ記事を作成して公開する前に、ブログページ(ブログの土台)を作成する必要があります。そこで本章ではSTUDIOのCMS機能を使ったブログページ作成手順を画像付きで解説します。なおすでにブログページが完成している場合は、別記事の「STUDIOのCMS機能における記事作成・公開手順」をご確認ください。STEP1.STUDIOのアカウントを登録するSTUIDOでブログを作成するためには、まずアカウントを登録する必要があります。アカウント登録の手順は以下の通りです。1.STUDIOのアカウント登録ページにアクセスする2.遷移先のページで「Googleアカウント」「Facebookアカウント」「メールアドレス」の3つから好みの登録方法を選び、必要情報を入力する3.以下の画像のようにプロジェクト一覧ページに遷移すれば、登録完了STEP2.ブログページの土台を作成する1.「新しいプロジェクト」をクリックする2.好みのデザインテンプレートを選択し、「このテンプレートではじめる」をクリックする。(今回は左から2番目のテンプレートを選択)その後、遷移先のページで好みのプロジェクト名を決める。一からブログページのデザインを作成したい場合は、画面左側の「空白からはじめる」を選択してください。STEP3.パーツを追加する1.画像や文字を新たに追加する場合は、以下画像の赤枠(画面左側)の「>」マークをクリックする2.その後上タブの「+追加」を選択した後、左カラムから追加したいパーツをクリックする3.追加したいパーツを画面中央ブログページ上の好みの場所に、ドラッグ&ドロップで配置するSTEP4.各パーツを編集する画面中央のブログページをクリックすると、以下画像の赤枠のように上タブにスタイルバーが表示されます。このスタイルバーでは、文字フォントの変更や配置の変更などができます。STEP5.タブレット・モバイル版のブログページデザインを確認する以下画像の赤枠(画面中央のブログページの外側)をクリックすると、上記のタブにレスポンシブバーが表示されます。レスポンシブバーとは、タブレットやスマートフォンでブログページを閲覧した際のデザインが表示できるツールです。レスポンシブバーに「基準」「タブレット」「モバイル」の項目があるため、確認したいデバイスを選択しましょう(「基準」はPCサイズ)。STEP6.他のページを追加・編集する1.以下画像の赤枠(画面左下)のページマークをクリックする2.上タブの追加マークをクリックし遷移先のページにて、通常ページやパスワードページなど好みのページを選択するなおテンプレートページを追加したい場合は、以下画像の赤枠(上タブの下にあるメニュー)をクリックします。STEP7.実際のデザインをサイト上で確認する1.画面右上の「ライブプレビュー」を選択する2.遷移先のページで「スタート」をクリックする3.遷移先のページに表示されたURLをクリックすると、別タブでデザインが表示されるSTEP8.完成したブログページを公開する1.以下画像の赤枠(画面右上)の「公開」をクリックする2.好みのURL名を入力し「保存」を選択した後「公開」をクリックするCMS機能を使った、記事作成・公開までの手順前章ではブログページ(ブログの土台)の作成方法を紹介しましたが、記事を作成して公開しなければ、ブログとしての役割を果たしません。そこで本章ではSTUDIOのCMS機能における、記事作成・公開手順を画像付きで丁寧に解説します。STEP1.記事の土台を作成する1.以下画像の赤枠(ブログページの編集画面左上のプロジェクト名)にカーソルを合わせる2.カーソルを合わた後、表示されるメニューから「CMS」を選択する3.遷移先ページで画面左上のモデルから投稿したい記事の種類を選んだ上で、右上にある「+新規追加」をクリックするSTEP2.記事を作成する1.画像や見出しなどを追加する記事の編集画面に表示されている「+」をクリックした後現れるメニューで、追加したいパーツを選択します。このメニューでは見出しや画像、区切り線などを追加できます。なお記事にはタイトル、見出し、本文の3つの文型があります。タイトルは記事全体におけるタイトルで、本記事でいえば『STUDIOの「CMS」の始め方。CMS機能を使ったブログページ作成手順を画像付きで紹介』を指します。STUDIOのデザインエディタ上では以下画像の赤枠部分がタイトルです。対して見出しは章やトピックごとのタイトルのことを指します。本章においては「STUDIOのCMS機能における記事作成・公開手順」や「記事を作成する」の部分を指します。見出しは上述したように記事の編集画面に表示されている「+」をクリックした後、表示されるメニューから設定できます。本文はその名の通り記事内の本文のことを指し、この文章も本文と呼ばれる部分です。見出しにマウスを合わせて、エンターキーを押すと後段落から本文を記入できます。2.実際の記事デザインを確認する画面右上の「ライブプレビュー」を選択すると、ユーザーに表示される状態での記事デザインを把握できます。3.プロパティを編集するプロパティとは記事作成者やタグ(記事を分類する付箋のようなもの)などを編集できるボックスのことを指します。以下画像の赤枠(記事編集画面の右側)に設置されています。なおプロパティでは主に4つの情報を編集できます。それぞれのアイテムに関する説明は以下の通りです。Slug記事URLCover通常記事上部に表示される画像Author記事作成者Tags記事を分類する付箋のようなものSTEP3.記事を公開する記事を公開したい場合は、画面右上の「下書き」を選択した後、表示されるタブで「公開する」に設定します。なお予約公開をしたい場合は画面右上の「公開日時」を任意の日時に設定した後に「下書き」を「公開を予約する」に変更します。まとめ上述したようにSTUDIOではWebサイト制作の知識がなくても、気軽にブログページを作成できます。企業の情報発信が当たり前になっている昨今、WordPressなどのCMSを使ってブログ運営をスタートする企業も多いですが、より気軽に安価で始められるSTUDIOでのブログ運営もぜひご検討いただきたいです。関連記事:製造業の経営者が「うちもブログを始めたらどうだろう?」と思ったら