トップページ > カテゴリー [おすすめブログカスタマイズ ]







 スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


↓ このブログをブックマーク ↓




↓ ランキング参加中♪ 応援してくれたら嬉しいです(´∀`*) ↓

ブログランキング・にほんブログ村へ 人気ブログランキングへ 




[ --/--/-- --:-- ] スポンサー広告 | TB(-) | CM(-) | 編集

 リストマーク「・」をアイコンにする方法

ほとんどのテンプレートでリストマークは「・」になっていると思います。

これを好きな画像アイコンに変える方法をご紹介します。


私のブログで言うと、最新記事やリンク集の前についている↓このアイコンです。

リストマークを変える


「・」に設定されていて、可愛いアイコンに変更してみたい!という方は是非試してみてください(*´∀`*)

かなり簡単です!!



 リストマークを画像アイコンに変更する


テンプレートの設定の「スタイルシート編集」をします。

スタイルシートの一番最後に、

ul { list-style-image: url("画像のURL"); } 


を加えてください。



画像は、あらかじめ気に入ったものをアップロードしておいてください。

(画像のアップロードの仕方はこちらを参照ください。)


bulb01c.gif アップロードした画像のアドレスを"画像URL" に入れてください。

画像アドレスコピー


これだけでリストマークが可愛いアイコンに変わっちゃいます~('∀`)

画像は文字サイズより小さいものを選んでくださいね♪



スポンサーサイト


↓ このブログをブックマーク ↓




↓ ランキング参加中♪ 応援してくれたら嬉しいです(´∀`*) ↓

ブログランキング・にほんブログ村へ 人気ブログランキングへ 




 プラグインの最新記事に「NEW」マークをつける


前に、記事のタイトル前に「NEW」マークをつける方法をご紹介しましたが、今回はプラグインの最新記事に「NEW」マークをつける方法をご紹介したいと思います。


私のブログだと、この部分↓です。

プラグイン最新記事の前にNEWマーク


まず、「プラグインの設定」>「最新記事」【詳細】>【HTMLの編集】をします。

私の場合↓こうなっているので、 赤字の部分を付け加えてください。

<ul>
<!--recent-->
<li &align>
<a href="<%recent_link>" title="<%recent_title>"><%recent_title> (<%recent_month>/<%recent_day>)</a>
<!--▼newマーク▼-->
<script type="text/javascript">
nwr(<%recent_year>,<%recent_month>,<%recent_day> ,<%recent_hour>)
</script>
<!--▲newマーク▲-->

</li>
<!--/recent-->
</ul>



次に、「テンプレートの設定」>HTMLの編集をします。

<head>~</head>の間に以下のタグを挿入してください。

<!--▼新着記事用newマーク▼-->
<script type="text/javascript"><!--
function nwr(u1,u2,u3,u4) {
var today=new Date();
var nt=24; var c=new Date(u1,u2-1,u3,u4);
if (today-c<3600000*nt) {
document.write('<img src="画像URL" border="0">')}
}
--></script>
<!--▲新着記事用newマーク▲-->



「nt=24;」が時間なので、12に変更すれば12時間新着マークが表示されます。



画像は、あらかじめ気に入ったものをアップロードしておいてください。

(画像のアップロードの仕方はこちらを参照ください。)


bulb01c.gif アップロードした画像のアドレスを"画像URL" に入れてください。

画像アドレスコピー







↓ このブログをブックマーク ↓




↓ ランキング参加中♪ 応援してくれたら嬉しいです(´∀`*) ↓

ブログランキング・にほんブログ村へ 人気ブログランキングへ 




 プラグインのタイトル前にアイコンを入れる

私のブログでもプラグインのタイトル前にアイコンを入れています。

プラグインタイトル前にアイコン


見た目を可愛く飾りたかったのと、見る人にもみやすいかな~、
と思っていれてみました♪



「テンプレートの設定」から「HTMLの編集」をします。


私のテンプレートだとこの部分です。


<!--▼▼ プラグイン カテゴリー1 ▼▼-->
<!--plugin-->
<!--plugin_first-->
<div class="menu_title" style="text-align:<%plugin_first_talign>"><img src="アイコンをアップロードした時のアドレス" > <%plugin_first_title></div>


<!--/plugin_first-->
<!--/plugin-->
<!--▲▲ プラグイン カテゴリー1 ▲▲-->



赤字の部分を挿入して、使いたいアイコンのアドレスを入れてください。


<%plugin_first_title>がプラグインのタイトルなので、その前に入れるとタイトル前にアイコンが付きます。



これでプラグイン1は完了です♪


プラグイン2・3も同様に、同じアイコンでも別のアイコンでも好きなものを入れてみてください(*´∀`*)



テンプレートが違うと全く同じ場所ではないかもしれませんが、似たようなところは見つけられると思うので、是非チャレンジしてみてくださいね~♪






↓ このブログをブックマーク ↓




↓ ランキング参加中♪ 応援してくれたら嬉しいです(´∀`*) ↓

ブログランキング・にほんブログ村へ 人気ブログランキングへ 




 「お気に入り」登録ボタンを作る


「お気に入り」登録ボタンとは、私もブログのサイドに設置している



このボタンのことです。


ブラウザの機能を使えば「お気に入り追加」はすぐにできるんですが、

少しでも登録してもらえる機会を増やそうと設置しています。


※Internet Explorerでのアクセス者にしか意味のない機能ですが、
ほとんどの方がそうであろうという前提です。



 よく見る普通のボタン


<input type="button" value="お気に入りに登録" onclick=" javascript:window.external.AddFavorite('ブログのURL','ブログの名前');"> 


これで、こんな感じ↓に出来上がります。




「お気に入りに登録」という言葉は自由に変えられます。



 アイコン入りのボタン


<button style="height:30px;" onclick="javascript:window.external.AddFavorite
('http://ブログのURL','ブログの名前');"><img src="アイコンをアップロードした時のアドレス"style="vertical-align:middle;"> このブログをお気に入りへ</button>

アイコンは、気に入ったものを素材屋さんからかりてきてくださいね♪
 

これで、こんな感じ↓に出来上がります。




height:の後の数字を変えるとボタンの高さが変わります。



 ボタンではなくテキストリンクを作る


<A Href="javascript:window.external.AddFavorite('http://ブログのURL','ブログの名前')">お気に入りに登録</A>


実際に表示させると、こんな感じ↓になります。

お気に入りに登録



ボタンが完成したらお気に入りに登録されるかどうか、実際に試してみてくださいね♪






↓ このブログをブックマーク ↓




↓ ランキング参加中♪ 応援してくれたら嬉しいです(´∀`*) ↓

ブログランキング・にほんブログ村へ 人気ブログランキングへ 




 最新記事に「NEW」マークをつける

自分のお気に入りのブログを訪問したときに、記事に「NEW」マークが付いていると


最近更新された記事なんだ!

この記事、まだ読んでないな。


って分りやすくなりますよね。


記事が目立って、読んでもらいやすくなるかもしれませんし(*´∀`*)



私のブログではこのマークです↓

「NEW」マークのついた記事


私は素材屋さんでお借りした画像を使用しています。


このような画像でも、「NEW」という文字をつけることも出来ます。


では、設定方法です。



最新記事に「NEW」マークをつけるの続きを読む


↓ このブログをブックマーク ↓




↓ ランキング参加中♪ 応援してくれたら嬉しいです(´∀`*) ↓

ブログランキング・にほんブログ村へ 人気ブログランキングへ 




 サイト名の前にファビコンをつける!(FC2ブログでの設置方法)


ファビコンとは・・・


例えば、Yahoo!を開いたときにアドレスの前についているこれ↓とか、

Yahoo!ファビコン



お気に入りの一覧で、サイト名の前についているこれ↓のことです。

お気に入りファビコン



ちなみに、FC2でブログをつくると最初はFC2ブログファビコンになっています。

私はこんな感じに変更しました。

当ブログファビコン


ファビコンがあると、覚えてもらいやすい気がしませんか?

訪問者にブログを印象づけるためにも、ファビコンおすすめですよ♪

簡単にできるので、ぜひ試してみてください(*´∀`*)


fr04.gif まずはファビコンにするアイコンを選びましょう。


ファビコン 素材」で検索すると、結構出てきます。

できるだけ小さめのアイコンを探して、素材屋さんから借りてみてください。

最近は、ブログで使えるフリー素材を配布している素材屋さんが多いので、

探せば、可愛いのがいっぱいありますよ(´▽`)



fr04.gif 次に、アイコンの保存形式を変えます。


素材屋さんで借りたアイコンの形式はgifやjpeg形式のものが多いと思います。

ico形式への変換は、「FavIcon from Pics」でします。


英語ばっかりで難しそうに見えますが、簡単ですよ♪


まずは、保存したアイコンをダウンロードします。

「参照」をクリックしてしてアイコンを選び、「Generate FavIcon.ico」をクリック。

アイコンのダウンロード



↓ こんな感じで出来上がります!

ファビコン出来上がり!



いくつか試しに作ってみたい時は、続けて「参照」から別のアイコンを読み込めば、
2つ・3つと作っていけます。

ファビコン2



気に入ったアイコンができたら、自分のパソコンにダウンロードしましょう。

ダウンロード



fr04.gif 最後に、ファビコンをテンプレートに入れる作業です。


まず、圧縮されてるファイルを開きます。

圧縮ファイル


中に入ってる3つのファイルのうち、ico形式になってる「favicon」を使います。

ファイル



FC2ブログにファビコンをアップロードします。

普通の画像をアップロードする時と同じように、アップロードしてください。

画像のアドレスをコピーしておきます。

ファビコンアップロード



管理画面の「環境設定」>「テンプレートの設定」から「HTMLの編集」をします。

テンプレートの</head>を探してください。
※「Ctrlキー」+「F」で検索するとすぐ見つかると思います。


その直前に、 <link rel="shortcut icon" href="http://~~~"/> を挿入します。

http://~~~のところに、先ほどアップロードした画像のURLを入れてください。



これで、ファビコンが設置できたと思います。

自分のブログをお気に入りに入れて、確認してみてくださいね(゚∀゚ )







↓ このブログをブックマーク ↓




↓ ランキング参加中♪ 応援してくれたら嬉しいです(´∀`*) ↓

ブログランキング・にほんブログ村へ 人気ブログランキングへ 




 毎回記事の下にランキングや広告を入れる


記事の最後に、毎回同じ広告がやランキングバナーが入っているサイトって
よく見かけますよね?


私もこんな感じ↓で、毎回表示するようにしています。



記事下ランキング・広告



これを毎回入力するのって面倒ですよね(´・ω・)

私、皆さん毎回打っているものだと思って、頑張ってました・・・。

コピペにしても毎回は面倒くさかったです。。




そこで!テンプレートを編集して、毎回自動で表示されるようにしました!


「環境設定」>「テンプレートの設定」から「HTMLの編集」をします。


<%topentry_body>の下に表示したいランキングバナーや広告を入れます。

※「Ctrlキー」+「F」で検索するとすぐ見つかると思います。


改行したければ、<br>を入れましょう。




↓ このブログをブックマーク ↓




↓ ランキング参加中♪ 応援してくれたら嬉しいです(´∀`*) ↓

ブログランキング・にほんブログ村へ 人気ブログランキングへ 









上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。