この記事は別ブログでの無料テーマ「Luxeritas」を用いたカスタマイズ記事です。当ブログは「Cocoon」を使用しており、記事内容は反映されておりません。
目次(クリックでジャンプ)
背景をグラデーションにしたい！
こんにちは(2018/10/6)
「Luxeritas」はカスタマイズ可能な項目が非常に多く、知識がないユーザーでも好みのデザインに変更しやすいです。本当に凄いテーマです
m(_ _)m 崇 拝
先日、秋が深まってきたので背景を秋らしいグラデーションにしてみようとすると…デフォルトのカスタマイズ項目では変更できないようでした(自分の調査不足かもしれませんが…)
そこで、子テーマにCSSを追加してグラデーションを設定してみました。
以下のCSSを子テーマにコピペすればOK
最初の「90deg」というのはグラデーションの方向です。
上に向かうのを0degにして時計回りに指定します
本当は斜めにグラデーションをかけようと思ったのですが、縦方向の処理が面倒くさいので、単純にヨコ向きのグラデーションになっています。
(スクロールしてみるページの高さ全体にグラデーションがかかってしまう。それを外す指定をするとiphoneできちんと見えないらしい。)
が、後述するヘッダーグラデーションのおかげで目の錯覚で斜めっぽく見えなくもありません
よね？
( ・Θ・)
ヘッダーの背景もグラデーション
ついでなので、ヘッダーの背景もグラデーションにしてみました。
以下のCSSを子テーマにコピペすればOK
これも方向を指定しています。こちらは斜め(右下)にグラデーションをかけています。
こちらの斜めグラデーションのおかげで背景も斜めっぽく見える
Σ(ﾟ◇ﾟ;)!!
ことに試行錯誤中に気づきました
(^_^;)
キャッチフレーズの色を変更
ヘッダー背景を変更したのに伴って、キャッチフレーズの色を変更しようとしたら
これもカスタマイズ項目に見当たらなかった(調査不足だったら、作者様ごめんなさい)ので、CSSで変更しました
以下のCSSを子テーマにコピペすればOK
メニューをグラデーションにしたい！
のですが、まだやり方がよく分かりません(汗)
管理人はhtmlとcssをきちんと勉強していないので(恥)
デベロッパーツールで数値を変えながらググったり小手先のコピペだけでカスタマイズしているだけで
目的の項目を特定したりが出来ないのですね…
(・ω・;)
まあ、そのうち偶然発見できるかwebに情報が出てくるのを待とうと思います
(+_+)