方法、手法

addquicktagのカスタムタグ

アドクイックタグ(addquicktag)の追加タグ一覧

WordPressで記事を書くときに、どうしても表現方法がうまく出来ず、困っていました。

デフォルトの飾り文字では物足りなくなり、wordpressのプラグインでaddquicktagをインストールしてエディタをカスタムしました。

私の場合は、見出しではなく、単純に文字の大きさに強弱を付けたり、文字の色を付けたりぐらいは欲しいかなぁと思っていました。

ネットで調べてみて設定しても、思ったようなボタンを作ることが出来ませんでした。

wordpressのプラグインでは、結構ニーズの高いaddquicktgagですが、基本的な情報ばっかりで、肝心のタグ情報がほとんど見当たりませんでしたので苦戦しました。

他にも、困っている人がいるのではと、思い記事にしました。

私が追加した飾り文字とその下に、タグのHTMLを記載しましたので参考にしてください。

これで作ったタグボタンは、組み合わせることも出来るのでとても便利になりました。

例えば、赤文字と大文字と太文字など、どんどん組み合わせることができますのでお試しください。

HTML言語は、もっとスマートなものがあるかもしれませんが、私が成功した事例を紹介しています。

また、紫色や緑色などありますが、ここで紹介している色は私が好きな色にしていますので、オリジナルではないことをご了承ください。

文字の大きさ

8ポイント

<span style=”font-size: xx-small;”>8ポイント</span>

10ポイント

<span style=”font-size: small;”>10ポイント</span>

12ポイント

<span style=”font-size: medium;”>12ポイント</span>

14ポイント

<span style=”font-size: large;”>14ポイント</span>

18ポイント

<span style=”font-size: x-large;”>18ポイント</span>

24ポイント

<span style=”font-size: xx-large;”>24ポイント</span>

36ポイント

<span style=”font-size: 300%;”>36ポイント</span>

文字の色

赤色

<span style=”color: #ff0000;”>赤色</span>

青色

<span style=”color: #0000ff;”>青色</span>

緑色

<span style=”color: #00ff00;”>緑色</span>

黄色

<span style=”color: #ffff00;”>黄色</span>

茶色

<span style=”color: #800000;”>茶色</span>

灰色

<span style=”color: #c0c0c0;”>灰色</span>

水色

<span style=”color: #00ffff;”>水色</span>

紫色

<span style=”color: #ff00ff;”>紫色</span>

白色

<span style=”color: #ffffff;”>白色</span>

文字背景の色

赤色

<span style=”background-color: #ff0000;”>赤色</span>

青色

<span style=”background-color: #0000ff;”>青色</span>

緑色

<span style=”background-color: #008000;”>緑色</span>

黄色

<span style=”background-color: #ffff00;”>黄色</span>

茶色

<span style=”background-color: #800000;”>茶色</span>

灰色

<span style=”background-color: #c0c0c0;”>灰色</span>

水色

<span style=”background-color: #00ffff;”>水色</span>

紫色

<span style=”background-color: #ff00ff;”>紫色</span>

白色

<span style=”background-color: #ffffff;”>白色</span>

見出し文字

見出し1

<h1>見出し1</h1>

見出し2

<h2>見出し文字</h2>

見出し3

<h3>見出し3</h3>

見出し4

<h4>見出し4</h4>

見出し5

<h5>見出し5</h5>

見出し6

<h6>見出し6</h6>

今回の記事のように、HTMLタグをWebに表示するためにはタグを工夫しないと、HTML言語として表示することができませんので<  >を置き換えて入力する必要があります。

<= &lt ;  >= &gt ;

少しのHTML文章なら手間はかかりませんが、量が増えてくればとてもしんどいです。
そこで、Microsoft Word で便利な機能がありますので合わせて紹介します。
WordにHTML言語を貼り付けして、一括置換します。

Wordで一括置換の手順

ホームタブ のリボンの右の方に 編集 がありますのでそれをクリック。
プルダウンしたリストの中から 置換 をクリック。
すると 検索と置換 のウィンドウが開きます。
検索する文字列 に < を入力し、 置換後の文字列 に &lt ; を入力します。
次は、 すべて置換 を押せばWordエディタの < はすべて &lt ; に置き換わります。

Wordがなければ、便利なフリーソフトもありますので検索してみてください。


follow us in feedly

ブログ記事を応援してくれる方はポチッっと下のボタンを押してね

そして、この記事をツイッター投稿してくれるなら下のボタンを押してね

電子レンジを考察前のページ

思い出の紙コップ次のページ

関連記事

  1. 方法、手法

    交通事故の被害者になったときに絶対抑えておくべきポイント

    交通事故の被害者になったときに絶対抑えておくべきポイントを公開「慰謝料…

  2. 方法、手法

    いまさら聞けないエンジンオイルの選び方2

    結局、ここまで細かく性能を知ったところで、無難なエンジンオイルは純正指…

  3. 方法、手法

    LINEを使えば固定電話に無料通話ができる

    1日5回まで利用可能固定電話への通話:3分/回携帯電話への通話:1分/…

  4. 方法、手法

    なぜ昆布は海でダシがでないの?

    昆布が生きている間はグルタミン酸というのは表皮細胞に蓄えられています。…

  5. 方法、手法

    全角半角キーがないキーボードでIMEのON/OFFの切り替え方

    ”Alt”キーを押しながら・・・”~”(チルダ)キーを押すと出来ます。…

  6. 方法、手法

    いろんなワインコルクの開け方

    ワインは衝撃によって、多少味が変化しますので、高級なワインではおすすめ…




役に立つ記事

気になる記事

笑える記事

follow us in feedly
  1. 考え方

    世界中がずっこける『Yes We Can』
  2. 考え方

    預金封鎖とは
  3. 考え方

    感受性が強いがゆえに苦しむ場合
  4. 方法、手法

    あずき枕の作り方! 小豆(あずき)の不思議な効能を紹介します。
  5. 方法、手法

    値引きなどにも使える交渉ノウハウ
PAGE TOP
%d人のブロガーが「いいね」をつけました。