方法、手法

addquicktagのカスタムタグ

 

 

 

 

 

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

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

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

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

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

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

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

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

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

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

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

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

 

文字の大きさ

8ポイント

10ポイント

12ポイント

14ポイント

18ポイント

 

24ポイント

 

36ポイント

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

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

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

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

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

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

<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

見出し2

見出し3

見出し4

見出し5
見出し6

<h2>見出し文字</h2>
<h1>見出し1</h1>
<h2>見出し2</h2>
<h3>見出し3</h3>

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

少しのHTML文章なら手間はかかりませんが、量が増えてくればとてもしんどいです。

そこで、Microsoft Word で便利な機能がありますので合わせて紹介します。

WordにHTML言語を貼り付けして、一括置換します。

 

Wordで一括置換の手順
ホームタブ のリボンの右の方に 編集 がありますのでそれをクリック。

プルダウンしたリストの中から 置換 をクリック。

すると 検索と置換 のウィンドウが開きます。

検索する文字列 に < を入力し、 置換後の文字列 に &lt ; を入力します。

次は、 すべて置換 を押せばWordエディタの < はすべて &lt ; に置き換わります。

 

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

 

 

 

ブログ記事を応援してくれる方はポチッっと下のボタンを押してね
人気ブログランキング
そして、この記事をツイッター投稿してくれるなら下のボタンを押してね

 

関連記事

  1. 方法、手法

    違う金属を接触させてはいけない理由

    街を歩いていて、ふと建材を見てみると、ステンレスの建材にアルミリベット…

  2. 方法、手法

    三相交流が理解できる話

    工場にある、様々な回転機器に使われている三相モータを動かすには、三相交…

  3. 方法、手法

    日程調整が楽になる方法

    打ち合わせを開催したり、歓送迎会を企画したりする時にはまず、出来るだけ…

  4. 方法、手法

    エアコンの電気代を節約する方法

    日中(9時〜18時)は、外出したとしても、つけたままにする。まるで都市…

  5. 方法、手法

    車のバッテリートラブルを未然に防ぐ方法

    この統計から判断できる結果として、バッテリートラブルさえ起こさなければ…

  6. 方法、手法

    電気パンってご存知ですか?作り方も解説します。

    電気は、電解質なら流れるので、重曹を入りのパン種が電解質になっています…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

A language is translated.

笑える記事

役に立つ記事

気になる記事

スポンサードリンク

応援していただける方はポチッと!

  1. 方法、手法

    カニの足は、特別な道具がなくても綺麗に食べることができます!
  2. 方法、手法

    意外に使える計算方法が出てくる善ちゃんとの買い物
  3. 考え方

    あなたの欲求は何ですか? 欲求の果てにあるものとは
  4. 方法、手法

    絶対に得をする礼儀作法
  5. 思い出

    告白はどこへいってしまったのか
PAGE TOP