WordPress.com のビジュアルモードでの ShareHtml の CSS カスタマイズ

ShareHtml をCSS カスタマイズすることで、ShareHtml で作成した記事リストのサムネイル画像が抜けていたときにそれを埋める作業をやりやすくする方法についての覚え書きです。

2016-01-23 10.12.30.png

comemoarrow

2016-01-23 10.12.35.png

ShareHtml 貼り付け用のスニペット

ShareHtml を使う場合、以下のアドオンや拡張機能に登録しておくとビジュアルモードの状態でも貼り付けることができます。

アドオン「Make Link」用 (Firefox)

アドオン「Easy Copy」用 (Firefox)

拡張機能「Create Link」用 (Chrome)

なお、以下の ShareHtml メーカーを使用する場合には、以下のような感じで、CSS クラス名「mshots」の div 要素でくくってやるとこの記事で紹介している CSS が効くようになります。

WordPress.com のビジュアルモードでの ShareHtml 装飾用 CSS

アドオン「Stylish」が有効な状態で以下のページの「+ install with Stylish」ボタンをクリックすると WordPress.com のビジュアルモードに貼られている ShareHtml が整形されます。

なお、上記ページで紹介している CSS を WordPress.com にコピペすれば、WordPress.com のブログにも適用できます。

 ShareHtml で貼り付けたサムネイル画像の差し替え

上記の処理をしておくと、WordPress.com のビジュアルモード上でのサムネイル画像の差し替え作業が楽になります。

 

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。