prasm prasmっていうブログだよ

WordPressブログのデザインや機能を一歩先に進化させるカスタマイズ記事まとめ

テーマの見た目や機能のカスタマイズ、奥が深いです。ほんと。

WordPressは機能の柔軟さも魅力なのですが、カスタム記事という叡智が抱負なのも嬉しいポイント。

おそらく次にテーマを作るときも参考にさせてもらうと思いますので、思い切って全記事あつめ。

当ブログでカスタムしている部分をほぼ網羅出来ていると思います。

WordPress初心者の方にはちょい難しいかもですが、気になる記事あればブクマしたり、いつかのどこかのタイミングでお役立てくだされ。

さて、では。

新着記事や、人気の記事、関連記事にサムネイルを付けるプラグイン

この辺はプラグイン挿すだけで使えるようになるので、迷わず実践。

↑ショートコードで現在見てる記事と同じカテゴリの新着も取得表示可能。

人気記事のプラグイン。カスタムもかゆいところに手が届く感じ。

【ブログの人気記事をどこにでも表示することができる】「wordpress popular posts」のテンプレートタグを使ってトップページに人気記事表示 « 今村だけがよくわかるブログ

記事下の関連記事に、簡単にサムネを。

スポンサーリンク

テーマ・テンプレート・カスタマイズ記事

記事内、記事外、あると便利な改造です。

ベーシックな改造

アイコンフォント便利です。

jQeryが使えるようになると、より小回りの効く体験をブログでしてもらえるので、コピペからでも取り入れたいですね。

WordPressをカスタマイズする方法!便利なコードまとめ

テーマを自作するなら

STINGER3も素敵ですが、テーマのオリジナリティーも一つのコンテンツだと考えます。

↑おそらく、これ以上は簡単に書けないくらい詳しい。


WordPressをカスタマイズするなら絶対覚えておきたい条件分岐やカスタム投稿タイプなどいろいろ

レスポンシブでテーマを作るなら、条件分岐が使えないと、結構しんどいです。

テーマをカスタムするときに「出し分け」って概念が理解できるだけで思い通りになる部分が多いです。

WordPressでのデバイス振り分けプラグインの決定版「mobble」 | ウェブゴト

レスポンシブで組むと、大抵タブレットでしんどくなるので、↑こういうので、細かく条件分岐させてます。

トップページ

主にトップページやホームページで使えそうな改造。

広告と組み合わせることもこの条件分岐で出来ますね。

カテゴリーメニューをつくるなら、参考に。

パンくず・ページネーション

検索にも反映するから助かります。

ブログパーツ

まずは、ボタンやらまとめて。面倒ですが、自力でボタンを組み込むと、見た目等を自由にできます。

Twitterボタン。
Twitter Buttons | About

FBボタン
Like Button

FBlikeボックス
Like Box

はてブボタン。
はてなブックマークボタンの作成・設置について – はてなブックマーク

G+ボタン。
+1 ボタン – Google+ Platform — Google Developers

ここからは突っ込んだ使い方。

【Google+APIを使って「インタラクティブな投稿」をする方法】投稿から得られるデータもおもしろいです « 今村だけがよくわかるブログ

【Google+の新機能「Content recommendations」を使ってモバイルサイトにおすすめコンテンツを表示】WordPressに入れました « 今村だけがよくわかるブログ

あると便利なボタン。

pinterestボタン。
これは流行る!間違いなく導入したほうがいい Pinterest の Image Hover ボタン。WordPress にも実装。Pinterest の時代、くるで。 | ホホ冢次男

pocketボタン。
Pocket for Publishers: Pocket Button

Feedlyパーツ
feedly. your news. delivered.

bufferボタン。
The Buffer Button – Buffer

設定するといろいろ捗るTwitterカード。
【ツイートした時にブログの概要などを表示させよう】自分のサイトをTwitterCards(ツイッターカード)に対応する方法 « 今村だけがよくわかるブログ

2013年ブログのメタ情報で3倍得する設定まとめ。拡散性UP!高速化!最適化! | @attrip (アットトリップ)

この先はかなりお気に入り。

このページネーションはほんとオススメですね。

サイドバー

ifrrameやSNS系のパーツがレンダリング後に読まれても、サイドバーの高さをちゃんと計測してくれます。

サイドバー領域に何を置くかは頭の痛い問題なので、省スペースなタブメニューを考えてみてもイイと思います。

小ネタとはもはや呼べないだいぶ助かる改造

Instagram動画に対応で助かる。

WordPressの画像サイズを小さくして高速化するプラグインEWWW Image Optimizer | @attrip (アットトリップ)

最速のWordpressを手に入れるには、オブジェクトキャッシュが超オススメだ! | @attrip (アットトリップ)

Force Regenerate Thumbnails を使って画像を整理することのススメ、環境によっては画像ファイルが半分に。 | ホホ冢次男

PubSubHubbub、ブログの更新お最速でインデックスさせたいならこれ。 | @attrip (アットトリップ)

もう少し根本的な話し

スマホ対応、ちゃんと考えないとダメですね。

WordPressでスマートフォン用テーマを作成した時の5ステップ | Design Color

【ブログ術】スマホ表示の高速化!pagespeedで93点達成の攻略方法

モバイル対応はかなり重要だと思います。

WordPressの勉強になるブログ

  1. 今村だけがよくわかるブログ

    困った事を検索すると大抵かかる

  2. Ateitexe

    こちらもよくお世話になります。

  3. ホホ冢次男 | 開いた口が半開きになるブログ

    情報がはやい。一見雑に見えるけど、凄く丁寧。

  4. @attrip (アットトリップ)

    WordPress系の情報が濃い。

  5. おもたん

    記事は少なめですが、WordPress系のこってりした改造が楽しめます。

  6. ゆめぴょんの知恵

    WordPress高速化への執念がすごい。全て実践するのは難しいと思いますが、やり方を知っておくと捗ります。

  7. Webクリエイターボックス | WebデザインやWebサイト制作、最新のWeb業界情報などを紹介していくサイト。
  8. Webデザインレシピ
  9. かちびと.net

あとはもう鉄板ですかね。

テーマ作るのに参考にした本

機能や見た目を弄るには、ある程度WordPressの構造に詳しい方が捗ります。

まとめ

いかがでしたでしょうか。俺のwpフォルダが火を噴いた感じで、かるいやりきった感があります。

全部入り過ぎて、カテゴリくくるのが大変ですけど、テーマやテンプレート、プラグイン、高速化と、おそらくデフォルトのままよりも、一歩踏み込んだ機能がいっぱいです。

冒頭でも書きましたけど、気になる改造記事があれば是非ゆっくりと読んでみてください。

記事を書いてくれた方に感謝しつつ、自らの腕も鍛えたい所存です。はい。

次回の記事は
「逆張りじゃない逆行のやりかたってクールよね」
読みのがしなくッ!