web-dev-qa-db-ja.com

レスポンシブテーマでロゴのサイズを変更できませんか?

私は何時間もこれに頭をぶつけてきた。私は何年もウェブ開発に手を出していないので、私は非常に錆びています。

私は新しいウェブサイト、clearerlines.netを立ち上げ、ヘッダーのロゴをデザインし、そしてカスタムテーマの(Nova Lite)オプションパネルを使ってそれをインストールしました。

どういうわけか私がまだ理解することができない、ロゴは不変に小さいです。それは「レスポンシブ」なデザインコードが原因ですか?どちらにしても、望ましい効果を得るためのそれの周りの方法はありますか?私はこの結果を得るためにヘッダーのレスポンシブデザインを失いたいと思っていますが、私はそれを避けたいと思います。

助けて?

1
Truefire

あなたのヘッダは(デスクトップビューで)独自の幅を定義する2つのスパンで構成されています。

<div class="container">

    <div class="row">

        <div class="span3"> <!-- I have a width of 270px at desktop view -->

            <div id="logo">

               <!-- your logo here is constrained to the parent span width of 270px -->

            </div>

        </div>

        <div class="span9"> <!-- I have a width of 870px at desktop view -->

            <nav id="mainmenu">

                <!-- your menu here is constrained to the parent span width of 870px -->

            </nav> 

        </div>

    </div>

</div>

それに応じてこれらのスパンを編集する必要があります。これを行うにはいくつかの方法があります。

  • あなたのテーマはあなたがあなたのロゴ領域の幅を指定/修正することを可能にするバックエンドダッシュボードであなたにオプションを提供するかもしれません。

  • そうでない場合は、上記のヘッダーマークアップを含むテーマテンプレートファイルを 子テーマでオーバーライドする必要があります(推奨).

上記のマークアップが含まれているかどうかを確認するために、親のテーマディレクトリheader.phpにあるnova-liteを調べます。そうでない場合は、別のテンプレートファイルに含まれている可能性があります。

見つかったら、それを子テーマでオーバーライドし、スパンをロゴのためにより寛大なものに変更します(メニューのspan5およびspan7など)。作業する列は合計12列あるので、必要に応じて分割します。

あなたのテーマは、ドキュメントがここで見つけることができるBootstrapのバージョン2.3.2の古いバージョンも使用しています。 http://getbootstrap.com/2.3.2/

0
userabuser