解決済
横一列カレンダーはできないでしょうか?
他のブログサイトのテンプレートでよく見かける本文上あたりにある横一列のカレンダーを
ライブドアのブログで作るのは
無理でしょうか?(ノ∀;`)
いい方法ありましたらご回答お願いしますm(_ _)m
ちなみにCSSの方はとりあえず作ってあるので
あとはHTMLタグの方が問題なのですが・・・・・
回答(4)
4.

ただ一列にするだけなら、trをinlineにすれば一列になりますが、サイドバーの中にあることが大きな問題です。なので、サイドバーから取り出して、本文の上あたりにコピーして、そこにスタイルを設定する方針でいきます。手順は以下の通りです。
1.HTML中にコピー先の入れ物を記述する
カスタマイズ/管理→デザインの設定→カスタマイズ→トップページと辿ってトップのHTMLテンプレートを出しましょう。
<div id="blogcontainer">
の手前に、
<div id="newcalendar"></div>
を記述して下さい。また、一番下の方の</body>の前あたりに、次のJSを入れて下さい。
<script type="text/javascript" src="ttp://mar.lar.jp/knowledge/calendarconverter.js"></script>
(ナレッジの仕様により、ttp→httpと置き換えて使用してください。)
[この内容で保存する]を押して保存しましょう。
2.CSSを編集する
今度は、スタイルシート(CSS)を編集します。テンプレートだけ示しますので、ご自身の好みに合わせて調整して下さい。
#newcalendar{
}
#newcalendar span.monthyear{ /* 月・年 */
font-size:10px;
}
#newcalendar a.prepost{ /* 前の月と次の月へのリンク */
font-size:10px;
text-decoration: none;
}
#newcalendar table{ /* カレンダー本体 */
display:inline;
width:80%;
background-color:#99ffff;
}
#newcalendar tr.odd{ /* 必須 */
display:inline;
}
#newcalendar tr.even{ /* 必須 */
display:inline;
}
#newcalendar td{
}
#newcalendar span.calendar{ /* カレンダーの中の数字 */
width:15px;
font-size:10px;
}
[この内容で保存する]を押して保存しましょう。
3.再構築
編集したトップページとデザイン(CSS)を再構築しましょう。
ここまでやったら、あとは確認しながらCSSを納得のいくように調整して下さい。満足したら、個別ページ、アーカイブページなども1と同じ変更をして、保存、再構築しましょう。
長々とどうもです(ノ∀;`)
試行錯誤やってみますm(_ _)m
1.

やっぱ無理っぽいすね(ノ∀;`)
2.

http://www.forest.impress.co.jp/article/2002/10/23...
ダウンロードするサイトは
Wt Series(「WtCal」ダウンロードページ)
http://www.ylw.mmtr.or.jp/~shiraki/wtseries.html
どうぞお試し下さい。
参考にしてみますm(_ _)m
3.

パク・・じゃなくて参考に試行錯誤してみますm(_ _)m
コメント(10)
カレンダーの表示は多少CGI(?,PHP?)部分も関わってきたりするから難しいかなー、と思うんですが、実際どうなんでしょう? < 詳しい人or中の人
>>#4
ちなみに、もとのカレンダーはサイドバーの下の方にでも追いやればいいと思いますが、消すなら、1のJSの記述の前に、
<script type="text/javascript">
cc_delete_original=true;
</script>
と入れると、結構見えなくなります。決して、サイドバーから削除はしないようにして下さい。適当に作ったので、CSSを結構調整しないとアレかもしれません。コメント頂ければ幸いです。
★オニキス☆さんのやり方は
つまり元々のカレンダーを横に表示してしまおう
ってことかしら?
やってみていろいろ修正してみたんですが
どうも表示が崩れますね(ノ∀`;)
>>#3
CSSを書いていらっしゃるとのことなので、急いでいたこともあって、細かいCSSは省略させて頂きました。元々のカレンダーのテーブルだけ取り出して、処理する方針です。もう少し扱いやすいように改良した方がいいでしょうか・・・。
いえ、回答1~3の上位回答者の方々が微妙だったので、勢いで回答したのですけど、責任をとって改良することにします。
>>#4
うちもその後、修正して見たんですが
ちょっと難しいですね(ノ∀`;)
日にちのリンクがうまくいかないので
日にちを省略して極端的ではありますが
月ごとのカレンダーを作ってみました(≧Д≦)ゞ
最悪これで行こうと思っていますので
あまりお気になさらずにm(_ _)m
ちなみにttp://mar.lar.jp/knowledge/calendarconverter.jsは何のJSだったのでしょうか?
>>#5
そのJSでページ内にあるカレンダーを特定して、テーブルを<div id="newcalendar">~</div>の中に吐き出しています。カレンダーにIDを振ってくれていないので、ちょっと処理が面倒なのです。。。
あ、出来るんだ。
すごいことですね。
頑張ってください。
かなり改善しました。テーブルごと撤去して表示するようにしました。
回答1の手順1のHTMLタグを以下のようにして下さい。
<script type="text/javascript">
cc_delete_original=false;
</script>
<script type="text/javascript" src="ttp://mar.lar.jp/knowledge/calendarconverter2.js"></script>
ttp→httpとして下さい。
CSSの方は、以下の通りです。
#newcalendar{
margin:0px;
padding:0px;
border:0px;
}
#newcalendar span.monthyear{
font-size:11px;
}
#newcalendar a.prepost{
font-size:11px;
text-decoration: none;
}
#newcalendar span.calendar{
margin-left:1px;
background-Color:#ff99ff;
width:20px;
font-size:11px;
}
かなりすっきり表示されると思います。しばらく↓にサンプル設置してます。
http://blog.livedoor.jp/pear0307/
★オニキス☆さんありがとう御座いましたm(_ _)m
だいぶ兆しが見えてきたので
これを元にアレンジしてみます(≧Д≦)ゞ
ところでこのJSはオリジナルで作ったのですか?

