The other way round

ARTICLE PAGE

訪問者コメントと管理人コメントを区別する

author photo

Byvanillaice (Akira)

sample
至って単純なtips(小技)でございます
あくまでも私のテンプレについて のお話しになりますので
固有の名称(私が付けた名称)なども出てきますので
汎用性を求められる場合には その主旨に沿った記事を他ブロガー様・他サイト様でお探しくださいませ (*_ _)

sc0000 (1)


FC2ブログはコメント時に顔アイコンなどが用意されていませんので
できれば視覚的に区別したいところですよね
yahooブログなんかはあるんだけどもね
yahooはコミュニケーション面では優れているのですが 他がダメダメ((((笑)
(コメントした他ブロガーさんの記事に新規コメントが付いた時にもお知らせがあります これはFC2でも導入して欲しい)

手順としては主に CSSスタイリングになりますので
テンプレ管理画面「下」のたくさんの文字列ですね
ここに一部追加します
その前段階として htmlの方にも少しだけ手を加えます
2015.5.25 現時点での最新テンプレ「Paradiso」はこの前段階を済ませてあります
過去テンプレについてはそもそもアイコンを付ける仕様として作成していませんので
もし希望されるのであれば 本記事を参考に自力でお願いします ^^;
あとは ハンドル名が被ったらどーすんだ 的な問題もありますが
そこは上手くやってもらう ということで((((笑)

Paradiso 内の html
comment_area 内に <%comment_name> という箇所があります
この要素を囲っているコンテナが


<div class="stamp <%comment_name>">


なのですが
class の後ろに stamp そして半角スペースを開けて <%comment_name>
という箇所があります
これが「コメントした人の名前をクラス名にする」という指示内容です

山田
というハンドルの方がコメントしたら
class="山田"
というクラスが形成され
Akira
というハンドルがコメントしたら
class="Akira"
というクラスが出来るわけですね

これでクラス形成されましたので あとはこの「自分のハンドル名クラス」にCSSで指示を出すだけです
(ここまでの作業はしなくて良いですよ 既に導入済みです)


-----------------------


ここから皆さんの作業です
私のハンドルネームを例にとります

クラス名ですから CSSでの書き方は 名称の前にドット (.)

.Akira

どっとあきら
ですね
ドットとハンドルネームの前に半角スペースを入れてはいけません 機能しなくなりますので注意

具体的指示内容は以下の通り


.Akira {
background: url(アイコンURL) left top no-repeat;
width: 100%;
min-height: 66px;
}



上記 ドットの後ろのハンドルネーム そして アイコンURL
この二点をそれぞれご自分の内容と書き換えてください
これを書く場所ですが
以下の記述よりも必ず後方に記してください


.stamp {
background: url(http://blog-imgs-71.fc2.com/v/a/n/vanillaice000/airmailstamp.png) left top no-repeat;
width: 100%;
min-height: 66px;
}


CSSの順序には意味があります
この文字列よりも「前」に書いてしまうと機能しませんので 必ずこれよりも「後」です
この文字列の真下が望ましいですが 心配な方はCSSソースの末尾にでも追加してください

ハンドルネームの一番最初が「記号」の方がいらっしゃるかもしれません
★であったり♪であったり
この場合にはおすすめしません
classネームの文頭に記号を用いてはいけない というルールが存在するためです
その場合は無理なさらず コメント時だけ記号を抜くとか
はじめから使用しないかのいずれかをおすすめ ^^;

------------- 追記 2015.11.28

ご利用頂けない場合の説明補足です
使えないハンドルネームのパターンは以下の通り

・文字列最初の文字が「記号」
・最初の文字が「数字」
・文字列中に「-」(ハイフン)「_」(アンダースコア) 以外の記号(全角・半角スペース含む)


------------ 以下本文







とりあえず今回の Paradiso テンプレでのやり方でした
他のテンプレに関しましては 位置的な操作が必要になってきたり
場合によってはfloat(左右に寄せる) 処理やpadding あるいは margin 等
ちょっと専門的で難解かもしれませんので 簡単に書くのが大変でございます(笑)
今後同じようなテンプレ内容の場合には 今回のように記していきます
くれぐれも 他制作者様テンプレへの適用についてのご質問はお控えくださいませー (´・ω・`)
関連記事

Comments 10

tak  

アイコン

お世話になっております。
訪問者と管理人コメントアイコンを変えてやってみました。
http://sgourmet.blog94.fc2.com/blog-entry-2158.html#community
でもいいアイコンが中々作れないです。。。

もしよろしければデフォルトで設定されている切手アイコンの色違いなど
ございましたら使用させていただければ幸いです。

よろしくお願いいたします。

2015/05/31 (Sun) 00:58 | EDIT | REPLY |   

Akira  

To takさん

こちらのページで配布していますよe-257
ZIPファイルの上にあるものがそうです。

http://vanillaice000.blog.fc2.com/blog-entry-184.html

デフォルト画像と若干の柄違い、色味も少し変えてあります。
ドラッグ&ドロップで保存してお使いくださいませ。

2015/05/31 (Sun) 09:49 | EDIT | REPLY |   

sawa  

いま設定中のテンプレのことで・・・

いつもお世話になっております。

いま設定中のテンプレのことなんですけど、iPhone6(iOS8.3)で閲覧の時に、RSSアイコンをタップすると画面が真っ白になって何も表示されません (;^_^A
PCからは問題なく表示されます ^^

この新しいテンプレ、スマホでサイドバーがスルスルっと横から出て来て、記事欄下に表示されるタイプよりも個人的に好きです~ ^^
是非お早めにリリースお願いします~♪

あっ こちらに書き込んでよかったのでしょうか? (;^_^A アセ

2015/05/31 (Sun) 11:25 | EDIT | REPLY |   

tak  

あっ、見つけました!
ありがとうございます。

2015/05/31 (Sun) 11:33 | EDIT | REPLY |   

Akira  

To sawaさん

ご不便をおかけしております。
今設定中のテンプレ
というのはどれのことやろ(笑)
今からお邪魔して確認しますね。

RSSアイコンは私が用意したものかしら。
それともご自分のかしら。

とりあえずお邪魔しますね。
しばしお待ちくださいませ

2015/05/31 (Sun) 11:47 | EDIT | REPLY |   

Akira  

To takさん

お気に召すと良いのですけれどー!
ともかく一度ご利用頂いて、もしアレでしたらご意見ください(笑)

2015/05/31 (Sun) 11:48 | EDIT | REPLY |   

Akira  

To sawaさん

sawaさんのとこ飛べないじゃん!(笑)
目視確認しないことにはなんとも… ( ̄∀ ̄;)
鍵付きで良いのでURLお願いします(笑)
アダルトでも大丈夫ですよ。
アダルト許容度は低い方ではありません ←

それか「今設定中のテンプレ」というのは、私のこれのことかしら。
まだ製作中なもので、ところどころ不備があるかと思いますー。
それのこと?(笑)
スマホからの動作を教えてくださった、ってことかな?
とっても助かりますー!
ありがとうです

2015/05/31 (Sun) 11:52 | EDIT | REPLY |   

Akira  

To sawaさん

えっとー!スマホではRSSアイコン非表示にしました。
スマホだとリーダー要るから不要ですよね (´・ω・`)
sawaさんグッジョブ。素敵!
ありがとう ヽ(´・`)ノ

2015/05/31 (Sun) 12:35 | EDIT | REPLY |   

sawa  

やっぱり(笑)

あっ やっぱりRSSアイコンが消えた(笑)

そうで~す、Akiraさんがテスト表示中の今のテンプレのことでした ^^

ハーイ(^O^")/ どう致しまして~(笑)

2015/05/31 (Sun) 13:00 | EDIT | REPLY |   

Akira  

To sawaさん

あう (*∩ェ∩).・:*。・:*:・゚'
またお気づきの点あればガシガシ教えてくださいませ(笑)

んでもって、こちらのテンプレは
いち、にぃ… 三個あとぐらいに申請予定でございま ( ゚Д゚)ノ

2015/05/31 (Sun) 13:17 | EDIT | REPLY |   

Leave a reply

テンプレートに関するご質問・不具合のご報告の際はご自身のブログアドレス記載必須です
ご質問の前に必ずお読みください ↓
FC2テンプレート ご利用時のお願い
利用上のお願い (3)
ご質問の前に (2)
よくあるご質問 (1)
FC2不具合情報 (15)
割と重要なお知らせ (34)
テンプレート (68)
ブログ内限定配布 (6)
リリーステンプレート早見表 (1)
テンプレート固有機能説明 (1)
配布終了・旧作 (5)
テンプレ不具合・修正など (57)
カスタマイズ (90)
SNS (5)
FC2ブログのあれこれ (21)
webのあれこれ (8)
装飾枠 (3)
装飾枠使い方とお願いごと (1)
雑記 (32)
洋楽 (103)
50 Cent (1)
Akon (1)
All American Reject (1)
Amy Winehouse (1)
Andain (1)
A Perfect Circle (1)
Aura Dione (1)
Balint Adam (1)
Billy Talent (1)
Bliss (1)
Boyce Avenue (1)
Breaking Benjamin (3)
Breathe Carolina (1)
Catfish And The Bottlemen (0)
Damien Rice (2)
Danny Elfman (1)
Dave Matthews Band (1)
David Lee Roth (1)
Death Cab For Cutie (1)
Diary Of Dreams (2)
Digital Summer (1)
Disturbed (3)
Drowning Pool (1)
Eminem (1)
Five For Fighting (1)
Flo Rida (2)
Fort Minor (1)
Get Scared (2)
Goodnight Nurse (1)
Gotye (1)
Hoobastank (1)
InMe (1)
Ivy (1)
Jamiroquai (3)
Jeniffer Lopez (3)
Jet (1)
Kelly Clarkson (1)
Kelly Sweet (0)
Kula Shaker (1)
Late night almuni (4)
Led Zeppelin (1)
Lenny Kravitz (0)
Limp Bizkit (3)
Linkin Park (1)
Lorde (1)
Lou Reed (2)
Magic! (1)
Maroon 5 (1)
Michiko (1)
Mindless Self Indulgence (1)
Mindy Gledhill (0)
Miss Jane (1)
Muse (2)
N.E.R.D. (1)
Nickelback (1)
Nirvana (1)
Oasis (1)
Panic! At The Disco (1)
Papa Roach (1)
Pharrell Williams (1)
Radiohead (1)
Rage Against The Machine (1)
Red (1)
Red Hot Chili Peppers (3)
Rhye (2)
Rumer (1)
Sade (1)
Sarah Brightman (1)
Shakira (1)
Sixpense None The Richer (0)
Soulja Boy (1)
Steven Cooper (1)
Sting (1)
Sum 41 (2)
Taio Cruz (1)
The Fratellis (0)
The Pretty Reckless (1)
The Weepies (1)
Three Days Grace (1)
Tom Waits (2)
Travie McCoy ft. Bruno Mars (1)
TRUSTcompany (1)
Ty Stone (1)
U2 (1)
Westlife (1)
未分類(個人的テスト等) (48)