JetB株式会社

WORDPRESSブログの書き方【基本編】

更新日:2016.12.09

WORDPRESSブログの書き方【基本編】

更新日:2016.12.09

WORDPRESSブログのイメージ

 

WORDPRESSの管理画面を開いてからブログを投稿するまでの流れを紹介します。

 

ブログを書き慣れている方にとってはWORDPRESSでブログを書くのはさほど難しいことではありません。しかし、サイト制作を機にブログに挑戦しようという方は最初戸惑うこともあると思います。
ご安心ください。
今回はWORDPRESSでブログを書く方法を丁寧に説明したいと思います。

 

WORDPRESSでブログを書く手順

 

①ログイン

ログイン画面でユーザー名とパスワードを入力し、ログインボタンを押します。

 

wordpress-login

②ダッシュボード画面

ログインすると、ダッシュボードという画面が表示されます。
ダッシュボード画面にはブログの現在の状況やお知らせなどが自動的に表示されています。
新しく記事を投稿する場合は、左のメニューの「投稿」の中にある「新規追加」をクリックします。

 

WORDPRESSブログのイメージ

 

③新しい記事を書く

新規投稿画面ではタイトルと本文を入力します。
本文の入力欄は「ビジュアル」と「HTML」というタブで入力方法を切り替えることができます。(WORDPRESSのバージョンによっては「HTML」ではなく「テキスト」という名称のタブになっています)
HTMLについて知識がある人以外は「ビジュアル」のタブを選択した状態で編集することをおすすめします。
「ビジュアル」の状態の場合、入力欄の上にあるボタンを使うとワープロ感覚で入力できます。

 

WORDPRESSブログのイメージ

 

 

④ビジュアルエディタの使い方

 

改行の入れ方

ビジュアルエディタ上で文字を入力する時、改行する時にEnterを押すと、なんだか間に一行分のスペースが入ってしまうことがあります。
Enterだけで改行したときは段落が分かれてしまうことにより、行間のスペースが広くなっている状態です。
一行分のスペースが入らないように改行するには「Shift + Enter」を押しましょう。
HTML的に言えば<p>という段落を意味するHTMLタグが上と下とで分かれている状態です。
逆にShift + Enterで改行すれば<br>という改行を意味するHTMLタグが入り、普通の改行になります。

記事作成ビギナーが陥りがちな問題についてはこちらの記事で詳しく紹介しています。

 

>WordPressで記事作成をする際に初心者がおちいりがちな問題とその解決方法

 

ボタンの使い方

記事の投稿・編集画面で本文入力欄のタブ「ビジュアル」が選択されている時、以下のボタンが表示されていると思います。

 

WORDPRESSブログのイメージ

 

ボタンの機能は左から順に次の機能があります。

 

(1)太字
(2)イタリック
(3)打ち消し
(4)番号なしリスト
(5)番号つきリスト
(6)引用
(7)左揃え、中央揃え、右揃え
(8)リンクの挿入
(9)リンクの解除
(10)Moreタグ挿入
(11)フルスクリーン
(12)アドバンストツールバーの表示/非表示

 

(1)太字

太字(ボールド)になります。
<strong>というHTMLタグを追加します。このタグは強調を意味します。
「強調を意味する」というのは、ただ太字に装飾するということだけではなく、検索エンジンロボットに対して「<strong>が適用されている文言はこのページにおいて重要なキーワードですよ」と伝えることを意味します。

 

(2)イタリック
斜体になります。
<em>というHTMLタグを追加します。このタグも強調を意味します。

 

(3)打ち消し
テキストに取り消し線をつけます。
text-decoration:line-through;CSSスタイルが適用されます。

 

(4)番号なしリスト
箇条書きになります。
<ul>というHRMLタグが適用されます。

 

(5)番号つきリスト
数字の番号がついた箇条書きになります。
<ol>というHTMLタグが適用されます。

 

(6)引用
どこか別のブログの内容などを引用する時に使います。
<blockquote>というHTMLタグが適用され、インデントして表示されます。

 

(7)左揃え、中央揃え、右揃え
その名の通りです。text-align:○○○;のCSSスタイルが適用されます。

 

(8)リンクの挿入
リンクを設定できます。
テキストを選択した状態でこのボタンをクリックすると、リンクの挿入/編集ウィンドウが出てきます。
このウィンドウで、リンクURL、リンクターゲット(同じウィンドウに表示させるか別ウィンドウに表示させるか)などの情報を編集できます。

 

(9)リンク解除
設定されているリンクを解除します。

 

(10)Moreタグ挿入
<!-more->というコメントタグを挿入します。
これは一覧ページと詳細ページで本文の表示範囲を区別するためのものです。
一覧ページでは、<!-more->より上の部分だけが表示されて、最後に「続きを読む」というリンクが表示されます。詳細ページでは全部が表示されます。
ただし、これは一覧ページのテンプレートファイル内でthe_contentを使っている場合にのみ有効です。
一覧ページではthe_contentではなくthe_excerptを使っている場合は、この<!-more->を本文中に挿入しても特に意味はありません。

 

(11)フルスクリーン
このボタンを押すと入力欄が画面いっぱいに広がります。入力欄が狭く感じる場合は便利な機能です。
フルスクリーンになった状態でもう一度押すと元の大きさに戻ります。

 

