もうすぐ、ブログ開設半年の「スタイリッシュ生活日記」ですが、wordpressのブログテーマには(無料版だけど)始めからLIQUID PRESSを利用させていただいています。
今回は、テーマのメジャーアップデートということで、version 1.0になった際のメモを書いておきます。
というか、逆に言うとまだ0.9系だったんですね。今後の伸びシロが楽しみでもあります!
主なポイントは次だそうです。
主なポイント
- Bootstrap v4.0.0-alpha から Bootstrap v4.1.0 へアップデートしました。
- LIQUID PRESS は、v0.9系(最終v0.9.7.4) から v1.0系 へメジャーアップデートしました。
- 管理画面での Bootstrap デザインプレビューに対応しました。
- 簡単にデザイン変更や機能追加ができる、無料デザインスキン&パーツをリリースしました。
ブートストラップ4の安定板ということが一番大きななポイントかもしれません。
対応ブラウザが「IE9以降」だったものが「IE10以降」になったようですが、このブログを見ていただいている方にはどれくら影響があるのでしょうか、気になるところです。
ちなみに、このブログをInternetExplorerで見ている人は6%程度いることが分かっています。
関連記事>>>まだInternetExplorerを使ってるの?
LIQUID PRESSのアップデートの公式情報はこちらです。
見出しのデザイン案やHTML・CSSサンプルは参考になります。表の「レスポンシブテーブル」なんかもありがたいです。
レスポンシブテーブルの例はこんな感じですかね。例なので無駄に横長の表になってます。形が崩れないので、思い通りに表現できそう。
thヘッッッッッッッッダ1 | thヘッッッッッッッッダ2 | thヘッッッッッッッッダ3 | |
---|---|---|---|
thヘッッッッッッッッダ4 | tdデーーーーーーーーータ1 | tdデーーーーーーーーータ2 | tdデーーーーーーーーータ3 |
thヘッッッッッッッッダ5 | tdデーーーーーーーーータ4 | tdデーーーーーーーーータ5 | tdデーーーーーーーーータ6 |
これまでは、独自にテーマやCSSを編集してできた機能ですが、デフォルトで出来るようになりました。
が、表の1つ1つに対してコードを追加するので、過去記事の表はいじり直さないといけませんね。これからwordpressをはじめる方には関係ない話ですね。
詳細はこちら。
【募集中】こんなデザインがほしい!というご要望をお気軽にお寄せください。
LIQUID PRESS 無料デザインスキン&パーツ https://t.co/oevbPDAo6d #liquidpress— LIQUID DESIGN (@lqd_jp) 2018年5月30日
他にも、画像が角丸とか、円(楕円)で表示できるようになりました。
これは元画像
サムネイル(”img-thumbnail”クラス)
角丸(”rounded”クラス)
円(”rounded-circle”クラス)
Bootstrap(ブートストラップ)が4になったということで、ボタンの色など少し変わっています。
このブログを更新していてまず気になったのは、ボタンの”btn-secondary”クラスの色ですかね。白っぽかったものが、黒っぽくなりました。白にしたい場合は、”btn-light”クラスに変更する必要があります。
さらに、グリッドシステムが少し変わっているので、カスタマイズして”col-xs-6″とか使っていた方は”xs”が必要なくなった感じです。でも、”container”クラスや”row”クラスのdivで囲めってことだったかな。
“col”のみにしても、自動で配置してくれるみたいです。複数の要素を1行で表したい場合は便利かも。
以上のように、アップデートの概要は書きましたが、詳細全部を書く意味もないですし、使用者によって興味ある部分も違いますよね。
アップデートして、ブログのデザインをいじるためのガイドはこちらに詳細があります。
そして、bootstrapを直接的に利用して、もっとカスタマイズしたい方は、こちらのBootstrap公式ドキュメントも役に立つかもしれません。
ということで、wordpressのテーマ「LIQUID PRESS」をバージョン1.0にアップデートした話でした。
「メジャーアップデート」って何か良いですよね。気持ちも改まります。
私も自分について日々、何かを改善していくように「マイナーアップデート」を続けて生きたいですが、「メジャーアップデート」って中々できません。
でも、もっとスタイリッシュな生活にするために、いろいろ試行錯誤していきたいと思います!