早いもので今年も残すところあとわずか
となりました。今年は年をまたいで仕事
しないとならないので早めに総まとめ的
な記事を書いておきます。と言っても
完全に自分用のまとめですのでご覧に
なっても役に立たないと思いますがｗ

というわけで、後で復習するのに、探さなくていいようにしただけの自分用リンク集です。

jQueryとWordPressにやたら偏ってます。過去記事のまとめですので目新しいものは一切ありません。

ネタは省いてます。あと、種類で細かく分ける気力が残ってないので順不同です。

• スマフォ向けが多いのでスマフォ関連は※印を振っておきました。
• 復習用なのでリンクは全て当サイトの記事にしてます。他の方には二度手間ですがご了承下さい
• マウスを乗せるとキャプチャが表示されます。

130個くらいです。普段から小ネタばっかりなのでそんな感じのまとめです。

【追記】（僕が）リンク見にくいので色を変えました。

jQuery

プラグインとかチュートリアル

プラグイン

いろいろ。

1. ※PageSlide Responsive / モバイルサイズになるとメニューを横スライド式に切り替える
2. ※jQuery.ui.touch-punch.js / iPhoneやiPadでドラッグやリサイズを容易に実装
3. jQuery contextMenu / HTML5のmenu要素にも対応した、独自の右クリックメニューを実装
4. slideshowify.js / 画像を画面いっぱいに広げてフェードエフェクトで切り替えるスライドを実装
5. Simple Elements Mapper / ページ内に自動でビジュアル付きのスムーズスクロールを実装する。軽量
6. ※PhotoSwipe / iPhoneやAndroid等のタッチデバイス向けイメージギャラリー
7. stalactite / 要素を遅延表示させながらレンガ風に整列させる
8. Tiny Scrollbar / 軽量でクロスブラウザ対応、スクロールバーのデザインを変更できる
9. Address Picker / GoogleMapをインクリメンタルサーチし、位置情報を取得する
10. validate.js / シンプル、軽量でカスタマイズしやすいフォームバリデーション
11. Joyride / クロスブラウザ対応、Webサイトツアーを手軽に実装出来る
12. ※FlipPage / iPhoneやiPadにも対応の、ページをめくるようなエフェクトを実装
13. jNiceIt / フォーム周りのエレメントのデザインを見やすいインターフェースに変更
14. ※Slides / 導入も手軽でiPhoneなどにも自動でレイアウトを最適化するシンプルなイメージスライダー
15. Laquu.JS / タブやスクロール等、良く見かける機能を1つのファイルで実装可能
16. Font sizer / 設定も簡単・軽量・シンプル。Webサイトのフォントサイズを変更
17. jQuery Timelinr / 沿革や年表のようなタイムライン的なコンテンツをスライダーで実装
18. ※FLEXSLIDER / ウィンドウサイズに応じてレイアウトを調整するイメージスライダー
19. Chop Slider / エフェクトが無駄に凄いイメージスライダーを実装
20. glDatePicker / 軽量でクロスブラウザ対応の、シンプルなデートピッカー
21. Chosen / select要素内をインスタンス検索出来るようにし、美しいデザインにも変更
22. ※Blueberry / ディスプレイサイズに自動で幅調整するイメージスライダー
23. YTPLAYER / Youtube動画を透過(opacity)できる
24. ※jquery-ui-map / jQuery MobileでGoogleMap APIを使う
25. Ideal Forms / 美しいフォームデザインを実装する
26. MobilySelect / リストにフィルタを掛けてソート出来る

チュートリアル

デモも結構作ってます。

27. jQueryとVimeoのAPIでサムネイルを作成し、動画をLightbox風にポップアップ
28. テキストや画像でパララックス効果のあるコンテンツを実装する
29. jQueryのフィルタを使った際の実装サンプルと基本的な機能のまとめ
30. テーブルのセルに入力された数字に応じて背景カラーを変える
31. 手軽にサクッとシンプルなニュースティッカーを作る
32. タブで切り替え可能な地図をGoogleMapで実装する
33. テーブルの行ごとクリックしてチェックボックスにチェックを入れられるように
34. jQuery MasonryにInfinite Scroll（無限スクロール）機能を加えたサンプル
35. ※jQuery Mobileでタップで拡大するシンプルなイメージギャラリーを構築する
36. Youtubeでz-indexを有効にする「?wmode=transparent」をjQueryで自動挿入
37. リストメニューにフィルタリング機能を加える
38. jQueryでWebサイト内を無限にスクロール出来るようにする
39. 画像を使った視差アニメーションを実装する
40. ユーザーが簡単にフィードバック出来るようにするTwitter投稿ボタン
41. YoutubeのAPIとjQueryを使って動画をインクリメンタルサーチする
42. テーブルのセルを分かりやすくハイライトする
43. コメント数などをバーの長さに置き換えて数値の差を可視化する
44. コピペに頼らず、基礎知識を理解して実際に動かしてみる
45. HTMLテーブルの列にリンク先を指定できるようにする

