So-net無料ブログ作成

サイドバーを右に [▼ブログ管理]

So-netブログでサイドバーを右に置く方法がわかりました。
初心者にもわかるように簡単に解説してみます。

※2006.12.19のメンテナンスに伴って下記若干変わりました。末尾を見てね!

1.サイドバーの設定画面までたどりつく

「管理ページ」→「設定」→「サイドバー」とクリックしていってください。

ここまで何とかたどり着けたら次へ。



2. カスタムペインを開く

サイドバーの項目には「カスタムペイン」といって、好きな画像やコメントを書くことが
できる欄があります。
(詳細はこちら http://blog.so-net.ne.jp/blog-help/custompane

どのカスタムペインでもいいですから、ひとつ選んで、
カスタムペイン内のどこかに以下の4行の「呪文」を書きます。

<style type="text/css"> #main { float: left; } #side { float: right; } </style>


私の場合はカスタムペインの1つを「おしらせ」用に使ってましたので、その下に追記し
てみました。この呪文自体は「自分のブログ」には表示されません。
書き終わったら「保存」をクリックして、サイドバーの設定画面(上記1)に戻ります。
おしまいに、いま変更したカスタムペインの横の「表示」というボタンをクリックします。
すでに表示されているときは「表示」ボタンはないです。そのままでかまいません。




3. 「自分のブログ」を確認してみる。

するとあら不思議、サイドバーが右側に!
もし右側に現れないようでしたら、ブラウザーを「最新情報に更新」してみてください。
たぶんF5キーを押せばよいでしょう。


ちなみに、もしも呪文を打ち間違ったりして画面が変になったら困りますよね。
そんなときのために、設定用のウィンドウと、表示確認用のウィンドウを2枚開いておくと
便利です。設定を変更した後は、確認用ウィンドウを「最新情報に更新」=F5キーを押せ
ばよいでしょう。設定用のウィンドウは残ったままなので安心して元の設定に戻せます。

どうでしょう?できました?
雰囲気がかわりますよね~

人気ブログランキングへ

サイドバーの位置変更は他のブログでは標準装備されてますが、
ソネブロにはないですからね。
でもソネブロは入力画面・管理画面の機能やデザインが他のブログに比べて圧倒的にシン
プルなので好きです。こんなちょっとした技でカスタマイズできますしね。

追記1:
この方法、すでに紹介されてました!こちらもみてね!
http://blog.so-net.ne.jp/youmode/2006-06-06
ソネブロでたまにみる「コメントでの絵文字」の元サイトでもありました。フムフム。

追記2:
サイドバーの下のほうに記事が表示される場合は「呪文」を次のように変えてみてください。
-190は「記事を本来の位置から左に190ピクセルずらす」という意味、560は「サイドバー
を560ピクセル右にずらすという意味です。数字はお好みで変えてみてください。

<style type="text/css"> #main { position:relative;left:-190px; } #side { position:relative;left:560px; } </style>

追記(12/19)
ソネブロのメンテナンスに伴って、サイドバーを右にする方法がちょっと変わりました。
上記2の「#side { float: right; }」 の部分を「#side-a { float: right; }」
と書き換えてください。
また追記2を使用されている場合は、「#side { position:relative;left:560px; }」
の部分を 「#side-a { position:relative;left:560px; }」
と書き換えてください。



追記(2007/1/24)
So-net Blogの機能アップにより上記の方法では右サイドバーにできなくなりましたが、
右サイドバーはオフィシャルにサポートされるようになりましたね。ソネブロさん、ありがと!


nice!(19)  コメント(19)  トラックバック(2) 
共通テーマ:学問

nice! 19

コメント 19

SWING

こんにちは~!
わかりやすいご説明、Nice!です。ありがとうございました。
by SWING (2006-10-07 18:49) 

MANTA

- いえいえ、元はといえばSwingさんのアノ書き込みのおかげですから!
記事にさせていただいた、という感じです。
by MANTA (2006-10-08 11:33) 

honyapin-turedure

はじめまして! Blog教室から飛んで?きました。
おもしろそうなので、ためさせてもらいますネ♪
by honyapin-turedure (2006-10-21 21:07) 

MANTA

- ありがとうございます。ぜひ参考にしてください!
by MANTA (2006-10-21 23:21) 

moon9

初めまして。結城と申します。
ブログ教室からMANTA さんのブログに来ました。
「サイドバーを右に」設定する方法さっそくやってみました。
分かりやすい説明で、タグなどよく分からない私ですが、
上手く出来ました。

これからも楽しみにしております。
では失礼いたします。
by moon9 (2006-10-23 10:13) 

MANTA

- 結城さん、はじめまして!Nice&TB、ありがとうございます。
ページ拝見しました。ちゃんと右になってますね!よかったぁ、お役に立てて。
<style… ~/style>の部分をいじると、背景の色を変えたり、マージンを変えたり、他にもいろいろできるようですのでお試しください!
by MANTA (2006-10-23 12:47) 

a-_-b

私もブログ教室から飛んできました。コメント遅れてごめんなさい。
サイドバーの設定方法とても参考になりますね。
今後もお邪魔しま~す。
by a-_-b (2006-11-08 00:13) 

MANTA

- コメント&Niceありがとうございます!>てんてんさん
今度は「書きかけの記事を飛ばさない方法」をUPする予定です。
またお越しください!
by MANTA (2006-11-08 07:11) 

inuesgk_blog

な~るほど~!最近はじめたんでわからないことだらけで…。(^ ^;)
参考にさせていただき、ほんと助かりました。
ありがとうございました。
by inuesgk_blog (2006-12-06 02:04) 

MANTA

- Nice&コメント、ありがとうございます。おためしあれ!
by MANTA (2006-12-06 12:34) 

ka-mi

早速やってみました!無事、サイドバーが右側へ!!!
ありがとうございます。
(トラックバックさせていただきました~)
by ka-mi (2006-12-10 23:42) 

MANTA

- コメントありがとうございます。みんなでいろいろ試しましょう!
ソネットさんも公式にデザインカスタマイズに応じてくれるそうですね。
http://blog.so-net.ne.jp/blog_wn/2006-12-06-2
by MANTA (2006-12-11 01:00) 

MANTA

- おお、Niceが10個になりました > さくやさん さんきゅーです。
みなさま、さんきゅーです。
by MANTA (2006-12-13 07:43) 

ともきち33

はじめまして。
Blog教室から伺いました。
サイドバー見事に右に移りました。素敵な呪文ありがとうございました。
by ともきち33 (2006-12-22 12:51) 

MANTA

- お役に立てて幸いです!>ともきち33さん
ページトップのデザインも変えられているんですね。すばらしい!
by MANTA (2006-12-23 13:06) 

ころくま

右側サイドバーの方法、参考にさせていただきました。
ありがとうございました。
by ころくま (2007-01-11 17:36) 

Michelan

はじめまして!
Blog教室からこちらへ来ました。早速、右側にしました!
ありがとうございました!!
by Michelan (2007-01-13 14:49) 

keito

はじめまして。
ブログ教室から来ました。
早速右側に移動させて喜んでいます♪
ありがとうございました!
by keito (2007-01-14 16:33) 

MANTA

Niceありがとうございます!>ころくまさん、Tagediebさん、keitoさん
お役に立てて幸いです。ブログのちょっとした工夫もちょいちょい載せます
ので、またお越しください~
by MANTA (2007-01-21 23:28) 

コメントを書く

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

トラックバック 2

メッセージを送る