SSブログ

Playlog風のブログスキンのご紹介 [Playlogと愉快な仲間たち]

PlaylogメンバーのR8さんが作成されたPlaylog風の
スキンを紹介したいと思います。


Capture2.jpg



いやー、本当に素晴らしいですね (人´ω`)

R8さんのブログにおじゃました時に、
あまりの再現性の高さにメチャメチャ興奮しました(笑)


щ(゚д゚щ)カモーン(笑)


おそらく同じように感じる方も多いと思いますので、
R8さんの了解を頂いて、アップさせて頂きます。



ちなみにSo-netのブログスキン(CSS)は直接
編集できるようになっていますが、So-netさんは
ヘルプの注意書きで、


スタイルシートの記述方法につきましては、
So-netではサポートを行っておりません。 
知識のある方のみ編集等を行なって頂きます
ようお願い致します。


まぁ、「勉強しろよな(゚Д゚)ゴルァ!!」
という意味なんでしょう(笑)

僕はもちろん分かりません(´・ω・`)
(10年くらい前にHPをHTMLで作りましたけど、
 忘却のカナタです(笑))


前置きが長くてスミマセン。
ということで、スキンの替え方です。

  1.  
    1. R8さんの「シンプルにPL風」という記事を訪れる
    2. スタイルシートをGet(コピー)する
    3. 自分のブログのデザイン設定に3カラム両の設定ができるスキンを追加する。
    4. 追加したCSSシートの中身にR8さんのソースを貼り付ける。
    5. そのデザインを適用する

これだけなのですけど、おそろしく分かりにくいです。

PCでのやり方を動画にしましたで、
分からなかったら見てみて下さい。





それではGoodラック!!!
(言うほど難しくありません。落ち着いてやれば大丈夫です)

というかYou tubeが貼り付けられなくて焦りまくりです(;`O´)/(笑)


R8さん、本当にありがとうございました。
これからもよろしくお願いします。

追記 --------------------------------------

R8さんがヘッダの透明化について記事をあげられました。
ばっちし透明になりましたヾ(*ΦωΦ)ノヒャッホウ

R8さん、何から何までありがとうございます(≧▽≦)/


nice!(79)  コメント(55)  トラックバック(0) 
共通テーマ:PLAYLOG

nice! 79

コメント 55

neopon

ハイ、チャーリー!
ふむふむ、なるほどなるほど。
でもニオは3ペインはあまり好きじゃないからやるつもり今のところないんだけどね。(笑)
ところで、HTMLタグが丸見えなのはなぜなんだぜ。
by neopon (2011-04-02 22:03) 

ヒサ

やあ、ニオ(≧▽≦)/

You tubeがうまく貼り付けられないんだ(´・ω・`)ショボーン

