アミアンインターナショナル

貴社の売り上げアップをとことん支援します。オンラインショップ専門コンサルタント

CMS css 新着情報

サイドバーメニューの成形(1) ⇒ STINGER8設定その3

投稿日:2019年4月27日 更新日:

人気の投稿のバランスが悪い

テーマをSTINGER8にしたら、jetpackサイドバーウィジットの「人気の投稿とページ」ウィジットがバランスが悪くなった。

css適応前

cssで調整する

まず「人気の投稿」のタイトル部分に黒背景をかける。

せっかくなので、グラデーションにしておいた。


.menu_underh2{
    display:flex;
    align-items: center;
    height:2em;
    margin-top:2em;
    padding-left: 1em;
    font-size:larger !important;
    color:#ddd;
    background:linear-gradient(to right, #000,#777) !important;
    border-left: solid 10px #fc0;
    clear: both;
}

これでいいと思ったのだが、その後やっぱり少し変えることにした。

H2タグを修飾 ⇒ STINGER8設定その7

サムネイル画像が新着投稿に比べ小さすぎるので、同じ大きさにする。

#mybox img{
width:80px;
max-width:80px;
}

テキスト部分の幅を調整する。

ついでに、行間を1行空ける。

#mybox .widgets-list-layout-links{
width: 65%;
}
#mybox li{
margin-top:1em !important;
}

適応後が、この状態。

css整形後

少しましになった。

-CMS, css, 新着情報
-, ,

執筆者:

関連記事

中小機構セミナー

高松でセミナー講師として8月7日登壇します

下記要領で開催されるセミナーの講師として、登壇することとなりました。 GMOメイクショップ株式会社代表取締役社長の向畑憲良様と一緒にお話しさせていただきます。 今回はまだネットショップをオープンしてい …

テザリングをbluetoothでできない

iPhoneはテザリング「される側」にはなれない

iPhoneとiPadの2台持ちした時の悩み iPad miniを購入してからというもの、今までガシガシと酷使してきたiPhoneをとんと使わなくなった。 だって老眼にはあの画面サイズは小さすぎるから …

H2タグ

H2タグを修飾 ⇒ STINGER8設定その9

H2タグの設定 サイドバーのデザイン設定はひとまず終えたので、コンテンツエリアの設定を始める。 まず気になっていたのが、H2のバランスが悪いことだ。 STINGER8のデフォルトでは、上下にsolid …

ブログの書き方

ブログを書く時の適切な文字数は何文字か

「ブログを書く時の適切な文字数は何文字ですか?」 勉強会で質問され、思わず詰まってしまった。   一般的には400字詰め原稿用紙で何枚、と言う言い方をするので、それからすると800文字とか1 …

実質は国内シェア96%を握る ヤフー・グーグル提携の波紋

Amplify’d from diamond.jp 実際に検索サイト&#12 …