表示項目の変更 | リアナのカスタマイズ日記(CSS編集用デザイン)

リアナのカスタマイズ日記(CSS編集用デザイン)

アメブロ 新CSS CSS編集用デザイン 無料
カスタマイズ アメブロカスタマイズ 初心者
CSS スタイルシート デザイン
javascript jQuery

★ 表示項目の変更

● 内容

① ブログ内の指定した場所の文字やHTMLをを変える。


● 設置方法

① フリープラグインへ下記を追加する
(下記は投稿者名の posted by を 投稿者:に変更する例)

<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script>(function(j){j(function(){$=jQuery=j})})($)</script>
<script type='text/javascript' src='http://usrcss.ameblo.jp/skin/templates/6d/7d/10030757386.css'></script>
<script type="text/javascript">
$(document).ready(function() {
$(".articleName span.name").item_replace({item_before:"posted by",item_after:"投稿者:"});
});
</script>


 ■ 説明

・ 下記が既にフリープラグインにあれば下記は不要です。

<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>


・ $(".articleName span.name").item_replace({item_before:"posted by",item_after:"投稿者:"});

".articleName span.name"・・・場所の指定(セレクタ名)
item_before:"posted by"・・・変更前の文字列
item_after:"投稿者:"・・・変更後の文字列


● JavaScript ソース内容

$.fn.extend({
item_replace:function(option_item_replace){
var item_before = option_item_replace.item_before;
var item_after = option_item_replace.item_after;
$(this).each(function(){
$(this).html($(this).html().replace(new RegExp(item_before, 'g'), item_after));
});
}
});