テキスト1カラムの投稿リストの日付のアイコンを非表示にしました

VK Blocks Pro 1.123.0 の新機能

いままで VK Blocks Pro の投稿リストに表示できる日付は投稿日だけだったのですが、今月リリースされたバージョン 1.123.0 で最終更新日も表示できるようになりました。

最終更新日で並べ替えることもできるようになっていますので、コンテンツの書き換え更新が多いサイトでは大いに役に立ちそうです。

投稿日と最終更新日を区別する必要があるので、このアップデートに伴い、投稿リストの日付の前にアイコンが追加されています。

これ自体はとてもうれしい機能追加なのですが、このサイトでいくつもカスタマイズを行ってある、表示タイプが テキスト1カラム の投稿リストで困ったことが起きています。

このサイトのトップページの新着情報

このサイトのトップページの新着情報は、たくさんの投稿をコンパクトに表示するために、テキスト1カラムの投稿リストを2カラムのレイアウト表示（わかりづらい...）にカスタマイズしてあります。

いままでの新着情報

これ↓がいままでの新着情報の見え方です。

VK Blocks Pro 1.123.0 にアップデートした状態

日付のアイコンが増えたことにより日付の幅が大きくなっているところがあり、日付の幅が揃わずに以下のようにカテゴリーの位置がずれてしまいました。

この問題は VK Blocks Pro に次のアップデートで修正される予定なのですが、おそらく .postListText_date { min-width: 115px; } を .postListText_date { min-width: 130px; } のように変更する対応になるのだと思います。

次のアップデートでこうなる？

次のアップデートでカテゴリーの位置が揃うと思いますが、おそらくこのような↓レイアウトになるのだと思います。

私の投稿はタイトルの文字数が多く、いままでも日付とカテゴリーの下の無駄な余白が気になっていたのですが、それがさらに気になってしまいます。

日付のアイコンを表示しないことにしました

CSS で何とかしようかと思ったのですが、このサイトには他にもカスタマイズしたテキスト1カラムの投稿リストがあって、それ全部をひとつひとつ調整するのはめんどくさいです。

テキスト1カラムの投稿リストには日付がどちらかひとつしか表示されない仕様になっています。そして、このサイトではアイコンで日付を区別する必要がなさそうです。

そこで、以下の CSS を書いて、とりあえずこのサイト全体で、テキスト1カラムの投稿リストだけ、いままで通り日付のアイコンを表示しないようにしました。

.postListText_date i { display: none; }

1行で済んで、ヨカッタ...

投稿者プロフィール

対馬俊彦魚沼情報サービス・ベクトル公式テクニカルパートナー

【日本全国対応】WordPress のサイト制作、設定、カスタマイズ、トラブルでお悩み、お困りの方、ベクトル公式テクニカルパートナーがお手伝いいたします。

Lightning / VK Blocks / VK Filter Search のサポート、カスタマイズを得意としています。

遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。

オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを制作・運用する上でうまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。

デザイナー様、制作業者様のサイト制作のお手伝いも数多く行っています。難しい部分のコーディング ( PHP / CSS / jQuery ) をやってほしい、いま人手が足りない等、お仕事の依頼をお待ちしています。

ご要望をうかがった上で費用見積り（無料）を提示させていただきますので、お気軽にお問い合わせください。

≫メールでのお問い合わせはこちら