WordPressの投稿ページは
・テキストエディター
・ビジュアルエディター
に分かれています。
できるならば、テキストエディターで編集したほうが良いです。
しかし初心者にはその使い方が難しいので、その使い方について説明していきます。
こちらの動画が短く、簡単にテキストエディターについて説明されているので見てください。
基本的によく使うコードは、アドクイックタグというプラグインでボタンで表示しています。
Contents
見出しの付け方
第何章という「章」にあたるのが
↓
大見出し
です。
その章の中に、更に細分化されたものが
↓
中見出し
↓
小見出し
となるわけです。
記事内で使用するのはh2タグからです。
そのように考えると見出しの使い方がイメージできると思います。
大見出しのコードはこちらです。
開始タグ
|
1 |
<h2> |
終了タグ
|
1 |
</h2> |
こちらが
中見出しタグボタンコードです。
開始タグ
|
1 |
<h3> |
終了タグ
|
1 |
</h3> |
こちが
小見出しタグボタンコードです。
開始タグ
|
1 |
<h4> |
終了タグ
|
1 |
</h4> |
年齢計算
人物のプロフィール記事を書くときに、自動で年齢計算してくれる機能です。
[birth day=”■”]歳■の部分に表示させたい人物の生年月日を半角数字で入力します。
例：1990年1月1日生まれ⇒19900101
[birth day=”19900101″]歳引用
公式や他サイトから文章を引用する場合こちらを使ってください。
引用はこちら
|
1 |
<blockquote>引用はこちら</blockquote> |
目次に戻る
文章が長くなってしまったときに、途中に入れたいものです。
|
1 |
<a href="#toc_container">▲ 目次に戻る</a> |
枠線
ポイントなど囲っておきたい部分にはこちらが便利です。
|
1 2 3 |
<div style="padding:1em 3%;border:1px solid #333333;"> 実線で囲む </div> |
|
1 2 3 |
<div style="padding:10px;border: 1px dotted #333333;"> 点線で囲む </div> |
|
1 2 3 |
<div style="border: 5px dashed #333333; padding: 10px; border-radius: 10px;"> 大きな点線で囲む </div> |
枠線の色は変えられます
最初の「＃」の後ろが色のコードです。
色のコードは以下を参考にしてくださいね。
原色大辞典(https://www.colordic.org/)
改行
文章の間や画像の下など、間隔を空けておきたい場所には意識的に改行しておきましょう！
ノンブレークスペースと呼ぶコードです。
|
1 |
|
太字
強調するときの太字は「b」ボタンです。
太字
|
1 |
<strong>太字</strong> |
文字色変化
色変化させたい部分を選択して、ボタンを押せば変わります。
赤色
|
1 |
<font color=red>赤色</font> |
色の名前の部分に変えたい色を英語で入れて、テキスト部分が文字色を変えたい文章が来ます。
・赤色⇒red
・青色⇒bule
など。
リンク
リンクは飛ぶ先によって、使うタグを分けてください。
【外部リンク】
公式など自分のサイト以外
キャサリンときめきLife
キャサリンときめきLife
|
1 |
<a href="”■■■リンク先のURL”" target="”_blank”" rel="”nofollow” noopener noreferrer">■アンカーテキスト</a> |
【内部リンク】
自分のサイト内へのリンク
キャサリンときめきLife
キャサリンときめきLife
|
1 |
<a href="”■■■リンク先のURL”" target="”_blank”" rel="noopener noreferrer">■アンカーテキスト</a> |
箇条書き(リスト)
黒丸タイプに箇条書きはこちらです。
- あいうえお
- かきくけこ
- さしすせそ
|
1 2 3 4 5 |
<ul> <li>あいうえお</li> <li>かきくけこ</li> <li>さしすせそ</li> </ul> |
数字タイプの箇条書きはこちらです。
- あいうえお
- かきくけこ
- さしすせそ
|
1 2 3 4 5 |
<ol> <li>あいうえお</li> <li>かきくけこ</li> <li>さしすせそ</li> </ol> |
チェックタイプの箇条書きはこちらです。
|
1 2 3 4 5 6 |
<ul class="check-list"> <ul> <li>あいうえお</li> <li>かきくけこ</li> <li>さしすせそ</li> </ul> |
画像の入れ方
テキストエディターの上のボタンに並んでいる「メディアを追加」をクリックします。
ここから自分のほしい画像を選びます。
「代替えテキスト」にはその写真について、説明するような言葉を書いておいてください。
下へスクロールすると、サイズ選択ができます。
サイズは基本的に「フル」にしましょう。
最後まで読んで頂いてありがとうございました。
記事が少しでもお役にたるものだと思われたら、
下のボタンからシェアをして頂けると嬉しいです。
ブログの始め方・稼ぎ方をまとめた7日間無料の「副業ブログ講座」を開設中です。
↓↓↓メルマガ登録は下のフォームから↓↓↓