Tips/Tools/まとめ

まとめとかツールとか。

46. JSBin / JSをブラウザ上で開発、その場で実行できるOSSのJSBinのインストール
47. JSを書いて実行、ブログ等にも貼付できるjsfiddleの基本的な使い方
48. 覚えておくと地味に便利だと思える日が来るかもしれないjQueryのコードスニペット
49. 背景画像をフルスクリーン表示してスライドショーに出来るやつ色々
50. jQuery Mobileを使う際に知っておくと役立ちそうなTipsや情報のまとめ
51. 視差効果（パララックス）を取り入れたWebデザイン例とTipsいろいろ
52. jQuery Mobile使用時によく使うマークアップで日本語サンプルを作ったので配布
53. Laker / iPhoneやiPad向け電子書籍を作成する為のフレームワーク

WordPress

WordPressです。

カスタマイズ

functions.phpとかでなんかするやつ。

54. ギャラリー機能を、少しのjQueryコードでLightbox風にポップアップ出来るようにする
55. 少しのjQueryコードでWordPressのコメント欄にリアルタイムプレビュー機能を加える
56. jQueryで動作する開閉パネル式をWordPressのショートコートで作れるようにする
57. ウィジェット機能で追加した項目をjQueryを使って開閉パネルにする
58. WordPressのコメントとトラックバックをjQueryでタブ分けする
59. post_class()にアイキャッチ画像を使用した記事の場合のclassを追加する
60. WordPressのオリジナルテーマ作成フロー・基本マニュアル
61. スパムユーザーの自動登録を簡単なコードで防ぐ
62. 「アイキャッチ画像」がいまいちピンとこないクライアントさん向けに説明文を挿入
63. 記事内やコメント欄内の特定のキーワードを任意のテキストやリンク等に一括置換
64. 投稿エディターで、HTML5のタグを一応使えるようにする
65. 閲覧している記事をその場で削除するボタンを設置する
66. jQuery本体をCDN等に置き換える際は管理画面に読み込ませないようにする
67. 投稿記事や固定ページの好きな場所に任意のPHPファイルを挿入、実行できるようにする
68. 「固定ページ」にページ送り可能なポートフォリオページを作る
69. WordPressを使ってWeb制作をする為の手順リスト・【改正版】+α
70. 管理画面での画像アップロード等に使われているlightboxを他の用途でも利用する
71. 管理画面のドロップダウンする「ヘルプ」の内容を変更
72. データベース接続エラー時に表示するメッセージを変える
73. 簡単なコードでシンプルなサイトマップを作成する
74. wordpress.comのAPIを使ってスクリーンショットを取得する
75. WebサイトにSEO施行する際に役立つっぽいカスタマイズハック
76. 管理画面で追加できるウィジェットで不要のコンテンツを削除する
77. functions.phpによく書いてるやつ
78. カスタムフィールドを使ってh1を記事に応じて変更出来るようにする
79. CSSで「投稿」や「ページ」のHTMLエディター内のフォントや文字サイズを変更する
80. 総コメント数を表示させるコード
81. Twitterのような「～分前に投稿されました」を実装する

テーマ

WPテーマ

82. ※Reverie / HTML5製のレスポンシブ対応テーマフレームワーク
83. WPEXPLORER / スタイリッシュでシンプルなデザインのWordPressテーマを無料配布
84. TheProton / クリーン且つクオリティの高いデザインで完成度の高いHTML5製テーマ
85. 有料でもおかしくないようなクオリティの高いテーマを無料で配布しているサイト
86. WP Paintbrush / その場でインタラクティブにレイアウトやデザインを変更できる
87. PressWork / レイアウトや配色等をインタラクティブに設定できるテーマ作成用フレームワーク
88. ※BLASKAN / Media QueryでiPhoneやiPadにも自動でレイアウトを調整
89. ※Flexible / スマフォにも最適化し、ファンゲート対応のFacebookページも作成
90. Imbalance 2 / いろいろと完成度の高いWordPressフリーテーマ
91. ※Media Queriesで様々なデバイスに対応済みのテーマいろいろ
92. Simply Delicious / ポートフォリオやフォトログに良さそうなミニマルデザイン
93. Grid Locker / グリッドレイアウトのクールなギャラリーサイトを構築
94. Roots / Starkersに960gsを搭載したBoilerplateベースのHTML5製フレームワーク
95. ※Whiteboard / スマフォでも黄金比を組めるLess Framework搭載

