WordPressウィジェットにカスタムHTMLでhtmlタグを入れる方法

WordPressのウィジェット(サイドバー)を自分好みにカスタマイズしたいときがありますよね。そんな時はhtmlタグを入力します。

これまでは、「テキスト」ウィジェットを用いて入力していたのですが、新しく「カスタムHTML」ウィジェットが登場したのでそちらで入力したほうが良い理由と方法をご紹介します。

 

カスタムHTMLで入力をおすすめする理由

これまで入力していた「テキスト」ウィジェットではブログの入力項目と同様「ビジュアルエディター」と「テキストエディター」がありました。

htmlタグを入力する際は「テキストエディター」を使用するのですが、保存した後、再度修正する際に改行タグ<br>が入るので、function.phpをウィジェットに改行タグが入らないように、編集する必要があります。

カスタムHTMLを使用すると、この問題は発生しません。これがhtmlタグの入力に「カスタムHTML」ウィジェットをおすすめする理由です。

 

カスタムHTMLの入力方法

カスタムHTMLウィジェットの使い方を紹介します。

まず、左メニューの外観にある「ウィジェット」をクリックして、ウィジェット画面を開きます。

 

ウィジェットページでは使えるウィジェット一覧が表示されています。この一覧に「カスタムHTML」ウィジェットがあります。一応、「テキスト」ウィジェットも囲っておきました。

 

「カスタムHTML」をクリックするとウィジェットを入れる箇所が選択できますので、入れたい箇所を選択して「ウィジェットを追加」をクリックします。「カスタムHTML」をドラッグして入れたい箇所にドロップすることでも追加できます。

 

ウィジェットを入れると、画像のような入力項目が表示されるので、「タイトル」、「内容」に入力します。htmlタグを入力するのは「内容」です。

 

入れた例がこんな感じです。入力したら「保存」をクリックして完了です。

今回はタイトルが不要だったので空欄にしております。

 

今回はブログを更新する中で、最近発見した「カスタムHTML」ウィジェットの使い方を紹介しました。

これまで、htmlタグの入力に「テキスト」ウィジェットを使っていた方も、今後は「カスタムHTML」ウィジェットを使ってみてくださいね。

ぽこみちの提供メニュー


・webの気になることを無料で調べてブログにします。
※お気軽にご質問ください。

・2時間密着webサポート
20,000円(税別・交通費別)

・藍染、茜染ワークショップ依頼
藍染代実費のみ/交通費・宿泊費別
※基本料金はかかりませんが、参加者5名が条件となります。
染物について詳しくはこちらよりご確認ください
お問い合わせは下記SNSからお気軽にどうぞ。


FacebookTwitterLINE@
このエントリーをはてなブックマークに追加