アフィリエイト広告を利用しています

広告

posted by fanblog

ファンブログの省略タグをカンタンに HTML タグに変換する方法

ファンブログ カスタマイズ

今までファンブログ特有の省略タグをHTMLタグに書き換えることで、いろいろなことができるってお話してきましたが、やっぱり書き換えるのは面倒ですよね。

そこで、今回はこのわずらわしい作業がカンタンにできちゃう画期的?な方法を発見しちゃったんで、そのやり方を説明しちゃいます。面倒くさがり屋のかたは必見ですよ!(≧ω≦)b
方法はとてもカンタンで、「テキストエリア」というものを利用して、省略タグを HTML タグに一発変換しちゃいます。

このテキストエリアの中に入力された文章は通常表示されないタグなんかもそのままの形で表示される仕組みとなってまして、プログラムのソースなどを表示するのにもよく使われているものなんです。実はこの中に省略された画像タグの{ファイル名.jpg}や、絵文字の{まる}なんかを入れるだけで、HTML タグに一発で変換できちゃうんです。
▼ それではやり方の説明です ▼

まず最初に新規記事を作成する画面を開き、記事入力画面の1番上にテキストエリアを仮設置します。
以下のタグをコピーして記事入力画面の1番上に貼ってください。
<textarea>
ここに省略タグ
</textarea><br />

このテキストエリアは変換のために仮設置するだけなので、変換作業が終わりましたら投稿の前に削除します。
1番上に設置するのは削除するのを忘れないようにするためです。

このタグを貼りますと、入力画面の下に「ここに省略タグ」という文章が表示された黒枠のテキストエリアのプレビュー画面が表示されます。これで準備完了です。
※ 設置する際は左サイドバーの オプション>改行を有効にする のチェックを外してください。チェックしたままですと以下のように余分な改行タグ<br>が表示されてしまいます。
<br>
ここに省略タグ<br>

今回は画像の省略タグである {ファイル名.jpg} を変換する方法で説明します。
「ここに省略タグ」という文章を削除して、カーソルを文章が元あった場所の先頭に点滅させてください。
<textarea>
|
</textarea>
挿入したい画像を通常の手順で挿入してください。
<textarea>
{ファイル名.jpg}
</textarea>
画像 {ファイル名.jpg} が挿入されたら、テキストエリアのプレビュー画面を確認してみてください。
プレビュー画面に <img src="../URL" border="0"> というHTMLタグが表示されてましたら成功です!!

一度保存した記事に画像を挿入した場合は、画像のアドレス:(URL)に記事番号が表示されますが、一度も保存していない記事に画像を挿入した場合は、記事番号が「0」と表示されてしまいますので、必ず下書保存をして記事番号を確定させてください。

このプレビュー画面で表示されたHTMLタグをコピーして、テキストエリア外になります </textarea> の下に貼り付けてください。挿入した画像が表示されたら、とりあえず成功です。
※ ここで注意事項 ※

表示された /URL の前にドットが2個表示されます。
この2個のドットを削除しないと記事を投稿した際、画像が表示されません。

<img src="../URL" border="0" >
"/ の間の .. を削除する。

<img src="/URL" border="0" >

この現象は、画像の挿入時のみ発生します。画像の場合は1つ上のフォルダ内のファイルを指定する相対パスで表示されます。記事編集画面では画像は表示されますが、公開するとこのアドレスでは表示されませんので、
/ の前にある2個のドットを削除する必要があります。リンクタグや絵文字ではURLは正常に変換されます。

変換する省略タグが無ければ1番上に設置したテキストエリアのタグを削除して作業は終了です。

いかがでしたでしょうか?注意するのは2個のドットの削除だけなので、これは本当に便利でラクラクです。
画像の保管場所として記事を下書き保存している方は、テキストエリアを常設しておくと一発変換できますよ!

応用として、<リンク:> を HTML に変換して、target="_blank" を削除するだけで、「同じ窓で開くリンク」のタグができちゃいますし、絵文字なんかもカンタンに HTML タグに変換できちゃうんで、よく使う絵文字のタグなんかをメモ帳なんかにコピーしておけば、サイドバーや記事以外の場所でも絵文字が使えちゃいます。
画像を多用される方は、この方法を使えば、いろいろな要素を組み込む前に行っていた省略タグを HTML タグに直す作業から開放されちゃうんで、とっても便利ですよ!ぜひぜひお試しあれ!(≧ω≦)b

またちょっとした小技を発見しましたら記事をアップします。気長にお待ちくださいませ。(´・ω・`)
※上記Htmlタグはコピー&ペーストでそのままご利用になれます。
※Htmlタグのご使用、カスタマイズにつきましては、利用者の自己責任にてお願いします。
この情報が、お役にたちましたら ≫ FC2 Blog Ranking ≪ 押していただけると励みになります

この記事へのコメント

« 前の記事 : リンクは同じ窓で開く?別窓で開く?2つのリンクの使い分け
自分の記事の幅(width)を知ろう! : 次の記事 »

ブログパーツ
美容整形
Related Posts Plugin for WordPress, Blogger...
×

この広告は30日以上新しい記事の更新がないブログに表示されております。