どうすればイイんだろ(; ・`д・´) (汗笑)

by ヒサ (2011-04-02 22:08) 

亀仙人たかよし

リッチテキストエディータを使わなければPLと同様です。

管理設定→設定→リッチテキストエディータを使わない様に設定で使える筈です。

お試しあれ。(^_-)-☆
by 亀仙人たかよし (2011-04-02 22:16) 

カルメン

やり方を動画にしてしまうヒサさんも、すごいです[__グッド]

記事のトップも蒼くするには、どこをどう書き換えればいいですか?

ちなみに僕も悪戦苦闘して、ヘッダに画像を入れてみましたよ。[__グー][__あせあせ]

基本コンテンツ→ブログタイトル→挿入テキスト(下部)に
画像を貼り付けました。
(横幅は780pxがいいかも知れません)
(縦幅は162pxでやってみました)

by カルメン (2011-04-02 22:28) 

MURAMASA-X6

これはすごいです!!
ホントにPLAYLOGそのものですね(≧∇≦)

by MURAMASA-X6 (2011-04-02 23:04) 

こーいち

R8さんも凄いですが、それをさらに解りやすくしたヒサさんも凄い[__グー]

PLAYLOG風、落ち着きますね~~[__わーい]
by こーいち (2011-04-02 23:11) 

みー☆

びっくりしました!本当に素晴らしいですね!ヒサさんをはじめ、PCいろいろできる方尊敬します(*^_^*)
by みー☆ (2011-04-02 23:11) 

ituki

えっ 結構新居気に入ってるのに^^;
どーせ さぱーりだから さみしくなったら癒されに来るよ 笑

がんばっちぇね~^^[パー]
by ituki (2011-04-02 23:25) 

boba

やぁ、チャーリー(≧▽≦)/

すごいねぇ。。。

一瞬、ここのページに来た時、目をゴシゴシしちゃったよ(^^ゞ

花粉症だから、余計にかゆくなっちゃった(爆)

時間がメチャクチャあるときに考えるね(笑)


by boba (2011-04-02 23:30) 

ひね

せっかくYouTubeつくって、貼りつかなかったときのあせりまくる様子が目に浮かびます(笑)

by ひね (2011-04-03 00:00) 

メゾピアノ

は~い、チャーリー\(≧▽≦)/

すごい!すごい!

R8さんも凄いし、こんな動画作っちゃうチャーリーもすごい!

思わず蟹を送りた・・・(笑)


by メゾピアノ (2011-04-03 00:00) 

ヒサ

> 亀仙人タカヨシさん

=========
リッチテキストエディータを使わなければPLと同様です。
=========

アドバイスありがとうございます。助かりました(≧▽≦)/

リッチ・テキストは簡単に扱えるので好きなのすけど、
やはりHTMLの直打ちにチャレンジかな・・・



> やまびこさん

=========
記事のトップも蒼くするには、どこをどう書き換えればいいですか?
=========

ちなみに記事の部分は、このように設定しています。

/* Articles */

#main{
float: left;
width: 372px;
margin-left: 12px;
}

.articles{
border-left: 1px solid #09f;
border-right: 1px solid #09f;
background: #fff;
overflow: hidden;
}

.articles-top{
height: 3px;
margin-top: 12px;
background:url("/_images/blog/_57c/charllie-hisa/m_article_top2.png") no-repeat;
}

.articles-title{
padding: 1px 11px;
font-size: 13px;
color: #fff;
background: #09f;
}

.articles-title a{
color: #fff;
}

.articles-body{
padding: 23px 12px 0;
}

.posted{
padding: 0 12px;
}

.articles-bottom{
height: 3px;
margin-bottom: 12px;
background:url("/_images/blog/_57c/charllie-hisa/m_article_bottom2.png") no-repeat top;
}


青色の指定は#09fです。
上記の箇所をコピペすれば、青くなるはずです(^o^)v

=========
基本コンテンツ→ブログタイトル→挿入テキスト(下部)に
画像を貼り付けました。
(横幅は780pxがいいかも知れません)
(縦幅は162pxでやってみました)
=========

もともと、ブログのタイトル画像は貼り付けて
いなかったので、今回もやらない予定です。
今のところ・・・(;・∀・)



> MURAMASAさん

いや、ホントにR8さんはスゴイと思います。
本職の人なんですかね?( ̄∀ ̄;)

by ヒサ (2011-04-03 02:28) 

ヒサ

> こーいちさん

=========
PLAYLOG風、落ち着きますね~~
=========

落ち着きますよね~ (人´ω`) (笑)



> みー☆さん

=========
びっくりしました!本当に素晴らしいですね!ヒサさんをはじめ、PCいろいろできる方尊敬します(*^_^*)
=========

いやー、そのうち何でもできるようになりますよ。
きっとなれるはずです。
なれるんじゃないかな・・・(汗)

頑張りましょう(≧∇≦)b



> itukiさん

イッチー(≧▽≦)/

=========
えっ 結構新居気に入ってるのに^^;
=========

