テンプレート一覧
★。.:*:゙゚☆ヽ(о>ω・)ノ●Welcome●ヽ(・ω<о)ノ☆゚゙:*:.。★
当ブログはFC2ブログ専用のテンプレートを
無料で配布致しております。
利用規約をお読みになってお使い下さいペコ ○┓ペコ
共有テンプレートにて配布いたしております。
【2カラム】

【sugerpink_2c】
  【3カラム】                         【FL-3c】【Honeymomo3c-b】
     プレビュー  
【kuma-usa】【Honeymomo】【sugerpink-3c】
EntryNavi---★
最新の記事
スポンサーサイト 
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
スポンサー広告】 | top↑| 管理者用記事編集
記事画像にポラロイド枠をつける! 
トモのブログでは画像にポラロイド枠を付けています
そこでよく聞かれるのが画像の編集で付けてるの??
どーやってつけるの???
ってことです・・・・
説明が下手なのでスルーしてきましたが自分がテンプレを
いじる際に毎回大変なのでメモ書きをしようと思います。

ココで注意ですがそれぞれお使いのテンプレートが違うので
トモが紹介した方法ではclassの指定が違っていたりします。
そうすると反映されないのでお気をつけ下さいね。

まずはテンプレートのHTMLの編集を見てください。
記事部分を指定しているclassを探します。
トモの使っているテンプレ(cosme)では
<div class="entry_body">
(げげっ!!文字が・・・小さい(A;´・ω・)アセアセ)を使っていました。ですので
.entry_body img
を使います。

