方法、手法

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. 方法、手法

    ユーチューブから音だけをmp3でダウンロードする方法は?

    音楽以外にも落語だとかあると思いますが、音源だけがほしい場合ってありま…

  3. 方法、手法

    有線のネットワークしかない場合に、Wi-Fi機器をネット接続する方法

    今の時代になっても、Wi-Fi環境がなく、有線LANしかないビジネスホ…

  4. 方法、手法

    エアコンに頼らず、家を涼しくする方法 風編

    熱いカラダを冷ますのに、うちわで扇ぐと涼しく感じるのは、この原理と同じ…

  5. 方法、手法

    セスキってなに?

    セスキってなに?環境にも人にもやさしいのにベトベト油汚れをしっかり落と…

  6. 方法、手法

    メッキ加工は自分でも出来る!

    「え、メッキって自分で出来るの?」はいできますよ。大きな部品は、やめた…

コメント

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

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

A language is translated.

笑える記事

役に立つ記事

気になる記事

スポンサードリンク

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

  1. 方法、手法

    やわらかい固体の水の作り方
  2. 方法、手法

    その多数決、ちょっと待った!
  3. 考え方

    私が家事を手伝うことはない。
  4. 方法、手法

    保冷剤の保冷以外の使い方
  5. 方法、手法

    食パンを止めているこれ、捨てないで利用できます。
PAGE TOP