無理にプレログのスタイルにすることはないと思うよ。
イッチーのスタイルもオシャレで良いよね (≧ω≦)b

by ヒサ (2011-04-03 02:34) 

ヒサ

> bobaさん

やあ、ボビー(≧▽≦)/

=========
一瞬、ここのページに来た時、目をゴシゴシしちゃったよ(^^ゞ
花粉症だから、余計にかゆくなっちゃった(爆)
=========

(つд⊂)ゴシゴシ はこの季節ダメだよ~(笑)


=========
時間がメチャクチャあるときに考えるね(笑)
=========

きっと来ないような気がする(笑)
どうしようもなくスタイルを変えたくなったら
連絡してちょ~(≧▽≦)/



> ひねさん

=========
せっかくYouTubeつくって、貼りつかなかったときのあせりまくる様子が目に浮かびます(笑)
=========

や、やだな~ (; ・`д・´)ファイナル・アンサー?

正解ですOrz



> メゾピアノさん

やあ、レミー(≧▽≦)/

=========
思わず蟹を送りた・・・(笑)
=========

いつでも待ってるよ~~~~(≧▽≦)/(笑)


by ヒサ (2011-04-03 02:40) 

うりこ

すごいですねぇ。
ページ認証で悩みまくっている私とはレベルが違いすぎます(^_^;)

by うりこ (2011-04-03 08:25) 

カルメン

青色の指定は#09fなんですね[OK]
一度チャレンジしてみます。ありがとうごさいます。


ヘッダは、実は僕も無いなら無い方が、すっきりしてていいかな?なんて思っています。意外でしょ?(笑)
外国のブロガーで、そういうデザインを見かけたりします[目玉]
by カルメン (2011-04-03 08:58) 

R8

動画が素晴らしくて何度も見てしまいました。
これで私もYouTubeデビュ~?!(笑)

中央は青い方が人気ありそうなので、やっつけ仕事で変更しました(汗) 一応、青い画像も用意していたので・・・

ご紹介ありがとうございました♪

by R8 (2011-04-03 09:34) 

ほのかまま

明日また見に来ますね(●´mn`)タノシミ~!
by ほのかまま (2011-04-03 10:03) 

D-renp

ある意味俺からすると、R8さんも、ヒサさんも、
別次元の人みたいです∑( ̄ロ ̄|||)。

素晴らしいです(≧∇≦)ъ ナイス!。

それにしてもヒサさんの動画はやっぱ良いなぁ!!!
by D-renp (2011-04-03 10:35) 

たけ

いやーこの動画は素晴らしいですね!
これならCSSって何??な人でもできそうです。

R8さんにはほんとに助けられましたよ~
なんせ自力じゃ、ヘッダー変えるのがやっとでしたから(笑)
だから、アメブロの別館なんてヘッダーだけplaylog[汗汗][汗汗]
by たけ (2011-04-03 11:03) 

夜空の鷹

やっぱりこの方が落ち着きますね ^^ ♪

確かに、youtube のハッシュタグを張り付けても表示されませんね^^;なにか設定を変えないとだめなんでしょうかね?


by 夜空の鷹 (2011-04-03 11:54) 

りなみ

(*^^)//。・:*:・゚'☆,。・R8さんとチャーリー、素晴らしいです!プレイログそのままだね。

(´▽`;)ゞ

私には、できないな。。。 (笑)

(*^^)v 訪れて楽しみます。

(人´ω`)動画の音楽がよかった。。。
by りなみ (2011-04-03 12:23) 

vega

いいなぁ~…
by vega (2011-04-03 13:10) 

くわっぱ

凄いです! 凄いです!
とても分かりやすい解説、ありがとうございます[__!!]

パソコンにはかなり疎いのですが、この動画を見ながらやると、サクッと変更できました[__わーい][__ぴかぴか]

やっぱりコレが一番落ち着きますね[__温泉]
by くわっぱ (2011-04-03 14:36) 

ごろべ

今携帯からなので明日にでもPCから参考にさせていただきます。
by ごろべ (2011-04-03 18:39) 

土偶

早速参考にさせて頂きました♪
けど一番上のSo-netロゴの行が縞々にならないですね・・・
by 土偶 (2011-04-03 19:34) 

マチャ

お二人ともすご~い!
動画保存しましたので、あとでゆっくり鑑賞します!

by マチャ (2011-04-03 21:45) 

けけろん

ほんまにすごい すごい すごすぎる
ただただ脱帽[目玉]
by けけろん (2011-04-03 22:18) 

ニゲラ

ああ、なじみ深い故郷に帰った気がします。
『PL何もかも 皆なつかしい』
私まだ広告と戦っています(´;ω;`)
by ニゲラ (2011-04-03 22:43) 

ヒサ

> うりこさん

=========
ページ認証で悩みまくっている私とはレベルが違いすぎます(^_^;)
=========

いえいえ、僕も悩みまくっています。
何にも変わりませんよ~



> カルメンさん

=========
ヘッダは、実は僕も無いなら無い方が、すっきりしてていいかな?なんて思っています。意外でしょ?(笑)
外国のブロガーで、そういうデザインを見かけたりします
=========

カルメンさんのヘッダの写真がリアル過ぎて困ります。
ボタンの所をポチポチしてしまいます(笑)



> R8さん

=========
動画が素晴らしくて何度も見てしまいました。
これで私もYouTubeデビュ~?!(笑)
=========

ぜひYou tubeデビューして下さい(≧▽≦)/
というか4年前と比べて、You tube人口が
メチャ増えたので、あまり自分でアップする必要が
なくなりましたけど(;・∀・)(笑)

=========
中央は青い方が人気ありそうなので、やっつけ仕事で変更しました(汗) 一応、青い画像も用意していたので・・・
=========

ありがとうございます。
早速使わせて頂きました<(_ _)> (笑)

記事の本文というか、You tube画像は直すのが
少し大変なので、このままでいさせて下さい。
きっと訪問された皆様もそのままコピペすると
思われますので、実害はないかと・・・

=========
ご紹介ありがとうございました♪
=========

こちらこそありがとうございました(≧▽≦)/
ヘッダの透明化も教えて頂いて感謝です。


by ヒサ (2011-04-03 23:39) 

jiru

なんか皆さんすごいですね!
なんて言うか職人だよな~

暗号みたいでさっぱりワケワカメです(笑)
by jiru (2011-04-03 23:45) 

ヒサ

> ほのかままさん

=========
明日また見に来ますね(●´mn`)タノシミ~!
=========

ありがとうございます(≧▽≦)/
So-netの重さといい、
みなさまの記事上げの激しさといい、
怒涛のように押し寄せるコメントといい、
なんらプレイログを変わりませんOrz (笑)



> D-renpさん

=========
ある意味俺からすると、R8さんも、ヒサさんも、
別次元の人みたいです∑( ̄ロ ̄|||)。
=========

いえいえ、D-renpさんにも教えられることは
多いです。ありがとうございます(≧▽≦)/

=========
それにしてもヒサさんの動画はやっぱ良いなぁ!!!
=========

( ̄□ ̄;)!! 普通のPC画面なのですけど・・・(笑)



> たけさん

=========
R8さんにはほんとに助けられましたよ~
なんせ自力じゃ、ヘッダー変えるのがやっとでしたから(笑)
=========

R8さんには足を向けて眠れません。
というかどちらに住まわれているんだろう(;・∀・)
向けていたらゴメンナサイ<(_ _)>


by ヒサ (2011-04-04 00:00) 

ヒサ

> 夜空の鷹さん

=========
確かに、youtube のハッシュタグを張り付けても表示されませんね^^;なにか設定を変えないとだめなんでしょうかね?
=========

リッチテキストを使われていらっしゃいますでしょうか?
実緒たんさんの記事が参考になると思います。

http://miotan-toma.blog.so-net.ne.jp/2011-04-02-1



> りなみさん

やあ、リーナ(≧▽≦)/

=========
私には、できないな。。。 (笑)
=========

PCをメインに使っていないと、分からないよね。
機会があったらぜひ予備にチャレンジしてみてね~

=========
(人´ω`)動画の音楽がよかった。。。
=========

009 Sound systemのwith a spiritという曲だよ。

AmazonのMP3ダウンロードで150円だよ~(笑)(笑)

http://www.amazon.co.jp/gp/product/B003XL06XY/ref=oss_product



> vegaさん

=========
いいなぁ~…
=========

何かの機会があったらぜひ (人´ω`)


by ヒサ (2011-04-04 00:08) 

natural_honey

ふぅ~。やっとヒサさんにたどり着きました^^;

すごいですね!
こんなにそのまま再現できるとは感動しました。(笑

あ、これからもぼちぼちよろしくお願いします。
m(_ _)m

by natural_honey (2011-04-04 00:09) 

ヒサ

> くわっぱさん

=========
パソコンにはかなり疎いのですが、この動画を見ながらやると、サクッと変更できました
=========

それは良かったです(*TーT)b



> ごろべさん

=========
今携帯からなので明日にでもPCから参考にさせていただきます。
=========

わざわざありがとうございます(≧▽≦)/



> 土偶さん

=========
けど一番上のSo-netロゴの行が縞々にならないですね・・・
=========

記事の本文にも追記しましたけど、R8さんが
ヘッダ透明化の呪文を公開してくれました。

http://rtz.blog.so-net.ne.jp/2011-04-03

やはりこだわる僕達にとっては、気になってしょうが
ないですよね(; ・`д・´) (笑)


by ヒサ (2011-04-04 00:24) 

ヒサ

> マチャさん

やあ、マーシー(≧▽≦)/

=========
動画保存しましたので、あとでゆっくり鑑賞します!
=========

大したことをしていないけど(汗)、
ありがとう(≧▽≦)/



> けけろんさん

=========
ほんまにすごい すごい すごすぎる
=========

もっと言ってくれーーーーщ(゚д゚щ)カモーン (ウソ笑)



> ニゲラさん

=========
『PL何もかも 皆なつかしい』
=========

いやー、でもそのまま引っ越してきちゃった感じです。
細々とやっていこうと思っていたのですけど(笑)

=========
私まだ広告と戦っています(´;ω;`)
=========

いつか霧が晴れる時が来ると信じています(´;ω;`)(笑)



> jiruさん

=========
暗号みたいでさっぱりワケワカメです(笑)
=========

本当に公開された暗号なのだ(`・ω・´)m9
(意味不明(笑))


by ヒサ (2011-04-04 00:34) 

ヒサ

> naturalhoneyさん

こちらでもよろしくお願いします~
無理しない程度に楽しんでいきましょう(≧▽≦)/


by ヒサ (2011-04-04 00:35) 

ばんばらばん

これはスゴイ[__ぴかぴか][__ひらめき][__ぴかぴか]

それと・・・
私もYoutubeの貼りつけで、不眠症に陥りそうでした・・・[__ふらふら](といいながらたぶんイビキをかいて寝ていたであろう[__眠い])
何度トライしても、アルファベットの羅列が
ズラ~~~っと並ぶ[__パンチ]

でも、コメント欄を読んで、解決しましたゼ[__ひらめき]
ものすごい便秘が解消したようなスッキリ[__晴れ]した気分だゼ[__チョキ]
ありがとうございました[__るんるん]
by ばんばらばん (2011-04-04 23:52) 

ヒサ

> ばんばらばんさん

おお、You tubeの貼り付けできるようになりましたか(≧▽≦)/<br>

良かったです (人´ω`)<br>
by ヒサ (2011-04-05 01:03) 

柴っち

ヒサさん[__ひらめき]
どうもありがとうございます[__ぴかぴか]
パソ音痴の私でも、こちらのおかげで出来ました[__!]
いやー素晴らしい[__ぴかぴか]
これで、PLAYLOGと変わることなく続ける事ができて
嬉しい限りです[__揺れるハート]
by 柴っち (2011-04-05 09:23) 

ヒサ

> 柴っちさん

良かったです[__ぴかぴか]。
このレイアウトで体を慣らしてから、
他のデザインに変えるのも良いかなぁ、と思っています
(≧▽≦)/

by ヒサ (2011-04-05 23:46) 

さみぃ☆

きゃい~ん!
また改めてパソコンから出直します!
by さみぃ☆ (2011-04-06 20:00) 

うまお

どもどもです。

素敵な紹介記事をありがとうございます♪
by うまお (2011-04-06 20:39) 

ヒサ

[__るんるん]柴っちさん

=========
これで、PLAYLOGと変わることなく続ける事ができて
嬉しい限りです
=========

いやー、良かったです。
R8さんに感謝ですね(≧▽≦)/

by ヒサ (2011-04-10 04:07) 

ヒサ

[__るんるん]さみぃ☆さん

=========
きゃい~ん!
=========

さみぃ☆さんのレスポンスはいつも面白いですね(;・∀・)(笑)
by ヒサ (2011-04-10 04:08) 

ヒサ

[__るんるん]うまおさん

またここで、うまおさんと交流できてうれしいです(≧▽≦)/[__揺れるハート]
これからもよろしくお願いしますね。

by ヒサ (2011-04-10 04:09) 

2tom

チャーリー、ありがとー[__わーい]

僕もやってみたよ。[__グッド]

動画で、わかりやすかったよ。[__TV]
by 2tom (2011-04-17 13:49) 

ヒサ

[__るんるん]2tomさん

やあ、トム(≧▽≦)/

無事Playlog風に変えられたみたいだね。
良かった(≧∇≦)b

by ヒサ (2011-04-17 21:10) 

いてる2

スマホからみるとわかりにくいんですが。。(まったくわからないwごめんなさい)
でも、すごいですよね
R8さんって何物なんでしょうねw


by いてる2 (2011-04-24 22:18) 

ヒサ

[__るんるん]いてる2さん

==========
スマホからみるとわかりにくいんですが。。(まったくわからないwごめんなさい)
==========

スマホでは、この記事の動画はキツイですね。
スミマセン<(_ _)>


==========
でも、すごいですよね
R8さんって何物なんでしょうねw
==========

謎の多い方ですよね(; ・`д・´) (笑)

by ヒサ (2011-04-24 22:39) 

愛


いきなりすいません;

うわぁ、凄いです!
分かりやすい動画ありがとうございます*

私もやってみます!

by (2011-04-30 00:07) 

ヒデ

分かりやすい動画ありがとうございました!
PLAYLIOG風のブログになってとても嬉しいです♪
by ヒデ (2011-05-19 00:41) 

チッチッケ

R8さんも凄いですが、ヒサさんの動画も凄いです~[__がく~]
私も最近、色々と設定変更してますが、パソコン知識がない私には、なかなか難しいです[__もうやだ~]

やっぱりPlaylog風が落ち着きますね~[__わーい]

by チッチッケ (2011-07-03 23:33) 

kikuchan

ヒサさん
Youtube動画、すごく参考になりました。
今日から懐かしいPL風となりました。

感謝です。
by kikuchan (2012-03-31 08:14) 

ヒサ

[__るんるん]kikuchanさん

すこしでもお役に立てて良かったです。
でも本当にR8さんがスゴイんです(;・∀・) (笑)

by ヒサ (2012-03-31 12:42) 

コメントを書く

お名前:
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

Facebook コメント

トラックバック 0

はじめましてShe is a professiona.. ブログトップ

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。