プラグイン

便利なプラグイン

96. Color Admin Posts / 管理画面の記事一覧で予約投稿とか下書きで色分け出来る
97. WP Email Login / ユーザーIDでも登録したメールアドレスでもログイン出来る
98. Usernoise / フィードバック用のフォームを簡単にブログに設置
99. Flickr Photo Post / Flickrで検索、著作権表示付きで記事に挿入出来る
100. ※BuddyPress Mobile / BuddyPressを使ったWebサイトをスマートフォンに最適化
101. Stealth Login / ログインURL（wp-login.php）をサクッと変更できる
102. Social Metrics / Tweet数やブクマ、いいね！の数を管理画面に一覧表示
103. WP Total Hacks / ノンプログラマー向けのWordPressカスタマイズハックプラグイン
104. Additional image sizes / 記事に挿入する画像のサイズの種類を増やせる
105. Snazzy Archives / アーカイブをテレビ番組表っぽいレイアウトで表示する
106. CMS Tree Page View / 固定ページをツリー形式で表示・管理出来る

CSS

CSSはcss3が殆どですが、使い道があんまないので端折ってます。スマフォに使うのもさほどないし・・

Tips

基本的に苦手なのであんまり書いてないｗ

107. 画像を使わずに見出しを水平線で挟む
108. マウスオーバー時にリンク先のURLをツールチップで表示させる
109. 地味に使えるCSS小技のメモ&サンプル集
110. ※レスポンシブWebデザイン構築に役立つフレームワークやTipsいろいろ
111. CSS3のtext-shadowを使ったテキスト装飾のサンプル集

その他

レスポンシブWebデザインが楽しい1年だった。まだまだ研究の段階だけど、なにもレスポンシブだから1ソースにこだわる必要も無いですよね。個人的には期待してます。

112. ※YAMB / ドロップダウンやスライドにも対応したレスポンシブWebデザイン
113. ※The Goldilocks Approach / レスポンシブWebデザイン設計用のシンプルなテンプレート
114. Atatonic / 軽量で、シンプルなCSSフレームワーク
115. Web Symbols typeface / ミニマルなアイコンやシンボルをWebフォントで表現
116. ※Foundation / タブやフォームなどのリッチUIもセットにしたレスポンシブフレームワーク
117. ※Fluid Baseline Grid / 著作権放棄・シンプル・軽量のレスポンシブHTML5フレームワーク
118. ※Golden Grid System / 240pxから2560pxまで対応出来るレスポンシブグリッドシステム
119. Gridless / パブリックドメインの、クロスブラウザ対応フレームワーク
120. ※Skeleton / レスポンシブなWebサイトを制作する為のスターターキット

ツールとか

便利なやついろいろ

121. Compare Ninja / ブラウザ対応表とかでよく見かけるようなチェック表を生成
122. InstaCSS / プロパティをインクリメンタル検索出来るCSSリファレンスサイト
123. Pingdom Tools / Webサイトの表示速度を計測する
124. Gimme Bar / Tumblrライクに画像やテキストを気軽にクリップ出来る
125. ※NegativeGrid / レスポンシブ対応の軽量なグリッドレイアウト用CSSを生成
126. JPEGmini / JPEG画像を劣化させずにサイズダウンし保存
127. Responsivepx / レスポンシブWebデザインの構築時に役立つ
128. 最近よく使ってる、Web制作に役立つWebサービス的なやつ
129. loads.in / 国別・ブラウザ別でも計測出来るWebサイト表示スピード調査ツール

個人的な制作物

今年はあんまり自分の制作物は作れませんでした・・未完成だけど公開します。

130. Shotoku / 動画にも対応のレスポンシブなWPギャラリーテーマ
131. blite-design / 白黒のものを収集するだけのサイト。まだ仕上がり60％
132. J-snippet / jQueryプラグインを集めてたけど若干挫折気味

以上、少し早いですが2011年に配信した当サイトの記事の一覧でした。今年も沢山ご覧頂いて有難う御座いました。残りの日は適当にいつも通り配信していきますので最後まで宜しくお願い致します。

今年もわずかですが、身体に気をつけてなんとか乗り切りましょう。