(12)アドバンストツールバーの表示/非表示
このボタンを押すともう一段新たなボタンが出てきます。
もう一度押すと非表示に戻せます。

 

WORDPRESSブログのイメージ

 

アドバンストルールバーを表示させて出現した2段目のボタンの機能は左から順に次のとおりです。

 

【1】フォーマットの選択
【2】下線
【3】均等割付
【4】文字色
【5】テキストとして貼り付け
【6】Wordから貼り付け
【7】フォーマット解除
【8】特殊文字
【9】インデント解除、インデント
【10】取り消し、やり直し
【11】ヘルプ

 

【1】フォーマットの選択
フォーマットはデフォルトでは<p>タグが適用されますが、ここでフォーマットを選択すると<h1>タグ等を任意に適用させることができます。
タグの設定方法についてはこちらの記事で紹介しております。

 

>SEO対策に必須!hタグ最適化の基礎知識と効果的な設定方法

 

【2】下線
テキストに下線をつけることができます。
ただ、テキストに下線をつけるとリンクだと誤解されてしまう可能性があるため、慎重に使用することをおすすめします。

 

【3】均等割付
文章の両端揃えのことです。text-align: justify;というCSSスタイルを文章に適用しますが、ブラウザによってきちんとならないことも多く、現状ではあてにならないので、Webページではあまりおすすめできません。

 

【4】文字色
プルダウンから文字色を選択して適用させることができます。

 

【5】テキストとして貼り付け
テキストを挿入する場合に使える機能です。

 

【6】Wordから貼り付け
Word上の文章をコピーして貼り付ける場合に便利な機能です。

 

【7】フォーマット解除
上で説明したフォーマットを解除する時に使います。

 

【8】特殊文字
特殊文字を挿入できます。

 

【9】インデント解除、インデント
選択した段落にインデントの適用・解除を行います。
CSSスタイルでpadding-left: 30px;が適用されます。

 

【10】取り消し、やり直し
Wordと同じです。
キーボード操作では取り消しはctrl+Z、やり直しはctrl+Yでも可能です。

 

【11】ヘルプ
解説画面が出てきます。

 

⑤投稿に画像を挿入する

画像を挿入する位置にキャレットを合わせて、【メディアを追加】ボタンを押します。

 

WORDPRESSブログのイメージ

 

「メディアを挿入」というウィンドウが表示されます。新しい画像をアップして使用する場合は【ファイルをアップロード】をクリックし、【ファイルを選択】ボタンからアップする画像ファイルを選択します。

画像ファイルをアップすると、アップ済の画像一覧の中にアップした画像ファイルが選択された状態で表示されています。
画面右の「添付ファイルの詳細」に必要情報を入力します。特に必要な場合を除いては「タイトル」だけ入力しておけば大丈夫です。
その下の「添付ファイルの表示設定」で配置、リンク先、サイズを選択してから、一番下の【投稿に挿入】ボタンを押します。
追加プラグインなどを使い画像を拡大表示させる時は「リンク先」の欄は「メディアファイル」を選択します。

 

WORDPRESSブログのイメージ

 

投稿記事ごとにサムネイルをつけたい場合はアイキャッチ画像を設定して下さい。

 

⑥アイキャッチ画像を設定する

画面右下にある「アイキャッチ画像を設定」をクリックして投稿記事ごとに表示するサムネイル画像を設定します。
やり方は画像を挿入する時と同じです。

 

WORDPRESSブログのイメージ

 

記事を投稿後、サイトを表示すると最新記事一覧にアイキャッチ画像が表示されているのが確認できると思います。

 

WORDPRESSブログのイメージ

 

画像アップロードの際に起こりがちなトラブルの解決方法についてはこちらの記事で紹介しています。

 

>WordPressの画像アップロードに関するよくある質問と解決策をご紹介します!

 

⑦記事を公開する

投稿画面の右側に「公開」というボックスがあると思います。
この中にある【公開】ボタンを押すと記事が公開されます。公開する前にかならず任意のカテゴリをチェックして公開して下さい。チェックをしないとホームページに反映されません。
自分のブログを見て、きちんと公開されているかどうか確認してみましょう。

 

WORDPRESSブログのイメージ

 

⑧公開済みの記事を編集する。

左のメニューから「投稿一覧」をクリックすると、記事一覧が表示されます。
この中から該当の記事の「編集」をクリックして記事を開きます。

 

WORDPRESSブログのイメージ

 

⑨記事を削除する

左のメニューから「投稿一覧」をクリックすると、記事一覧が表示されます。
この中から削除したい記事の「ゴミ箱」をクリックします。
ゴミ箱へ移動した記事はゴミ箱の中から「復元」するでもとに戻せます。
ゴミ箱の中で完全に削除を選んだ場合は復元できなくなります。

 

WORDPRESSブログのイメージ

 

ブログ発信はやりながら覚えていくのが近道

 

WORDPRESSブログのイメージ

 

今回はWORDPRESSでのブログの書き方を紹介しました。
一度に全て覚えるのは難しいかもしれません。困った時はこの記事を見返していただければ幸いです。
また、実際に書いているうちに分かることもあると思います。「下書き」として途中まで保存することも出来ますし、いったん公開してからも編集可能ですので、恐れず始めてみることをおすすめします。