WordPress

Twitterボタンを表示する

Twitterのフォローを促す「Twitterボタン」を表示させたいと思います。まずは、下記の「Twitterボタン」にてソースコードを作成しましょう。Twitterボタン// // 1.コードを取得...
WordPress

はてなブックマークボタンを表示する

はてなブックマークボタンとは、はてなブックマークが提供しているソーシャル用のボタンになります。このボタンを利用することでサイト閲覧者へのブックマークを促すひとつとなり、ブックマークをしてくれたユーザー...
CSS

CSS3アニメーションを実現する「transition」

transitonプロパティを使って、時間的な変化を付けることが出来ます。変化する変化速度や開始のタイミング、また要する時間などをCSSのみで実現が可能です。ただし、対応ブラウザの問題がありますので注...
WordPress

カスタムヘッダー機能でメインとなるイメージを表示する

トップページなどに、ファーストビューでサイトを印象付けるイメージなどを配置したいときには、カスタムヘッダー機能を追加する方法があります。
WordPress

カテゴリーごとに別々のアイコンを表示する

投稿記事の一覧を表示しているページなどで、すべての複数の投稿カテゴリーが羅列される際に、それぞれがどのカテゴリーに属する記事なのかがパッと見で視覚的にわかるようにしたいとき、該当するカテゴリーに応じて...
WordPress

WP-PageNaviのデザインを33通り選べる「Wp PageNavi Style」

自動でページャーを設置してくれるプラグインの「WP-PageNavi」を使用する際に、CSSを修正してデザインを変更できますが、それを簡単にデザインカスタマイズ可能なプラグイン「WP-PageNavi...
jQuery

クロスフェードするシンプルなイメージビューアー

サイトトップページでよく見られる、フェードで切り替わるメイン画像を簡単に表示してくれるjQueryの「fade-viewer」、極々シンプルにフェードを繰り返してくれるだけですが、汎用性が高いので使い...
WordPress

投稿画面で子カテゴリーをチェックすると、自動で親カテゴリーも選択してくれるプラグイン「Parent Category Toggler」

記事を投稿する際にデフォルトの設定だと、子カテゴリーにチェックを入れても親カテゴリーにはチェックが入りません。// // 大体の場合、子カテゴリーは親カテゴリー内の内容なので自動的にチェックされたほう...
CSS

cleafixでfloat対策する方法

float をした要素の親要素の背景画像などが途中で切れてしまうことがありますが、これは、その子要素を float 指定している場合、高さを認識しないため親要素は float する子要素の手前で高さを...
Illustrator

Illustratorイラレで文字を斜体にする方法

Illustrator(イラストレーター)でテキストを配置する際に、英字フォントであれば「Italic指定(イタリック)」ですぐに斜体に変換できますが(※フォントのタイプによります)、日本語フォントの...
CSS

ハイライトの色を変更する「::selection」

テキストを選択した際に色付けされるハイライトカラーを好きな色にする方法をメモしておきます。デフォルトの設定では一般的に下の画像のような青色「#328efd」で表現されているかともいますが、各々のサイト...
jQuery

レスポンシブに対応して画像をポップアップ表示してくれる「fancybox」

LightBox風に画像をポップアップして表示するjQueryのプラグインでColorBoxに似たようなビジュアルになっています。レスポンシブに対応していてカスタマイズも出来るので色々と便利に利用でき...
ブログ

ウェブデザイン技能検定3級に合格しました!

普段、Webデザインを生業として生活をさせて頂いておりますが、時代の流れは早く、日々なんとか食らいついていくのが精一杯になってしまう時が少なからずあります。よくわからない技術や知識は忙しさにかまけて、...
SERVICE

feedlyでのRSS購読者数をチェックできる feedly Subscribers Checker

ブログにfeedlyの購読ボタンを設置しましたが、自分のブログをfeedlyで実際に購読してくれている人の人数を知りたいと思いませんか?// // なんとそれを簡単にチェックできるページを用意してくれ...