投稿 | アフィリエイト実践術~うつ病・リストラからの生還

ワードプレスの投稿方法

こんにちは。 瀬尾剛です。

 
 
今回はいよいよワードプレスの投稿方法
の説明をします。

中でも、改行の入れ方とスペースの挿入
方法にフォーカスして説明していきます。

 
 
まず、ワードプレスにログインしてください。
toko1
「ダッシュボード」→「投稿」→「新規追加」を
選択してください。

 
 

新規投稿を開く

「新規投稿を追加」という画面が表示されます。
toko1-2
赤枠のテキストタブをクリックしてください。

投稿するには
(1)ビジュアルタブで投稿する方法
 →「ビジュアルエディタ」を使います。
(2)テキストタブで投稿する方法
 →「テキストエディタ」を使います。
の2種類があります。

「ビジュアルエディタ」と「テキストエディタ」
の違いを簡単に説明します。

「ビジュアルエディタ」はブラウザで表示される
状態で編集するエディターです。
エディター上部でテキストのフォントや色などの
変更ができます。しかし、テキストエディタほど
自由度はありません。
また、テキストエディタで編集した内容を壊して
しまう不具合があり、お勧めしません。

 
「テキストエディタ」はHTML表記が行えます。
HTMLとは、ブログを書くための言語です。
ビジュアルエディタに比べて自由度が高い反面
HTMLの知識が必要となります。
ただし、使う範囲は限られていますので、少し
頑張って勉強して、慣れてしまえば、それほど、
苦もありませんので、お勧めです。

 
 
 

記事の記入

まずは、タイトルを記入します。
次にテキストタブをクリックしてください。
toko2

テキストエディタでは、2つ以上連続する
改行のみの行が1行になってしまいます。

また、先頭にスペースを書いても削除
されてしまいます。

 
これらの現象を確かめてみましょう。

 
試しに2つ以上連続する改行のみの行を
作ってみてください。

また、先頭が全角スペースで始まる文章を
書いてみてください。

次にビジュアルタブを選択してみてください。
toko3

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

toko4
テキストエディタで書いた
2つの連続する改行のみの行が
1つになってしまっています。

また、先頭に書いた全角スペースも
消えてなくなっています。

 
これら2つの問題を解決する方法が以下の画面です。
toko7

まず、改行問題対策です。
上図の赤枠を確認してください。

2行改行を入れたい場合、
改行のみの1つの行に
  
だけの行を書だけです。(全部半角で書いてください)

 
次に、先頭のスペースが
消えてしまう問題対策です。
上図の青枠を確認してください。

<span style=”letter-spacing: 1em;”>□</span>

を先頭に書くと先頭に2文字分の
全角スペースが挿入されます。

ここで、”□”は、全角スペースを意味します。
実際には、全角スペースを書いてください。

因みに、全角スペース数を変えたい
場合は以下のようにします。

1文字:<span style=”letter-spacing: 0em;”>□</span>
2文字:<span style=”letter-spacing: 1em;”>□</span>
3文字:<span style=”letter-spacing: 2em;”>□</span>
 
 

 
期待通り対策できたかどうか確認するには、
以下の図の「変更をプレビュー」をクリック
してください。
toko8

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

toko9

 
 
 

改行対策とスペース対策の詳細

ここでは、どういった仕組みで、
改行問題とスペース問題が対策
されたのかを説明します。

細かい話なので、飛ばしてもらっても
かまいません。

次の章に飛ぶには、こちらをクリック
してください。

————対策の詳細————

●ビジュアルエディタでは先頭列にスペースを
書くことができません。書いても消えます。
→ビジュアルエディタは不安定。

●テキストエディタで
「改行」+「改行」+「 」
を書いてセーブした後にビジュアルエディタに
切り替えて、テキストエディタに戻すと、
「改行」+「 」が削除されます。
→ビジュアルエディタは不安定。

●先頭列にスペースを書きたい場合、
テキストエディタを使う必要があります。

●ワードプレスが生成するHTMLの<p>タグ
今回使用しているXサーバでインストールした
ワードプレス3.8ではテキストエディタにおいて
デフォルトで連続しない1つの改行は、HTMLの
改行コード</ br>に変換されます。

●テキストエディタ中に書き込む文章は
先頭から2つ以上連続する改行コードで
区切られた段落に分解されます。

●段落はHTMLでは<p>タグで表記されます。

●2つ以上連続した改行コードは
削除されて段落つまり<p>タグが列挙されます。

●<p>タグは「<p>文章</p>」と表されます。
複数の<p>タグがHTMLに記述される、
つまり、以下のようにHTMLが書かれた場合、
<p>文章1</p>
<p>文章2</p>
<p>文章3</p>
 

ブラウザーには

文章1
文章2
文章3
 

と表示されます。

以上をまとめると以下のことが言えます。

