WordPress|Diverの入力補助「コード」でHTMLソースを反映させる方法
WordPress(ワードプレス)のDiver(ダイバー)の入力補助の「コード」で
HTMLのソースコードを反映させたい!
今回はこのtableのhtmlコードで呼び出したい時に困った方向けの記事です!!
まず、次のような表のhtmlソースで記述する方法をWordPress(ワードプレス)の記事で伝えたいとします。
ブログの種類
日記ブログ 雑多ブログ 雑記ブログ 特化ブログ
<table style="width: 100%;">
<tbody>
<tr>
<td colspan="4" style="width: 25%; text-align: center;">ブログの種類</td>
</tr>
<tr>
<td style="width: 25%;">日記ブログ</td>
<td style="width: 25%;">雑多ブログ</td>
<td style="width: 25%;">雑記ブログ</td>
<td style="width: 25%;">特化ブログ</td>
</tr>
</tbody>
</table>

Diverの「コード」を使ってみる

テキストエディターのコードを
ビジュアルエディター「Diverのテーマ」にある「入力補助」起動!
「コード」で表示だ!!!
ブログの種類
日記ブログ 雑多ブログ 雑記ブログ 特化ブログ
あれ???
さっきと同じような表示担ってしまう。
なんだかうまく表示できない(汗)
本当はこんな感じに表示させたいのにー!!!
<table style="width: 100%;">
<tbody>
<tr>
<td colspan="4" style="width: 25%; text-align: center;">ブログの種類</td>
</tr>
<tr>
<td style="width: 25%;">日記ブログ</td>
<td style="width: 25%;">雑多ブログ</td>
<td style="width: 25%;">雑記ブログ</td>
<td style="width: 25%;">特化ブログ</td>
</tr>
</tbody>
</table>
ってかたは30秒くらいで原因と解消する方法があるので読んでいって下さい(笑)

htmlがうまく反映しない原因

うまく表示反映されない原因としては
htmlのソースコードを「Diver」の「コード」に
そのまま入力してしまうとhtmlのソースコードとして読み取って変換してしまうからです。
こういった場合はhtmlの「<」や「>」を特殊記号に変換しないといけません。

htmlのソースコードを表示させる解決方法

解決方法は
htmlの「<」や「>」を特殊記号に変換するツールを利用して変換させる必要があります。
入力したテキスト内の不等号・アンパサンド・クォーテーションを
HTMLの特殊記号に変換するツールを利用しましょう。
変換してくれるサイトはたくさんありますが
今回私が使ったサイトこちらのサイトです。
こちらのサイトは
入力された内容の「&」、「"」、「'」、「<」、「>」を次のように変換してくれます。
  • & → &amp;
  • " → &quot;
  • ' → &#39;
  • < → &lt;
  • > → &gt;

まとめ

WordPress(ワードプレス)のDiverの入力補助「コード」でHTMLソースでした。

もし、コードをWordPress(ワードプレス)の記事に入れ込みたい方で上手くいかない場合は

HTMLを特殊記号に変換するツールを利用してみて下さい。

 

 

スポンサーリンク
斉藤かずまのLINEアカウント開設しました。

LINEアカウントを開設しました。 アフィリエイトに関するお得な情報をご紹介しております。  登録いただいた方限定で、 副業・アフィリエイトに関するあなたの悩みを おひとつ無料で回答させていただきます。

LINEアカウントを開設しました。
アフィリエイトに関するお得な情報をご紹介しております。

新規ご登録いただいた方限定で、副業・アフィリエイトに関するあなたの悩みを、おひとつ無料で回答させていただきます。

副業で悩んでいる方はぜひご利用ください!

お友達登録方法

PCの方
スマホでQRコードよりアクセスしてください
LINEアカウントを開設しました。 アフィリエイトに関するお得な情報をご紹介しております。  登録いただいた方限定で、 副業・アフィリエイトに関するあなたの悩みを おひとつ無料で回答させていただきます。
SPの方
下記のボタンよりアクセスしてください

Twitterでフォローしよう

おすすめの記事