はじめに // 配布テンプレ&利用規約
<< カスタマイズ用7 + main +
よくある質問集
えーコメントをつける方は最低でもよくある質問集はチェックしてください。この記事にコメントつけてるのに、ここに書いてある項目を見ていないとか???ってなってしまいます。 今後はここに書いてあるのに、っていうコメントを頂いた時はコメント数の氾濫を防ぐためにも解答後そのコメントを削除させて頂きます。
ユーザー助け合い掲示板にもあるんですが
目次の意味も兼ねて。随時追加予定。
自分のスキルを上げたい、1から身につけたいって人は
まずcss講座やxhtml講座を見てください。
■基本的なことである色換えや背景、文字装飾などは下のcss。
アイコン追加、不要項目削除などはhtmlと独自タグを見てください。
■具体的カスタマイズ
- ・サイドバーに折畳メニューを導入
- ・簡単リンク
- ・タイトルの左にアイコンを入れる。下線を画像にする
- ・flat系のテンプレの線をもこもこにしたい
- ・flat系のテンプレの幅を変えたい。もこもこ調整。
- ・トップページで中身がもこもこよりはみ出る(flat)
- ・タイトルと日付を横並びに(基本flat)
- ・窓の中に本文を収めたい。
- ・C-MAP アイフレもどきをやりたい。
- ・スクロールバーの変更(不親切ぎみ)
- ・上部メニューを導入
- ・写真の枠線をいじりたい
- ・バナーの枠線を消したい
- ・タイトルを画像にしたい(途中に書いてある)
- ・タイトル画を押してメニューに
- ・メニュー画面を作りたい。(子ユーザー登録)
- ・レイアウトを真ん中寄せしたい。
- ・上部の変なバーと広告その他について
- ・続きを読むを書き換える。
- ・ページ送りを設置したい
- ・新しいメニュー項目を作りたい(フリースペース)
- ・タイトル下にリンク文字列を書く
- ・検索にかかりたくない
- ・ブログのURLを変えたい!(ブログ作り直さなくてok)
- ・ブログをお休みしたい!
- ・コメントを開くともこもこ枠とずれる!
- ・トップにメニューだけ表示させる。
- ・トラブル! .entry_bodyに書いても文字の指定が反映されない
- ・トラブル! 小窓内でマウススクロールが止まる
- ・トラブル! 改行が2回で1回分に
- ・トラブル! 追記折り畳みスクリプトが動かない!
- ・トラブル! html弄ってたら崩壊した。(独自タグ関連)
カスタマイズ用8
ので、こっちでやってみました。
ついでに6と同じ上部フリースペースメニューも足した。
それだけ。ちょっとテンプレートが増えてきたので整理したいですな。
| 18:13 | Comment 32 | - |
Comment
カスタマイズ用8の
スクロールバーと記事の間の幅を
もう少し狭くすることってできますか?
もしできるなら、どこのタグ(?)を変えればいいのか
教えてください。お願いします!
| あゆみ | 2008/11/29 4:32 PM |
| tk | 2008/11/29 4:42 PM |
わかりました。やってみます!
お世話になりました@
| あゆみ | 2008/11/29 5:05 PM |
もう1つ質問があったのでよろしいですか??
h ttp://xchuxxxx.jugem.jp/?tid=6
↑の、タイトル画が窓の中に入っちゃってるんですけど、
その画像を記事の左隣に置きたいんです。
どうしたらいいでしょうか、、
よろしくお願いします。
| あゆみ | 2008/12/03 6:27 PM |
・小窓を移動させたい。
→#layoutに張った窓画の上からどれだけ隙間をあけるかをmargin-topで
左からどれだけ隙間をあけるかをpadding-leftで、指定してください。
その時#layoutと#contentsのwidthが充分な横幅ないとえらいことになります。
ってかいてありますから。タイトル画を移動させるんじゃなくて、窓を移動させるんです。
| tk | 2008/12/03 6:30 PM |
でもおかげで解決しました。
本当に本当にありがとうございます!!!
次からはしっかり読んでから質問しますね;;
| あゆみ | 2008/12/03 8:40 PM |
flatからカスタマイズ用8に変えたのですが...
たいとる画は記事の左横に持ってくることはできますか??
なかなかできないので...orz
| 綾痲 | 2009/01/15 8:48 PM |
で、#headerのwidthとheightを削除。
代わりに#layoutのwidthをもっと大きくします。
| tk | 2009/01/15 9:11 PM |
| tk | 2009/01/15 9:23 PM |
できたにはできたのですが...
周りの隙間が消せず,たいとる画と本文が重なってしまうんですよね;;;
いろんなpxで挑戦したのですが...orz
ちなみに今は750px250pxです
| 綾痲 | 2009/01/15 10:49 PM |
この差の分だけ、タイトル画より右に本文がいくことになります。
差が大きいほど右にずれるわけです。
ので#layoutのwidthを広げるか、#contentsのwidthを減らすか、ですね。
あと#layoutのmargin:250px;が隙間の原因です。
margin:0 auto;にしてみてください。
上から隙間をあけたいときは
margin:250px auto;で。
| tk | 2009/01/15 11:04 PM |
できました、
...うう、
隙間はなくなったし,たいとる画も記事とかぶらなくなったんですが...
たいとる画が上につきでてるので,たいとる画を下にずらすと記事も下にずれちゃうんですよね;;;
なんか色々とすいません;;
| 綾痲 | 2009/01/16 9:59 PM |
端的にいうと#contentsの幅が狭すぎます。
/*----------------------------------------------
contentsについて
#contentsは記事・オート・広告をあわせた部分の設定になります。
記事やオートの横幅を広げた時はここも増やしてください。
-------------------------------------------------*/
ってなってますよね?
で#contentsのwidthは
width:460px;
になっている。
でも記事部分はwidth:350px;で
広告部分がwidth:120px;
あきらかに溢れてます。こういうことをすると、入りきらない部分が下に落ちちゃうんです。
あと
#ads {
float:right;
text-align:center;
margin-top:120px;
margin-left:10px;
width:120px;
#layout
#layout
}
の
#layout
#layout
は削除。
#layout {
width:800px;
margin:80 auto;
text-align: float:right;
の最後の行も
text-align: left;
で。
| tk | 2009/01/16 10:10 PM |
色々とごめんなさいっ
飲み込み悪くて;;;
お世話になりましたっ
| 綾痲 | 2009/01/17 6:04 PM |
質問があります。
初歩的な質問かもしれませんが、
http://x-pixy.jugem.jp/?tid=15
上のように、記事が表示されなくなってしまいました。
ダウンロードして、まだ手をつけない状態なのですが、
なぜでしょうか??
教えてくださいUuよろしくお願いします
| ゆう | 2009/02/14 8:21 PM |
フリースペースが原因の可能性があります。
フリースペースの管理画面で一つずつ非表示にして、正常に戻るか試してみて下さい。
| tk | 2009/02/14 9:54 PM |
こんにちは。samです。
質問が、沢山出てきたので教えて下さい。
・記事は、そのままの場所で広告だけを、もう少し左側に
持ってくることは出来ますか?
・画像の下部分が少しキレてしまっています。
どこの、数字があってないのでしょうか?
・横スクロールは、どうしたらなくなるのでしょうか?
| sam | 2009/03/04 1:27 PM |
・窓画をおきたい
→background関連項目をいれてください。
基本はbody部分と一緒ですが、fixedはIEでは効きません。
またwidthとheight:●●pxで背景画像以上の高さを指定してください
窓画を左上ぴったりにしたくない時は、background-poisitionで開始位置を指定してください。
ってありますよね。
height:●●pxで背景画像以上の高さを指定してください
これ大事です。忘れないように。
広告や右スクロールバーですが、
#layoutのwidth:900px;は
どういう基準で決定されたのですか?
広告はこの数字が大きければ大きいほど右にいくので
(右端に置かれるようになっているので、幅が広いほど右に行きます)
ご自分で調節されてください。
横スクロールバーは広告をずらして消えなかったら、どうしようもないです。
窓画の横幅から縮めて全体をスリム化してください。
| tk | 2009/03/04 1:49 PM |
background-image:url(http://purety.jp/sakn/aikon/nao_372b.png);
width:740px
height:400px
こんな風に設置したのですが、切れたままです。
記入する位置が間違っているのでしょうか?
>#layoutのwidth:900px;は
どういう基準で決定されたのですか?
→width:520px; の520の数値を変更してください。
ここはheader(タイトル部分)と同じ幅にし、更に
side1(メニュー部分)とcontents(記事その他部分)の
width(横幅)を足した数字以上にしてください。
と書いてあったので、headerのサイズとcontentsのサイズを合わせました。
(今は、845になっています)
| sam | 2009/03/04 2:54 PM |
純粋に窓画+広告分で算出してください。
なお変化がないのは
width:740px
height:400px
の各行の最後に;
がない為です。これは文章の「。」にあたるので、ないとおかしくなってしまいます。
他の行を見ながら同じように付け加えてください。
| tk | 2009/03/04 3:05 PM |
height:400px
に、; をいれてたら画像は正常に出てきたんですが
#layoutのwidth:○px; に数字を入れても
変化しなくなりました。どうしてでしょうか?
| sam | 2009/03/04 3:19 PM |
いらない方消してください。
| tk | 2009/03/04 3:32 PM |
直せることができました。
| sam | 2009/03/04 4:15 PM |
写真と本文の間に一行くらいの
間をつくりたいのですがどうすれば
よろしいでしょうか…
そして携帯から投稿すると
本文に白い背景がついてしまうのです…
これを元の背景に透過させたいのですが
どうすればよろしいでしょうか!
おかしな質問ですいません><
| 07 | 2009/03/05 12:43 PM |
写真の隙間はcssの.pictにmargin:1em;を足し見てください。
携帯から投稿するとってのはちょっと分かりません。
cssをみて
background-color:#ffffff;やbackground:#fff;がある箇所があったら
それを削除してみてはどうですか?
実物なしで手探りに答えているので、かならずバックアップとりながらやってください。
| tk | 2009/03/05 1:36 PM |
| 07 | 2009/03/05 1:40 PM |
<div class="mobile" style="width: 200px; background-color: white;">
っていうのが挿入されちゃってますね。
テンプレのhtmlにこういうタグはないんですよね?
ケータイテンプレの管理画面ではどうにもできないようなので、面倒ですが、記事の編集でhtmlモードにして上記のタグが出てきたら
一つ一つbackground-color:white;を削除してみてください。
ちょっとJUGEMの問題らしく、自動で挿入されている感じなので今のところ自動でなくなるようにするという対策が思いつきません。
| tk | 2009/03/05 2:03 PM |
とっても助かりました><
一つずつ消してみます…
| 07 | 2009/03/05 2:16 PM |
思ったように表示されました!
一応、jugemにお問い合わせの
メールを送ってみました。
色々とアドバイスをありがとうございました!
| 07 | 2009/03/05 2:37 PM |
携帯テンプレ管理画面では無色が選べないようなので、今のところ手詰まりかもしれません。
| tk | 2009/03/05 2:41 PM |
このテンプレートを今カスタマイズし始めたのですが、
枠(?)を大きくしたら下のほうに言ってしまったんです。。
まだよく詳しくなく、分からないのでうまく説明できないので、
ブログを見ていただければなと思います。
本当に始めたばかりなので分からないことばかりですが
よかったら教えてくださいっ。
| curiko | 2009/10/24 6:28 PM |
cssの説明をちゃんと全部読んで、数字を変えて下さいね。
| tk | 2009/10/24 6:30 PM |