(1)ワードプレスのテキストエディタに
 連続した改行コードは削除される。

(2)ワードプレスのテキストエディタで
 書かれた文字は<p>タグで囲まれる。

(3)ブラウザー上に2行以上改行を
 入れた文章を書きたい場合、半角スペース
 を表す「 」だけの行を書くことで
 「半角スペース」+「</ br>」
 が<p>タグに挿入されて見かけ上、
 複数の改行をブラウザーに表示できる。
 (正確には複数の半角スペース+改行)

●<span style=”letter-spacing: Aem;”>□</span>の意味
注1)”□”は全角スペースを意味します。
注2)Aは実数を意味します。

<p>タグの中における(つまり、ワードプレスの投稿記述内の)
<span style=”letter-spacing: Aem;”>の”A”の数値により
ブラウザ上には、以下のような文字が表示されます。
 {指定されたフォントの大きさの文字}+
 {指定されたフォントxA}の大きさの空白
が表示されます。

つまり、テキストエディタに
「<span style=”letter-spacing: Aem;”>□</span>」
と書くとまず、指定されたフォントの大きさで”□”が
印字され、それに続いて、指定されたフォントのA倍
の大きさのスペースが空きます。

仮にA=1の場合の間に<span>タグでしていした”□”と
それと同じ大きさ(1倍された)”□”が表示されること
になります。すなわち
 “□□”
が表示されるわけになります。

<span style=”letter-spacing: Aem;”>□</span>の
“□”の部分に半角スペースを書くと<span>タグが削除
されます。

<span style=”letter-spacing: Aem;”>□</span>
以外にもインデントさせる表記法もありますが、
今回は説明を割愛させていただきます。

 
 
 

カテゴリーの追加と設定

投稿画面を下にスクロールしていくと、
以下の「新規カテゴリーを追加」という
リンクがあります。
toko10
新規でカテゴリーを追加したい場合、
このリンクをクリックします。

すると以下のような画面が表示されます。
toko11
ここで、新規カテゴリー名を記入して
「新規カテゴリーを追加」をクリック。

toko12
元々チェックされている「未分類」の
チェックを外し、追加したカテゴリーに
チェックを入れます。

既に、カテゴリーが存在する場合も同様に
「未分類」のチェックを外し、チェック
したいカテゴリーをチェックします。

 
 
 

All in One SEO Packプラグイン設定

ここでは、All in One SEO Pack
プラグインを導入します。
既にインストールされていたら、
設定のみを行ってください。

プラグインとは、追加機能の
オプションのようなものです。

All in One SEO Pack
プラグインとはSEO効果を
高めるためのプラグインです。

SEOとは、自分のブログを
検索エンジンに上位表示
させる工夫をすることです。

インストールするには以下のように
toko13
「ダッシュボード」→
「プラグイン」→「新規追加」
をクリックします。

下記のような画面が表示されます。
toko14
検索窓に「All in One SEO Pack」と
記入し、「プラグインの検索」を
クリックしてください。

下記のような画面が表示されます。
toko15
「いますぐインストール」を
クリックしてください。

下記のような画面が表示されます。
toko16
「プラグインを有効化」を
クリックしてください。

下記のような画面が表示されれば
インストールは成功です。
toko17

 
先ほど書いた記事の投稿編集画面に戻ります。
toko18
「ダッシュボード」→
「投稿」→「投稿一覧」を選択。

下記画面から、先ほど書いた記事
タイトル名をクリックします。
toko19

 
投稿編集画面を下にスクロールすると、
以下のような画面が表示されます。
toko20
Titleには、記事タイトルをコピー。
Descriptionには、記事内容の概要説明。
Keywordsには、検索エンジンが見つけて
くれそうな記事内容で書いたキーワードを
半角カンマ区切りで記入します。

それが済んだらKeywordsに書いた記述を
カンマも含め全部コピーして、タグ窓に
貼り付けて、「追加」をクリックします。

 
 
 

記事のコンパクト化

記事がたくさん増えてくると、
トップ画面等に配置された
個々の記事が並ぶページが
長いと訪問者は見る気が失せます。

そこで、各記事をコンパクトに
します。といっても記事の冒頭を
表示させて、とは訪問者が閲覧
したい記事だけリンクから表示
させる機能です。

隠したい記事の上にカーソルを
合わせます。
toko21
赤資格で囲んだ[more]をクリックします。
そして、最後にセーブするだけ。

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

toko22

カーソルを合わせた位置に
<!–more–>
が表示されていれば成功です。
あとは保存すれば完了です。

↓↓↓↓↓ブラウザー表示を確認してみましょう↓↓↓↓↓↓↓

toko23
「続きを読む→」をクリック

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

toko24

これで、この記事は、全体表示がされました。

 
 
おしまい。
 
 

アフィリエイト実践術~うつ病・リストラからの生還 TOP » 投稿