今回は、「新着情報」を「お知らせ」に変更し、お知らせの内容まで変更できるようにします。一度作ってしまえば、あとは、ブログのように更新することができます。ホームページビルダー17の最大のメリットと言える場所になりますので、力を入れて説明します。
ホームページビルダー17 WordPressサイトの編集の続きとして説明します。
今回、説明するのは、以下の部分です。
この投稿部分に特化して説明します。
目次
投稿部分の見出しを変更する
例えば「新着情報」を「お知らせ」に変えたい場合、残念ながら、直接編集してもできません。
変更できそうですが、実際に行うと出来ない。
ちなみに、背景画像は、右クリック⇒「背景画像の編集」で変更できます。余談ですが、こんな画像が貼り付けてあります。
変更するためには、「WordPress」ビューから行います。現在のページを右クリックし、「ページの変更」をクリック
「投稿記事一覧 - 新着情報」を選択し、「変更」をクリック
今回は、「新着情報」を「お知らせ」に変更しました。
※「投稿タイプ」と「表示形式」は、後ほど詳しく説明します
あとは、「OK」⇒「OK」で完成です。
【重要】投稿タイプについて
通常のブログでは、投稿場所が1か所だけです。WordPressでは、ページごとに設置することもできます。設置された投稿場所のことを投稿タイプといいます。
どのページにどの投稿タイプになっているかは、「投稿記事一覧の変更」ウィンドウの投稿タイプから判断します。この投稿タイプは、変更することも、新たに追加することもできます。投稿場所が9か所あるように見えますが、今回の例で使われているのは、「ブログ」と「ニュース」だけです。これは、ブラウザから確認できます。
また、ブラウザを使って投稿するときも、この投稿タイプから投稿場所を特定します。以下の例では、「ブログ」、「ニュース」が投稿場所になります。ニュースに投稿すると、トップページに。ブログに投稿するとブログのページ反映されます。※ブラウザの使い方は、後述
今回の例では、全部で、7ページありますが、ブログ感覚で変更できるのは、2ページだけであることがわかります。この投稿した記事は、ビルダーからの閲覧・編集ができません。そのかわり、ブラウザーを使ってブログ感覚で、変更ができます。
この部分意外は、従来のホームページ(フルテンプレートCSS)感覚でビルダーから変更できます。(ワードプレス上からも変更可)。よって頻繁に追加・更新する場所だけ、投稿タイプで作成し、他の部分は、投稿タイプ以外(固定ページ)で作ります。
尚、「コメント」は、投稿に対するコメントであって、投稿タイプではありません。
【重要】表示形式について
私が、驚いたのは、「投稿記事一覧の変更」ウィンドウの「表示形式」のところです。
投稿の表示形式を柔軟に変更できる点です。WordPressの中級者以上であれば、「要約」・「アイキャッチ画像」にときめくはずです。
表示形式は、全部で6種類ありますが、以下の2タイプをおさえておくと、実践レベルでは十分でしょう。
すべて
クリックしなくても、全情報を同じページ表示する方法
日付 + タイトル(初期値)
クリックすることで、別のページで詳細を表示する方法
日付 + アイキャッチ画像 + 要約(参考情報)
タイトルだけではなく、アイキャッチや要約を追加することにより、参照を促す方法。要約やアイキャッチ画像を別途準備するのが面倒ですが、効果は大きいです。私のホームページでは欠かせないものです。 ただ、途中から変更した場合、実用的ではないようです。別途カスタマイズが必要です。
ここでは、私のサイトを例にアイキャッチ画像と要約について説明します。ビルダーの場合、上級テクニックになりそうですね!
ビルダーでの表示について
ビルダーでの表示は、ひな形が表示されているだけであって、実際に表示されるものではありません。当然のことながら、「プレビュー」で「ニュースタイトル」クリックしても移動しません。
実際の表示ついて
ビルダー上では、確認できないため、実際の表示は、?「サイトの公開」処理をしてブラウザで確認しないといけません。まだ、「サイトの公開」をしていない状態のため、「新着情報」を「お知らせ」に変更した部分も反映していません。以下は、ブラウザから見た状態
早速、公開処理から
「かんたんナビバー」から「サイトの公開」をクリック
「公開」をクリック
するとインターネットエクスプローラーが起動します。
「hpbダッシュボード」⇒「データの反映」をクリック
更新したいページを「更新する」にして「データの反映を実行する」をクリック
「サイトを見る」をクリックし、変更されたことを確認
インターネットエクスプローラで見ると変更されていることが確認できるだけでなく、「ニュースタイトル」をクリックすることで、お知らせの内容を見ることもできます。
以下は、「ニュースタイトル」をクリックした時です。
現在は、お知らせが1件しか登録されていないため、2件ほど、追加したり現在のものを編集したりしましょう。
?ホームページをブログ感覚で更新するには!
ホームページをブログ感覚で更新するには、URL+wp-admin/で更新します。
例えば、「https://pcmanabu.com/hpb17/」のときは、https://pcmanabu.com/hpb17/wp-admin/です。
今回は、XAMPPを使ってみているため、「http://127.0.0.1/hpb1/」を編集するときは、「http://127.0.0.1/hpb1/wp-admin/」
※自分のパソコンか、同じネットワークからしか見れません。
これは、スマートフォン・タブレット・その他ブラウザでも同等です。初めてログインするときは、ログイン画面が表示されます。何回もログインするのは大変なため、通常は、「ログオン状態を保持する」にチェックを入れてログインします。
尚、私のブログでは、この「ログオン状態を保持する」にチェックが入っていることを前提とし、説明の冗長を防ぎたいと思います。
ログインすると以下のような画面になります。
記事を新規追加する
記事を追加するには、「ニュース」⇒「新規追加」をクリックします。
そして、題名・記事を入力し、「公開」をクリックします。
次のステップのため、この操作を2回ほど繰り返します。
確認をしたい場合は、「公開」ボタンの上にある「プレビュー」を押します。
尚、公開する前に確認したい場合は、先に「プレビュー」を押して下さい。公開前のプレビューは、編集者しか見ることができません。
記事を削除する
記事を削除するには、「ニュース」をクリック後、ゴミ箱をクリックします。
削除した記事を、復元または完全に削除する
プログ経験者であれば、ある程度予想がつくのではないでしょうか。
スマートフォンでの編集
実は、この編集画面自身がレスポンシブWebデザインで作られています。私のスマホ「Galaxy S3」でみるとこんな感じです。
ホームページビルダーで、スマホで編集できる!書いてありますが、ちょっとしたお知らせや画像の添付ぐらいです。
この記事自身が、WordPressで作られていますが、スマホやタブレットで少々変更するのも厳しいです。
理由は、3つあります。
- ソフトウェアキーボードを使うと、画面表示部分が著しく少なくなる
- 「ビジュアル」で表示すると、表示が非常に遅い
(この記事のように大量の文章があると) - 画像編集が苦手(私のブログは画像を多用します)
学校や、自治会などのちょっとしたお知らせ程度なら、スマホやタブレットでも十分です。
尚、ソフトウェアキーボードの問題は、ワイヤレスキーボードをつけることで解決できます。
タブレットでの編集
ARROWS Tab LTE F-01Dでみるとこんな感じ。ブラウザさえあれば、いくらでも編集できるって凄いですね!
Arrows Tab も、OSを4.0にすることで、BluetoothキーボードとBluetoothマウスを接続できます。まだの方は、ぜひお試しください。
記事を編集する
言葉通りです。記事を編集するには、[編集]をクリックすることで、簡単に変更できます。
編集画面。基本的に新規と変わりません。
[クイック編集]って知っている?
意外に使えるのが、クイック編集です。タイトル・カテゴリ・タグなどの以下の情報を、ページ移動なしで変更できるものです。変更したい場合ぜひお試しください。

マイクロソフト認定トレーナー。専業ブロガーになり1年経過(別名:ひきごもり)。ブロガーなのに誤字脱字王。滑舌が悪いのにYouTuber。『自己紹介』