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

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

CMS css 新着情報

ソーシャルアイコン追加-サイドバーメニューの成形(2) ⇒ STINGER8設定その4

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

ソーシャルアイコン追加

Facebookなどをやっていると、ホームページから誘導したくなる。

そこでリンク用のアイコンを表示させることにした。

いわいるソーシャルアイコンというやつだ。

随分前にホームページを作った時に設定したままで、ソーシャルアイコンを表示させていないままだった(汗;)

そこで、サイドバーウィジットにjetpackの「SNSアイコン」を追加した。

これでソーシャルアイコンが表示される。

アイコンのサイズ調整

これだけではアイコンが幅幅一杯に表示されてしまうので、小さく並べて表示するようcssを設定。

.jetpack-social-widget-list .icon{
height: 48px;
width: 48px;
}
.jetpack-social-widget-list li{
float:left;
}

これでよし。

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

執筆者:

関連記事

コード表示の最適化 ⇒ STINGER8設定その8

コードが見にくい preタグでコードを表示した時に困るのが、いまいち見づらいことだ。 コードのハイライト表示を導入したことで、多少は見やすくはなっていた。 google code-prettifyでコ …

卯

年賀状を年内に出して販促するという手法

毎年、年賀状は締切間際になって慌てて書いている。 どうやら今年も同じことになりそうだ。 なにせamazonでプリンターのインクを注文したのは今日だし ←遅いって…(汗;) 年賀状の「年賀」部分を塗りつ …

ワードプレス

IEでJavaScriptエラーが出たトラブルシューティング

このブログはwordpressで制作しているのだが、当初よりIEで見るとJavaScriptエラーが出て困っていた。 いろいろバタバタしていてしばらく放置していたのだが、時間がとれたので見直してみた。 …

stinger8

おまけ:wordpress設定手順を公開してみて ⇒ STINGER8設定その15

おまけ ここまでやって気づいたのだが、画面右下にページトップに戻るリンクがある。 これが色が薄すぎて、白背景だと全く気がつかない。 すこし色を濃くしておこう。 #page-top a{ backgro …

Format Link

引用を効率化するため拡張機能Format Linkをgoogle Chromeに入れる ⇒ STINGER8設定その7

他のサイトからの引用の仕方 ブログを書く時に、他のサイトから引用することは多い。 この時に気をつけるべきなのは、SEO的な視点だ。 引用する時にblockquoteタグを使わないと、googleからマ …