Sticky Headerその後

Sticky Headerをやりたくて、その名もずばり「Sticky Header」と言うプラグインを入れましたが、デザインに統一感を出すためのカスタマイズに手作業(設定では対応できないので、直接コードを修正する)が多いのでメンテナンス性が悪いのと、そこまで手を入れてもまだデザイン的に納得いかなかったので、違うプラグインを探し出して入れたのが「Awesome Sticky Header」プラグイン。現在はこのプラグインでヘッダー固定を実現しています。

このプラグインがいいのは、設定項目が多いので手作業を一切入れていないこと。設定項目に含まれない変更はプラグインの設定画面から直接追加のCSSなどを入れられること。このプラグインのメンテナンス性はピカイチです。

実際のところ、設定項目以外で入れた変更はこれだけ。hoverのカラーは設定項目にもあるけど、設定できるのはメニューだけだったので、タイトルも含めてマウスオーバーした時の色を追加設定しました。

.asmh-header {
font-family: "Cabin Sketch", cursive;
text-transform: uppercase;
}
.asmh-header a:hover{
color: #1fa0ae !important;
}

ちなみに、このヘッダー固定はスマホ画面では見られませんw　ある程度画面サイズのあるパソコンからご覧いただくと、何をやりたかったのかわかると思いますので、お時間のある時にパソコンの画面でご確認くださいw

プラグインの機能で、サイト説明をタイトルの下に表示できたり、検索バーを標準で追加できたり、文字の色、サイズ、など細かく設定できるので、どうやって設定するのかわかってしまえば自分なりのカスタマイズが簡単にできる良いプラグインだと思います。

ただ、標準設定では、固定ヘッダーの上部に1pxの隙間を開けたり、上下に1pxのボーダーが付加されたりと、デザインセンスは「なんか違うなぁ」なんですが、最初に表示される「標準」ヘッダーをぐっと我慢して一つ一つ修正するとほぼ思い通りのことが出来ると思います。

残念ながら「Sticky Header」の時にも発生していた、「Home Categories」との相性は悪く、サイドバーの表示項目を変更しています。具体的には、本来は「公開」設定されたエントリーのみサイドバーにランキング表示したいのですが、一覧表示から個別ページへ遷移した時に、カテゴリー制限が引き継がれない現象が出てしまい対応に時間がかかりそうなので、応急処置で回避しています。

画像表示した時に、クローズボタンが固定ヘッダーの下に隠れてしまう現象は、今回はZ-Indexの設定で回避できていたので、下に移動したクローズボタンは、また右上へ戻しました。

ちなみに、タイトル画像は本社のそばのコーヒーショップに掲示してありました。こんなルールを自分が決められたらいいですけどねw

ところで、話は変わりますが走行距離が7,777Kmになりました。これまでのところ車載の燃費計だと14.3Km/ℓを表示していますが、実測の平均燃費は13.42Km/ℓで、平均単価は85.72円/ℓでした。都内を走行すると言う条件にしてはかなり良い結果だと思います。

そうそう九州へ出張した時に、八代外港へ行ったのですが、工場の目の前は海でした。右手が工場の敷地です。空港からシャトルバス(と言ってもマイクロバス)で1時間半ほどで神園交通の外港車庫というバス停に到着します。そこから徒歩10分ぐらいで工場です。天気が良ければ徒歩でもOKです。

最終更新日: 2019年6月16日