★ 記事・メッセージボード・フリースペースの禁止タグを防ぐ
(javascriptは除く・・・但しダグ内に含まれているものは可能)
● ちゃんと動かない、わからない場合は、コメントで質問してください。
テスト不足の場合があるため、すべてのタグには対応して
いません。
★ 記事にタグを貼る場合は必ず、標準エディタまたはタグ編集エディタを使ってください。
新エディタでは、エディタ側で強制的に内容を変えてしまうので、タグを入れられません。
● 機能
① メッセージボードや記事で禁止タグになるコードを入れられる様にします。
② バナー紹介タグなどを記事、メッセージボードに入れられます。
③ 携帯にはタグを表示しないようにできます。
④ 改行を入れたい場合は、■を利用します。
■は、自由に別の文字に変えられます。あまり使われない文字を
指定してください。
(変換用の画面フォームを利用した場合は、何もする必要はありません)
⑤ フリースペースの禁止タグを防ぐためには、タグの変換が必要です。
⑥ 記事・メッセージボードでタグ編集エディタを使っている場合も
タグの変換が必要です。
⑦ タグ内容の文字数が長い場合は、うまく変換できない場合があります。
その場合は、複数に分割してください。
⑧ YouTubeの動画などを貼る場合は、標準エディタで、
YouTubeなどのコンテンツを貼り付けるには、こちらをご利用ください。
のこちらをクリックしないでも、動画を貼れます。
⑨ 下記に変換用の画面フォームを用意しています。
記事・メッセージボードに使う場合は、記事を書くで、HTMLモードで
結果を入れてください。
フリースペースに入れる場合は、そのまま結果を入れてください。
● 変換用の画面フォーム
◆ フリースペースの場合は、 変換後のタグをフリースペースに直接、貼ります。
記事・メッセージボードの場合は、HTMLタグを表示をクリックして、
HTMLモードにして変換後のタグを貼ります。
◆ この記事の◆ フリープラグインに追加 のスクリプトをフリープラグインに貼ります。
◆ この変換用のタグ内容(参考)・・・ 下記を使っています。
<form name="NG_tag_freesp_chg">
<fieldset><legend>★ 禁止タグ用変換(フリースペース用 記事・メッセージボードでも使えます)</legend>
◆ タグ内容
<textarea name="NG_tag_chg_in" cols="60" rows="90" style="height:150px;overflow:auto;font-size:12px;width:470px;"></textarea>
<input type="button" name="NG_tag_css_go" value="タグ変換" onClick="NG_tag_css_Create()"><input type="reset" name="NG_tag_reset" value="リセット">
<textarea name="NG_tag_chg_out" cols="60" rows="90" style="height:150px;overflow:auto;font-size:12px;width:470px;">結果</textarea>
</fieldset></form>
◆ この画面フォームのスクリプトのソースは下記
function NG_tag_css_Create(){
$(document).ready(function(){
var NG_tag_in=document.NG_tag_freesp_chg.NG_tag_chg_in.value;
var NG_tag_out=NG_tag_in.replace(/</g,"<").replace(/>/g,">").replace(/<br>/g,"").replace(/<BR>/g,"").replace(/"/g,""");
document.NG_tag_freesp_chg.NG_tag_chg_out.value='<div style="display: none;" class="NG_tag_area">'+NG_tag_out+'</div>';
});
}
● 関連記事
記事・メッセージボード内にスクリプトを入れる
http://ameblo.jp/new-blue-777/entry-11369686854.html
● やり方(変換用の画面フォームを使わない方法)
◆ 記事・メッセージボードの操作
① 記事メッセージボードに下記の様に入れます。(バナー紹介タグの例)
■は改行(<br>)を表しています。
<center><img src="バナー画像のURL">■<input value='<a href="http://ameblo.jp/アメーバID/" target="_blank"><img src="バナー画像のURL"></a>' readonly onclick="this.select()" style="background-color:#FFB6C1;color:#FF69B4;width:160px;border:1px solid #cccccc;"></center>
② HTMLモード(HTMLタグを表示のタブをクリック)にして、
スクリプトの最初に <div class="NG_tag_area" style="display:none"> を
いれ、スクリプトの最後に</div> をいれる。
<div class="NG_tag_area" style="display:none">
<center><img src="バナー画像のURL">■<input value='<a href="http://ameblo.jp/アメーバID/" target="_blank"><img src="バナー画像のURL"></a>' readonly onclick="this.select()" style="background-color:#FFB6C1;color:#FF69B4;width:160px;border:1px solid #cccccc;"></center>
</div>
③ 公開ボタンをクリックして記事を公開します。
HTMLモード、標準モードどちらで公開しても問題ありません。
④ 変更する場合は、一時的に下記の style="display:none" を外します。
<div class="NG_tag_area" style="display:none">
変更する時、ケース(内容)によっては禁止文字のエラーが表示される場合が
あります。
その場合は、一度、<div class="NG_tag_area" style="display:none">~</div> を
消してもう一度行なってください。
① ■は、改行(<br>)に変わります。■以外のものを指定可能です。
<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script type="text/javascript" src="http://usrcss.ameblo.jp/skin/templates/6d/7d/10030757386.css"></script>
<script type="text/javascript">
NG_tag_change('■');
</script>
尚、URLの関係でうまくいかない場合は下記を使ってください
<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script type="text/javascript" src="http://usrcss.ameblo.jp/skin/templates/6d/7d/10030757386.css"></script>
<script type="text/javascript">
NG_tag_change2('■');
</script>
◆ 説明
・ 下記はフリープラグインの最初に1つあればOKです。
<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
・ 下記が既に設定されていれば、不要です。
<script type='text/javascript' src='http://usrcss.ameblo.jp/skin/templates/6d/7d/10030757386.css'></script>
・ NG_tag_change('■');
■ は、<br>に変わる文字を指定します。
◆ プルダウンメニューのケース
① 下記で自動で作成します
http://ameblo.jp/new-bulue9/entry-10642311722.html#Top
② 例
<div id="sel_menu1"><SELECT onChange="location=this.options[this.selectedIndex].value" style="background-color:#FFFF00;color:#FFFFFF;font-weight:normal;">
<option style="background-color:#FFFF00;color:#FFFFFF" selected>メニュー</option>
<option value="http://ameblo.jp/new-blue-777" >ホーム</option>
<option value="http://profile.ameba.jp/new-blue-777" >ルーム</option>
<option value="http://blog.ameba.jp/reader.do?bnm=new-blue-777" >読者になる</option>
</select></div>
<div class="NG_tag_area" style="display: none;"><div id="sel_menu1"><select style="background-color: rgb(255, 255, 0); color: rgb(255, 255, 255); font-weight: normal;" onchange="function onchange(event) {
location = this.options[this.selectedIndex].value;
}">
<option selected="true" style="background-color: rgb(255, 255, 0); color: rgb(255, 255, 255);">メニュー</option>
<option value="http://ameblo.jp/new-blue-777">ホーム</option>
<option value="http://profile.ameba.jp/new-blue-777">ルーム</option>
<option value="http://blog.ameba.jp/reader.do?bnm=new-blue-777">読者になる</option>
</select></div></div>
◆ スクリプトのソースの中身
function NG_tag_change(br_chr){// 記事・メッセージボードの禁止タグを防ぐ
$(document).ready(function(){
$(".NG_tag_area").each(function(){
var NG_tag_datax=decodeURIComponent($(this).html());
var NG_tag_datay=NG_tag_datax.replace(/</g,"<").replace(/>/g,">").replace(/<br>/g,"").replace(/<BR>/g,"");
var NG_tag_data=NG_tag_datay.split(br_chr).join("<br>");
$(this).html(NG_tag_data).css("display","block");
});
});
}
function NG_tag_change2(br_chr){// 記事・メッセージボードの禁止タグを防ぐ
$(document).ready(function(){
$(".NG_tag_area").each(function(){
var NG_tag_datax=$(this).html();
var NG_tag_datay=NG_tag_datax.replace(/</g,"<").replace(/>/g,">").replace(/<br>/g,"").replace(/<BR>/g,"");
var NG_tag_data=NG_tag_datay.split(br_chr).join("<br>");
$(this).html(NG_tag_data).css("display","block");
});
});
}