.entry_body img {
background-color: #f7f7f4;
border-width : 2px;
padding : 10px 10px 50px 10px;
margin : 5px 10px 5px 5px;
border-style: solid;
border-color: #e2e2db #c4c4ac #c4c4ac #e2e2db;
background-image:url(http://~);
background-repeat:no-repeat;
background-position:50% 95%;
text-align: center;
margin-left: 50px;
class="emoji"
}


をHTMLの編集のしたスタイルシート編集の1番下から1行あけて追加します。
background-image:url(http://~);

の部分にはトモのブログでいうと

の部分になります。
そのしたの
background-position:50% 95%;
はその画像の位置ですね。
text-align: center;
margin-left: 50px;

はそれぞれ画像の位置・左からどのくらいの位置かですのでお好きなように変更してください。
class="emoji"これは記事の画像例えば記事を書くときに

<Img Src="画像アドレス" ALT="">

クラス指定をしていないとこうなりますが・・・・・・

<Img Src="画像アドレス" ALT="" class=emoji>

と最後にclass=emojiをつけることによってポラ枠線を付けない
事もできます。

でもですね・・・・・
このまま正しく挿入してみると記事中の絵文字や拍手などにも枠線が付いてしまう
んですよね・・・・・・・・
そこで・・・・・・・・・・

.fc2_footer img {
display:inline!important;
margin-right:1px;
margin-left:1px;
background:none;
padding:0;
border:none;
}

img.emoji {
display:inline;
margin-right:0px;
margin-left:0px;
background:none;
padding:0;
border:none;
}

をスタイルシートに追加します。

そうすると・・・・・・
いかがでしょうか???
思い通りになりましたでしょうか?????

何分本人も詳しくないので抜けてるところもあるかもしれませんが
今のところコレで表示されてると思います・・・・・www

あと!!
追記部分なんですけどね・・・・・・・・
ここも個別に指定しないとポラ枠がつかないテンプレもあるんですよね・・・・・
このテンプレの場合は指定が同じだったので結構楽でしたけど・・・・・

初心者の方はトモの説明よりももっと上級者の方の
説明をご覧いただけるとわかりやすいかとおもいます・・・・・・

なんせメモ書きですのでつっこんだご質問はご遠慮願います。
大まかな説明なら出来ると思うのでコメント欄にでも気軽に書いちゃってください。
でもでも!この記事以外のカスタマイズのご質問はスルーしますので・・・・・
よろしくお願い致しますペコ ○┓ペコ

あとですね・・・・
もしこの記事を見て成功したら・・・・・・・・・・
ブログの紹介なんかもしていただけると・・・・・
ありがたいのぅ・・・・・・・
(`゜∀゜´)グアッヒャッヒャッヒャッヒャッヒャッヒャッヒャッヒャッ!!
スポンサーサイト
カスタマイズトラックバック(0) | コメント(8) | top↑| 管理者用記事編集
(●`゚∇゚)ノ【☆゚+.ぉ返事.+゚☆】ヽ(゚∇゚´●) by ★トモ★
v-3おかん♪
わっ・・・・わざわざ・・・・??
ありやと・・・なv-413

(●`゚∇゚)ノ【☆゚+.ぉ返事.+゚☆】ヽ(゚∇゚´●) by ★トモ★
v-3おかん♪
ほほーーー
そうだったのかっ!
いやさ・・・・・・
書いておかないとさしらない人からじゃんじゃん
質問来て大変だったのよ・・・
お友達なら全然"Σd(,,-ω´-,,)ォヶ☆"でしゅ!
いつでも聞いて!
・・・といっても説明できんがwww
結構難しいからがんばってや~
おかんのテンプレだとさ・・・・・・
追記は追記で指定せないかんから
結構面倒よ(。→ˇ艸←)ププッ

No title by おかん
お!!!!!
d(´∀`o)☆゚+。サンキゥ゚+。☆(o´∀`)b
めちゃくちゃ聞きたかってん~~~~!!!
でも・・・な
聞いてもスルー・・・って書いてあったから・・・・
聞くことできんくてな~~~w
やった~~ありがたやぁ~~♪
いつに出来るかは、、、わからんがw
 がんばってみる~~~!!
この記事コピーとっとかななv-401

No title by おかん
ポチポチ・・・押すん忘れてもて・・・w
今・・・ポチっとな・・・v-388

こんにちは! by かおりん
お~!!
こんなやり方だったんですね。
私もいつになるか分からないけどやってみたいです♪
できたら、もちろんここのブログ紹介しますね~(*^_^*)

(●`゚∇゚)ノ【☆゚+.ぉ返事.+゚☆】ヽ(゚∇゚´●) by ★トモ★
v-3かおりんs♪
こんばんは~♪
そうなんです・・・こんなやり方なのですwww
ぜひともやってみてくださーーい♪

by かおりん
できた~!!
今更ですが、やってみたらなんとか成功!!
でも、まだ余分な画像にも枠が・・。
もう少し頑張ってみるよ♪
カスタマイズって難しい(>.<)
こんなこと出来ちゃうトモs、ソンケーしますww

かおりんへ by トモ@お返事
実はね・・・
今はこの方法使ってないのだ…
もっと簡単に設定できる方法が見つかってね・・・
これってとても難易度が高いらしいヾ(-д-;)ぉぃぉぃ
無駄な部分の枠はたぶんコメント部分とかかな?
↑の装飾部分にもついてしまうので
.fc2_footer img 以下を追加してね!!
がんばれ~♪

<<どうしても無理です・・・・・ | ホーム | ブログ画像の撮り方>>
(●`゚∇゚)ノ【☆゚+.ぉ返事.+゚☆】ヽ(゚∇゚´●)
v-3おかん♪
わっ・・・・わざわざ・・・・??
ありやと・・・なv-413
【2008/03/07 17:10】URL | ★トモ★ #-[ 編集]

(●`゚∇゚)ノ【☆゚+.ぉ返事.+゚☆】ヽ(゚∇゚´●)
v-3おかん♪
ほほーーー
そうだったのかっ!
いやさ・・・・・・
書いておかないとさしらない人からじゃんじゃん
質問来て大変だったのよ・・・
お友達なら全然"Σd(,,-ω´-,,)ォヶ☆"でしゅ!
いつでも聞いて!
・・・といっても説明できんがwww
結構難しいからがんばってや~
おかんのテンプレだとさ・・・・・・
追記は追記で指定せないかんから
結構面倒よ(。→ˇ艸←)ププッ
【2008/03/07 12:18】URL | ★トモ★ #-[ 編集]

No title
お!!!!!
d(´∀`o)☆゚+。サンキゥ゚+。☆(o´∀`)b
めちゃくちゃ聞きたかってん~~~~!!!
でも・・・な
聞いてもスルー・・・って書いてあったから・・・・
聞くことできんくてな~~~w
やった~~ありがたやぁ~~♪
いつに出来るかは、、、わからんがw
 がんばってみる~~~!!
この記事コピーとっとかななv-401
【2008/03/07 10:46】URL | おかん #hAfnEuo6[ 編集]

No title
ポチポチ・・・押すん忘れてもて・・・w
今・・・ポチっとな・・・v-388
【2008/03/07 16:10】URL | おかん #hAfnEuo6[ 編集]

こんにちは!
お~!!
こんなやり方だったんですね。
私もいつになるか分からないけどやってみたいです♪
できたら、もちろんここのブログ紹介しますね~(*^_^*)
【2008/03/08 15:20】URL | かおりん #Xh6YYzMg[ 編集]

(●`゚∇゚)ノ【☆゚+.ぉ返事.+゚☆】ヽ(゚∇゚´●)
v-3かおりんs♪
こんばんは~♪
そうなんです・・・こんなやり方なのですwww
ぜひともやってみてくださーーい♪
【2008/03/09 00:47】URL | ★トモ★ #-[ 編集]

できた~!!
今更ですが、やってみたらなんとか成功!!
でも、まだ余分な画像にも枠が・・。
もう少し頑張ってみるよ♪
カスタマイズって難しい(>.<)
こんなこと出来ちゃうトモs、ソンケーしますww
【2008/10/12 21:48】URL | かおりん #Xh6YYzMg[ 編集]

かおりんへ
実はね・・・
今はこの方法使ってないのだ…
もっと簡単に設定できる方法が見つかってね・・・
これってとても難易度が高いらしいヾ(-д-;)ぉぃぉぃ
無駄な部分の枠はたぶんコメント部分とかかな?
↑の装飾部分にもついてしまうので
.fc2_footer img 以下を追加してね!!
がんばれ~♪
【2008/10/15 11:50】URL | トモ@お返事 #XZ039GEA[ 編集]
















管理者にだけ表示を許可する
トラックバックURL
http://makeatemplate.blog95.fc2.com/tb.php/24-c9ac24af
この記事にトラックバックする(FC2ブログユーザー)
| ホーム |
ブログ内検索
プロフィール

トモ

Author:トモ
専業主婦。
♀・♂・♀の3児ママ♪
好きなことはゲーム!
あ・・・
でもヲタクぢゃなくてよ?
アハッ(〃゚艸゚〃)

●○当ブログのバナーです○●
お入り用の方は
ご自由にお持ち帰りください。
右クリックでお持ち帰りください
makeatemplate.blog95.fc2.com/

●トモへのメッセージなど●
 

8/11 カウンター設置しました♪

ただ今サマ閲覧中♪


ランキングに参加しています♪
ぽちっと1クリックお願いいたします。

にほんブログ村 ブログブログ ブログテンプレートへ
Comment
TB
Arcive
全記事表示リンク
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。