サポート » 使い方全般 » 両サイドの余白をなくしたい

  • 解決済 mild_taste

    (@mild_taste)


    よろしくお願いします。
    フォーラムで検索した記事で余白をなくす方法がありましたので下記に記載します。
    http://ja.forums.wordpress.org/topic/129?replies=6

    この記事によるとlayout.css, blueflavor.cssを修正する感じになってるのですが
    4年前のらしく記事が古いのでしょうか?layout.css, blueflavor.cssどちらも見つかりません。。
    格納箇所がわかる方おりましたら教えて下さい。

    又既になくて別の方法で余白をなくす場合、テーマを編集でstyle.css をずっと見ながら数字をちょこちょこ縮めて更新しながら確認しているのですが、全然両サイドの空白がなくなっていきません。

    ご指導宜しくお願いします。

8件の返信を表示中 - 1 - 8件目 (全8件中)
  • mild_tasteさん

    お使いのテーマは何でしょうか?

    Twenty Eleven です。

    Twenty Elevenをカスタマイズしているのであれば style.css の90行目あたり

    #content {
    	margin: 0 34% 0 7.6%;
    	width: 58.4%;
    }
    #secondary {
    	float: right;
    	margin-right: 7.6%;
    	width: 18.8%;
    }

    の margin, width の値を変えてもうまくいかないでしょうか?

    《補足》
    1. Twenty Elevenはブラウザの横幅によってレイアウトが変わる「レスポンシブウェブデザイン」のテーマなので、微調整した結果がどの環境でも反映されるとは限りません。
    2. Twenty Elevenをカスタマイズされるのであれば、将来、テーマに自動アップデートがかかった場合に上書きされてしまわないよう「子テーマ」を作ってカスタマイズされるのがおすすめです 🙂

    レスありがとうございます。

    全ての数値を0で記入し試してみた所、変化がまったく見えませんでした。

    伝わりが悪いのかもと思いまして自分が変更したい幅がどの幅なのかを画像で上げます。

    http://aixfb.com/wordpress/img/tes.jpg

    小テーマとかまったく知りませんでした。細かいご指示感謝します。

    Hello worldの上部も結構開きがあるので少しここも縮めたいのですが、重ねてご指導下さると助かります。

    該当のページですと body タグに one-column という class がふられているので、style.css の修正箇所は198行から始まる

    .one-column #content {
    	margin: 0 7.6%;
    	width: auto;
    }

    の margin になるかとおもいます。ついでに上部のアキは684行目

    #main {
    	clear: both;
    	padding: 1.625em 0 0;
    }

    の値を調整されてはいかがでしょうか。

    出力されたページのソースをひらいて、カスタマイズしたい要素にどのような id, class がふられているか確認した上で style.css をたどっていくと、レイアウトの修正も比較的スムーズに進むのではないかとおもいます。

    Twenty Elevenの場合は、特に body タグの class について注目するとよいです。body_class() というテンプレートタグにより、ページごとに class が動的に生成されるようになっているので。
    (たとえばサイトトップだと home という class が入ったり、アーカイブページだと archive という class が入ったり……というふうに)

    ありがとう御座います。無事サイドの幅を縮める事が出来ました。

    上部の幅もだいぶ縮まってきましたがまだまだ空きが見られます。

    とりあえずサイドの幅は縮まりましたのでこの板は解決にさせて貰います。

    出力されたページのソースをひらいて、カスタマイズしたい要素にどのような id, class がふられているか確認した上で style.css をたどっていくと、レイアウトの修正も比較的スムーズに進むのではないかとおもいます。

    ということですが出力されたページのソースを見たいのですが、どのPHPファイルを見ていいのか解りません。

    html言語でしたら理解出来るのですが、PHP言語はまだまだ全然理解が出来ていません。
    勉強させて貰っています。ご指導よろしくお願いします。

    出力されたページのソースを見たいのですが、どのPHPファイルを見ていいのか解りません。

    html言語でしたら理解出来るのですが、PHP言語はまだまだ全然理解が出来ていません。

    まずは、Codexの「テンプレート階層」-「ページ種類別テンプレート階層」
    の項を一つずつ読み進めてはいかがでしょう? 投稿や固定ページ、アーカイブページなどでどんなテンプレートファイルが使われているかを把握することが、最初の一歩になるのではなるかとおもいます。

    #トピックが「未解決」のままのようですので、お手数ですが「解決済み」にしておいてくださいね。

    了解しました。ちょっとやってみます。
    又、よろしくお願いします。
    ありがとう御座いました。

8件の返信を表示中 - 1 - 8件目 (全8件中)
  • トピック「両サイドの余白をなくしたい」には新たに返信することはできません。