サイドバーメニューのタイトルを画像を使わずに変更する方法 jQuery

大発見？サイドバーの意外な使い方｜初心者が０円で魅力的なアメブロを作る方法 という記事にサイドバーのブックマークをおすすめ記事やまとめ記事一覧に利用する方法が紹介されています。

この使い方はけっこういいと思います！


その際にメニュータイトルを変更する必要が出てくるわけですが、画像を使って変更する方法が紹介されています。

画像作るのめんどいって人もいると思いますので、私は画像を使わないで変更する方法を紹介します。

このブログでは背景画像を一括で設定しているので、タイトルだけ変えればいいや～と思ったわけです。


⇒とりあえずサンプルブログ をご覧ください。


このカスタマイズはフリープラグインを使います。


赤字の部分を自由に変更してください。

アメブロ広告

<script type="text/javascript">
<!--
$(function(){
$('#defaultAd h4').text('アメブロ広告');
});
//-->
</script>

最近の記事一覧

<script type="text/javascript">
<!--
$(function(){
$('#recent_entries h4').text('最新の記事ですよ～');
});
//-->
</script>

テーマ一覧

<script type="text/javascript">
<!--
$(function(){
$('#theme_list h4').text('書いてるテーマ');
});
//-->
</script>

このブログの読者

<script type="text/javascript">
<!--
$(function(){
$('#reader h4').text('読者のみなさん');
});
//-->
</script>

最近のコメント

<script type="text/javascript">
<!--
$(function(){
$('#recent_comment h4').text('最近もらったコメ');
});
//-->
</script>

お気に入りブログ

<script type="text/javascript">
<!--
$(function(){
$('#favorite h4').text('読者になったアメブロ');
});
//-->
</script>

ブックマーク

<script type="text/javascript">
<!--
$(function(){
$('#bookmark h4').text('おすすめ！');
});
//-->
</script>

カレンダー

<script type="text/javascript">
<!--
$(function(){
$('#calendar h4').text('こよみ');
});
//-->
</script>

アーカイブ

<script type="text/javascript">
<!--
$(function(){
$('#archives h4').text('月別に読みますか？');
});
//-->
</script>

ブログ内検索

<script type="text/javascript">
<!--
$(function(){
$('#search h4').text('記事を探しますか？');
});
//-->
</script>

アメブロランキング

<script type="text/javascript">
<!--
$(function(){
$('#ranking h4').text('このブログの人気度');
});
//-->
</script>

プロフィール

<script type="text/javascript">
<!--
$(function(){
$('#profile h4').text('管理人について');
});
//-->
</script>

一括で変更するときは

<script type="text/javascript">
<!--
$(function(){
$('#defaultAd h4').text('アメブロ広告');
$('#recent_entries h4').text('最新の記事ですよ～');
$('#theme_list h4').text('書いてるテーマ');
$('#reader h4').text('読者のみなさん');
$('#recent_comment h4').text('最近もらったコメ');
$('#favorite h4').text('読者になったアメブロ');
$('#bookmark h4').text('おすすめ！');
$('#calendar h4').text('こよみ');
$('#archives h4').text('月別に読みますか？');
$('#search h4').text('記事を探しますか？');
$('#ranking h4').text('このブログの人気度');
$('#profile h4').text('管理人について');
});
//-->
</script>