【第1回】ホームページの投稿を更新してみよう【画像を使って丁寧に解説！】
小林 亮司こんにちは！
ウェブコミットの小林(@web.commit)です。
今回は「ホームページの投稿の更新方法」について、実際の操作方法を画像を使って丁寧に解説していきます。
休業に関する案内や、新商品の告知、最近だとコロナ禍での営業時間の案内など、お店や会社からお客様に対して情報発信する機会は多いと思います。
これからお伝えする「ホームページの投稿の更新方法」をマスターしていただければ、事業者様ご自身の手でとっても簡単に情報発信ができるので、ぜひ最後までご覧ください。
この記事は、当店でホームページを制作させて頂いたお客様向けのホームページ操作マニュアルです。
当店で制作をしていないウェブサイトについては、ご利用の環境によって記事の内容とは異なります。
投稿を更新するまでの７ステップ
- 管理画面にログイン
- 投稿の新規作成
- プレビュー確認
- パーマリンク設定
- カテゴリー選択
- アイキャッチ画像挿入(省略可)
- 公開
ホームページの投稿を更新する方法は上記の７ステップです。
「パーマリンク」や「アイキャッチ画像」など、聞き慣れない言葉も出てきますが、画像を使って丁寧に解説していきますのでご安心ください^^
今回は「お店や会社の夏季休業のお知らせ」をする場面を想定して、お知らせの投稿方法を解説します。
こんなお知らせを投稿してみましょう！
平素は格別のお引き立てをいただき厚くお礼申し上げます。
弊社では、誠に勝手ながら下記日程を夏季休業とさせていただきます。
■夏季休業期間
2022年8月10日(水) ～ 8月14日(日)
休業期間中にいただいたお問合せについては、営業開始日以降に順次回答させていただきます。
皆様には大変ご不便をおかけいたしますが、何卒ご理解の程お願い申し上げます。
ウェブコミット
代表 小林亮司
【ステップ１】管理画面にログイン
まずは、管理画面にログインします。
管理画面ログインページのURLはサイトによって異なるので、皆さまご自身のログインページURLにアクセスしてください。
管理画面ログインページでは、皆さまそれぞれの「①ユーザ名」「②パスワード」を入力します。
最後にロボットによる不正ログイン対策のため「③ひらがな」を入力して、「④ログイン」をクリックします。
管理画面にログインができたら、トップページはこのような表示になっていると思います。
これで【ステップ１】管理画面にログインの手順は終了です。
【ステップ２】投稿の新規追加
続いて、投稿の新規追加を行います。
まずは画面左のメニューの中の「投稿」にマウスカーソルを合わせて「新規追加」をクリックします。
「新規追加」をクリックすると、このような画面が表示されます。
この画面では、投稿の新規作成や編集ができます。それでは早速、投稿のタイトルと本文を入力していきましょう。
「タイトルを追加」の枠を選択して、投稿のタイトルを入力します。
今回の投稿は「夏季休業のお知らせ」と入力しますね。
続いて投稿の本文を入力します。
投稿の本文は、タイトルの下の枠に入力します。
ワンポイントアドバイス
投稿の本文には「行の間隔が狭い改行」と「行の間隔が広い改行」がありますね。
行の間隔が狭い改行は「shift + enter」
行の間隔が広い改行は「enter」で表現ができます。
例.)
行の間隔が狭い改行
行の間隔が狭い改行
行の間隔が広い改行
行の間隔が広い改行
そして今回の投稿では、本文の最後に「事業者名と代表名」を記載します。
投稿の本文は左揃えですが、「事業者名と代表名」は、右に表示した方が見栄えが良いですよね。
ここから文字の右揃えの方法を解説していきます。
文字を右揃えしたい文字ブロックを選択(クリック)すると、ブロックのメニューが出てきます。
ブロックのメニューから「3本線のアイコン」を選択して、「テキスト右寄せ」をクリックします。
これで、選択した文字を画面の右に寄せることができました。
この辺りの操作方法はエクセルやワードと似ているので、一度方法を知ってしまえば簡単だと思います◎
投稿のタイトルと本文が入力できたので、【ステップ２】投稿の新規追加の手順は終了です。
【ステップ３】プレビュー確認
続いてプレビューを確認します。
プレビューとは、【ステップ２】で入力した投稿が、実際のホームページ上でどのように表示されるのかを確認することです。
まずは、画面右上の方にある「プレビュー」を選択します。
続いて「新しいタブでプレビュー」を選択してください。
すると、新しいタブが立ち上がり、実際のホームページでどのように表示されるのかが確認できる、プレビュー画面が確認できます。
プレビューに問題が無ければ、【ステップ３】プレビュー確認の手順は終了です。
【ステップ４】パーマリンク設定
続いて「パーマリンク設定」を行います。
パーマリンクと聞くとあまりピンとこないかもしれませんが、簡単に言うとURLの設定です。
パーマリンクの設定は「投稿」タブを選択して出てくる「パーマリンク」から行います。
初期状態だと「タイトル」に入力した文字が反映されていますが、パーマリンクを日本語にすることはウェブの世界ではNGとされているので、変更しましょう。
パーマリンクを設定する際は、以下の3点を意識してみてください。
- 必ず英語(アルファベット)表記にする。
- 単語を「-（ハイフン）」で繋げる
- できるだけ短く簡潔に
これらのルールを意識して、今回の場合は「夏季休業のお知らせ」なので、パーマリンクは「summer-holidays」に設定します。
ワンポイントアドバイス
パーマリンクの設定例
・「来月から新商品を販売します！」という投稿をする場合
良い例（簡潔な英語表記で単語を「-」で繋げている）
「new-product」
悪い例（単語を「-」で繋げていない, 長い）
「newproduct」
「we-will-sell-new-products-from-next-month」
パーマリンクを正しく設定できたら、【ステップ４】パーマリンク設定の手順は終了です。
【ステップ５】カテゴリー選択
次のステップは、カテゴリー選択です。
カテゴリーが複数ある場合は、投稿の内容に合ったカテゴリーを選択しましょう。
今回は、夏季休業のお知らせですので「お知らせ」にチェックを入れてカテゴリー設定を行います。
正しくカテゴリー設定ができたら、【ステップ５】カテゴリー設定の手順は終了です。
【ステップ６】アイキャッチ画像挿入(省略可)
続いて「アイキャッチ画像」を挿入します。
こちらは投稿に好きな画像を設定できる機能ですが、今回の「夏季休業のお知らせ」のような投稿の場合は、特に画像を設定しなくても問題ありません。
→ アイキャッチ画像を省略する場合は、次の【ステップ７】まで読み飛ばしてください。
アイキャッチ画像の挿入も画面右側のメニューから行います。
「アイキャッチ画像」の「アイキャッチ画像を設定」をクリックします。
すると、このような画面が表示されるので、枠内にファイルをドラッグ&ドロップするか、「ファイルを選択」をクリックします。
ファイルの一覧が立ち上がるので、アイキャッチ画像に設定したい画像ファイルを選択して「開く」をクリックすれば、【ステップ６】アイキャッチ画像挿入は完了です。
【ステップ７】公開
いよいよ最後のステップ、記事の公開です。
まずは、画面右上の「公開」ボタンをクリックします。
確認画面が表示されるので、もう一度「公開」ボタンをクリックします。
このように「(記事のタイトル)を公開しました。」が表示されれば、投稿更新が完了です！
投稿の更新が完了したら、念の為ご自身のホームページから、先ほど投稿した記事がきちんと表示されているか、誤字脱字がないかもう一度確認しておきましょう。
特に問題が無ければ、投稿作業はこれで終了となります◎
まとめ
今回は、ホームページの投稿を更新する方法を７ステップで解説しました。
７ステップの内容は以下の７つでしたね。
- 管理画面にログイン
- 投稿の新規作成
- プレビュー確認
- パーマリンク設定
- カテゴリー選択
- アイキャッチ画像挿入(省略可)
- 公開
初めての投稿は操作に慣れないこともあると思いますが、投稿に慣れてしまえばとっても簡単です。
また、久しぶりに投稿する場合も手順を忘れてしまうことがあるので、是非このページをお気に入りに追加していつでも確認できるようにしてみてください。
ウェブコミットで制作させて頂いたホームページは、回数無制限でご質問の対応をさせて頂いております。
「ホームページの操作方法が分からない」
「どんなコンテンツを発信すれば集客に結びつくのか聞きたい」
「PCを入れ替えたいけど、どれを選べばいいか分からない」など
気になることはいつでもご相談ください。
それでは、今回の投稿は以上となります。
最後まで読んでいただきありがとうございました！
