ヘッダーの固定方法について

2016年6月12日 at 10:10

こんにちは、はじめまして。

ただいま以下の環境にて自作テーマ構築を行っております。

自作サーバー:CentOS 6.7
PHPバージョン: 7.0.2
concrete5バージョン: 5.7.5.8

自作テーマにてヘッダーの固定をしようとしているのですが、うまくいきません。
個人的に試したのは以下の手順です。

①application/themes/ディレクトリ以下にelementalテーマをコピーして自作テーマを作成。
参考にしたURL:http://concrete5-japan.org/community/forums/design/post-10827/

②その後、application/themes/[自作テーマ名]/css/build/header.lessを編集し、

header {

background-color: @header-background-color;

padding-top: 30px;
padding-bottom: 30px;
border-bottom: 1px solid #d9d9d9;
position: fixed;   ←変更箇所

#header-site-title {
【中略】

と書き換えたのですが、この変更が有効にならず、ヘッダーが固定できません。

もし、テーマのヘッダーを固定化する方法をご存知の方がいらっしゃいましたら、どうかご教授ください。

以上、よろしくおねがいします。

タグ:

Re: ヘッダーの固定方法について

2016年6月13日 at 11:48
柚子胡椒さま

自作のテーマが適用されているのであれば、問題なくスタイルは有効になると思います。

キャッシュはクリアされましたでしょうか?
もし、キャッシュの設定がインストール時のままであれば、キャッシュの設定を開発時は無効にすることをお勧めします。

ただし、ヘッダーの固定は、スタイルシートの書き方によっては、編集モードで意図しない挙動をする場合がありますので、ご注意ください。

よろしくお願いします。
 

Re: ヘッダーの固定方法について

2016年6月14日 at 20:56
nipperさま

返事が遅くなり大変申し訳ありません。
迅速なご回答ありがとうございます。

ヘッダーのスタイルシートの編集前にキャッシュはクリアしておりましたが、結果的にヘッダーの固定は出来ました。

やはりスタイルシートの書き方が問題であったようです。
手順としては、

①application/themes/[自作のテーマ名]/css/main.lessを編集し、

【中略】
@import "build/body.less";
@import "build/content.less";
div.ccm-page {
@import "build/errors.less";
@import "build/header.less";  ←この行をdiv.ccm-pageの外に出す。
【中略】


②application/themes/[自作のテーマ名]/css/build/header.lessを編集し、

position: fixed;

を追加


を行ったところ、ヘッダーの固定をすることができました。


重ねて非常に迅速にご回答くださいましたことを御礼申し上げます。