0210こんにちは、とみーです。前回ははてブとfeedlyのボタンをプラグインで簡単に追加しました。Jetpackの共有ボタンにはてなブックマークとfeedlyを追加するプラグインこんにちは、とみーです。今回はWordPressでいの一番にインストールしたいプラグインJetpackの機能の...zero.edition.jp今回はJetpack共有のシステムとスタイルシートを使って、設定で「アイコンのみ」を選択した場合に表示される丸いアイコンを作ってみたいと思います。画像を用意するLINEロゴの画像を用意します。公式で配布されていますが改変NGなため、私はニコニ・コモンズでダウンロードしました。ニ・コモンズcommons.nicovideo.jpこれをGimpで16×16ピクセルに縮小しました。共有ボタンの「新サービス追加」で、以下のように入力します。アイコンURL:アップロードしたアイコンのURLLINEが追加されますので、下の方にドラッグします。スタイルシートで背景色を設定するLINEが表示されましたが、背景色が灰色なのでLINEのブランドカラーに変えたいと思います。子テーマのstyle.cssに1行追加します。}結果・・・背景色が変更されましたが、微妙にベースラインが合っていません。スタイルシートで位置を調整する子テーマのstyle.cssに更に1行追加します。}見ているうちに同じなのかズレているのか、だんだんとわからなくなってきますが・・・これでいいかな?あとがき他はフラットデザインなのに、LINEのアイコンだけタイプが違うのが気になります。どこかでフラットなアイコン発見したら差し替えようかと。a.share-custom-○○(恐らくStep2で入力したサービス名)に変更する必要があります。Illustratorwww.iconfinder.comサイズは無理に16×16に縮小する必要はないみたいです。(私は86×80)余白はギリギリまでなくした方がベター。余白があると、他のアイコンと比較して小さめなアイコンになってしまいます。コメントをキャンセルメールアドレスが公開されることはありません。「このブログに投票」ボタンを押していただけると更新の励みになります。(9)サーバーお借りしています。