こっそり始める Blog

miwaを全力応援!菓子パンはスイーツ!iPhone大好き!

こっそり始める Blog header image 2

WordPressプラグイン WP Pagenavi Styleでページ番号付きリンクを簡単にカスタマイズ

2012年08月16日 · コメント(0) · WordPress



こんばんは。

桐光学園松井のピッチングを生で見てみたい @tar0073 です。
初戦は22奪三振、今日の2戦目は19奪三振!
まあ5失点したりと安定感はないようですが、将来が楽しみな一人です。

SPONSORED LINK

Pagenviの表示がイマイチ

本日のエントリーで紹介したPagenaviのリンク表示ですが。。。
イマイチなんです。

スクリーンショット 2012 08 16 19 14 27

何故かはわかりませんがリンクの枠線が1本、下が表示されないんです。
pagenavi-css.cssをいじったんですが全く直らず。
しかし!WordPressにはこんなものまであります!

WordPress プラグイン WP PageNavi Styleを入れてみる

WP-Pagenaviを入れてもいちいちカスタマイズするのが面倒って人用のプラグインw
WP pagenavi Styleです。
ダウンロードは以下のサイトから。

WordPress › WP PageNavi Style « WordPress Plugins

WP Pagenavi Style

それでは早速インストールして設定してみましょう。

スクリーンショット 2012 08 16 17 33 22

インストール後有効化すると管理画面にPageNvi Styleというメニューが表示されます。
クリックすると設定画面が表示されます。

スクリーンショット 2012 08 16 17 34 42 1

設定は簡単で矢印で指しているところクリックすると登録されているデザインが表示されるので好きなものを選択するだけです。
デザインを選んだらSave Settingsをクリックして完了です。
簡単ですね!

登録されているデザインで気に入らなければオリジナルも作成可能です。

スクリーンショット 2012 08 16 17 37 32

画像のように上のメニューからCustomを選択すればOKです。

スクリーンショット 2012 08 16 17 35 34

Customにすると上のようにオリジナルカスタマイズが可能になります。
プレビューがないので確認しつつ変更しなくてはいけないのが面倒なんですけどね。

少し呪文なども

簡単にカスタマイズが出来るんですが少々不具合があります。
環境やテーマにもよるのかも知れませんが、表示位置を変えるためには直接CSSにコードを追加する必要があるんです。

wp-pagenavi-style>cssフォルダにある使用しているデザインのCSSを探し出して下さい。
センター表示させる場合、そこに以下のように追加します。

text-align: center;

右寄せや左寄せの場合はそれぞれ同様に書き込んで下さい。
たった1行追加するだけなんで誰にでも出来ますね。

そんな感じで出来たものがこれです

スクリーンショット 2012 08 16 19 27 00

なかなかいい感じに出来上がりました!

。。。ん?これって、使いたいデザインのCSSファイルからpagenavi-css.cssにコピペすればいいんじゃねえの?とふと思いつきましたw
まあプラグインをあまり増やしたくない人はコピペでもOKってことですなw

SPONSORED LINK



タグ : ···

コメント(0)

コメントはまだありません。

コメントする

CAPTCHA


Get Adobe Flash playerPlugin by wpburn.com wordpress themes