次は、記事にHTMLコードを使って見出しを入れる方法をします。

記事にHTMLコードを使って見出しを入れる方法

ワードプレスの管理画面を開きます。

左上の「投稿」を押します。

左上の「新規追加」を押します。

左上の「タイトルを追加」「記事にHTMLコードを使って見出しを入れる方法」と入力します。

右側の「テキスト」を押します。

テキストのところに、HTMLコードを貼り付けます。

テキストのところに、下記コードをコピーして貼り付けます。

<h1>記事のタイトル</h1>
<h2>記事の見出し2</h2>
<h3>記事の見出し3</h3>
<h4>記事の見出し4</h4>
<h5>記事の見出し5</h5>
<h6>記事の見出し6</h6>

貼り付けました。

右側の「公開」を押します。

「OK」を押します。

右上の「変更をプレビュー」を押します。

「見出し」がそれぞれ違う形で表示されていることを確認します。

↑じょうまさふみに学習状況を報告すると喜びます(^^)/

HTMLコードの説明

今回、見出しに使ったhタグの説明をします。

見出しタグは、「h1,h2,h3,h4,h5,h6」の6種類あります。

「h1」は、記事のタイトルに使います。
「h2~h6」は、記事の見出しに使います。

h1~h6タグ記入例

HTML

<h1>記事のタイトル</h1>
<h2>記事の見出し2</h2>
<h3>記事の見出し3</h3>
<h4>記事の見出し4</h4>
<h5>記事の見出し5</h5>
<h6>記事の見出し6</h6>

記事をプレビュー表示したとき

記事のタイトル

記事の見出し2
記事の見出し3
記事の見出し4
記事の見出し5
記事の見出し6
講座1の関連記事
  • アイコンを光らせるHTMLとCSSを使ってする方法
  • ボタンの色を変えるCSSコードを追加する方法
  • アイコンの色を変えるCSSコードを追加する方法
  • 記事にアイキャッチ画像を設定する方法2
  • Brainを使ってお金を稼ぐ方法(紹介記事の書き方)
  • ブログタイトル名と説明文の変更2
おすすめの記事
講座2
アイキャッチ画像を一括設定する方法を説明します。 アイキャッチ画像を一括設定 動画 アイキャッチ画像を一括設定 ワードプレスの管理画面を開き...
講座1
次は、カルーセル設定をします。 カルーセルとは? カルーセルとは、記事の画像と記事タイトルが横にスライドする、スライドショーみたいなものです...
講座2
勉強しながらお金を稼ぐ方法 動画 動画の目次 00:20 お金を稼ぐ仕組み 03:30 Brainの紹介リンク取得 05:25 ツイッターに...
講座1
作業目安時間5分 次は、ワードプレスのテンプレートを変更します。 ワードプレスのテンプレート変更 作業手順 下記サイトより、下側の「Sorc...