病的溺愛シンドローム > web制作者のメモ帳 > WordPress Tips > WordPressの上部にスライドするパネルを表示 – Sliding Panel

WordPressの上部にスライドするパネルを表示 – Sliding Panel

Posted on 2009年10月20日 | 6 Comments

最近追加したいプラグインが思いつかなかったりするんだけども
そんなことを言ってるとブログを更新できないので
WordPressの上部に開閉するエリアを追加するプラグイン
Sliding Panel
をインストールして試してみた。

サイドバーと同じようにウィジェットに追加されて、
画面の右上に表示されている「Open」をクリックすると
隠れていたパネル（トップバー？）が開く。
という感じのもの。
そんなのテーマファイルでやればいいじゃん(´ー｀)┌
とかいう玄人の方はスルーしてくださいｗ
Sliding Panel は特定のテーマを使っていれば有効化するだけで、
他のテーマの場合は一行追加するだけで使える便利プラグイン。

インストールはいつも通りプラグインディレクトリにアップロードして有効化。
「外観」→「ウィジェット」にSliding Panelが追加されているので
サイドバーのウィジェット同様、表示させたいものを放り込むだけ。

Sliding Panelをインストールするとウィジェットに追加される

多くの場合は対応するテーマを使ってないと思うので
テーマファイルの header.php を開いて body タグの後に

PLAIN TEXT
PHP:
  1. <?php if ( function_exists( 'get_sliding_panel' ) ) get_sliding_panel(); ?>

を追加する。

これでどうなるかというと、ブログの右上に「Open」ボタンが出て

右上に注目。「Open」のボタンが表示される。

「Open」をクリックすると、うにょーんとスライドしてバーが出てくる。
「Close」をクリックするとスライドして閉じる。

スライドパネルが出てくる

このブログの背景が黒なもんで、なんだか分かりにくい画像で申し訳ないashamed0006.gif

サイドバーのびのび症候群にはさりげなく便利な気がするけど
デフォルトの状態では高さが150pxで、はみ出すと切れるので
もうちょっと高さがほしいとか、項目名の文字を小さくしたいとか、
そういうときは Sliding-panel の中に入っている panel.css を編集しよう。

残念ながらこのブログではいろんなjQueryが動きすぎのようで
IEで開くとエラーが出てしまったので採用しなかったけど
これはなかなかお手軽でカッコイイのでお気に入り。
機会があればどこかで使いたい。



関連記事：


この記事は 2009年10月20日火曜日 の 11:54 PM に書きました。　
この記事のフィードはRSS 2.0で購読できます。

« | »

6 Comments for this entry

  • おいち
    10月 21st, 2009 on 5:08 AM

    (#^.^#)/おはようございます♪
    唯奈さん、いやー探しましたよぉ :ase:
    無い無い無い・・・と思ったら
    結局は試験的で、採用までは踏み切らなかったと言うことか！
    ＩＥで開くとエラーになるのが不採用の理由みたいだね～ :uwa-n:

    > うにょーんとスライドしてバーが出てくる。

    この様を、実際見たかったよｗｗｗ
    カッコよかったんだろうね～
    でも、うにょ～んってどんな感じぃ！！

    返信
    • 唯奈
      10月 23rd, 2009 on 3:42 AM

      ＞おいちさん
      (*^-^*)/こんばんは～♪
      あ、やっぱり探しちゃいました？＾＾；
      動作を確認してすぐ削除しちゃったんです。
      紛らわしかったですね＾＾；
      すみません。

      うにょーんって出てくるのは、このブログでクリックすると拡大する写真が出てくる動きと同じ感じです。

      返信
  • cyokobo2
    10月 21st, 2009 on 8:07 AM

    ふむ　ふむ＾＾＠
    読み進めるほど :oteage: :ase:
    いつも通りで :nice:

    返信
    • 唯奈
      10月 23rd, 2009 on 3:44 AM

      ＞cyokobo2さん
      最近は心がけてWordPressネタに（実際はひたすらプラグイン実験だけど）偏ってるので
      WordPressユーザー以外には面白くもなんともない内容ですみません＾＾；

      返信
  • cyah
    10月 22nd, 2009 on 12:47 AM

    ＞食べ放題や猫など愛するものを綴ります

    と言う記載があるのだから、無理にWordPressに固執する必要も無いと思うのですが。（こちらへおいで〜（笑）） :mrgreen:

    今回の記事を読んで「NINJA TOOL」を思い出しました。（向こうはアフェリ専用みたいですが。） :bye:

    返信
    • 唯奈
      10月 23rd, 2009 on 3:48 AM

      ＞cyahさん
      そういえばそう書いてありましたよね。
      すっかり忘れ去ってました。
      修正しないとなぁ…。
      内容の割合をどうにかしようと思って意図的にWordPressネタを探してます。
      WordPressの何か　/越えられない壁/　猫・サボテン　＞　その他
      の割合にしたいんですよねぇ。。。
      思ってるだけで実現してませんが＾＾；

      NINJA TOOLはよく分からないです。
      なんかいろいろ機能があるあれかなぁ…。

      返信

コメント

XHTML:タグが使えます：　<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

:zzz: :wink: :v: :uwa-n: :un: :twisted: :sikusiku: :rose: :roll: :photo: :oteage: :oops: :obake: :niyari: :nice: :naku: :munekyun: :mrgreen: :meramera: :lovelove: :love: :lol: :ke: :kanpai: :kaminari: :kame: :ikari: :ice: :hint: :heart: :hatena: :gurume: :gun: :evil: :ehe: :denden: :cry: :check: :cat: :bye: :boon: :blue: :bikkuri: :be-: :ashi: :ase: :arrow: :akubi: :?: :-| :-x :-o :-P :-D :-? :) :( :$: :!: 8-O 8)

ビールをおごる

Image of a beer - if this shows instead of the picture, you did not install the plugin corectly
154 Beers Received

サイトの歩み

2010年2月27日に2周年を迎えます
2周年まであと…

レキシ…

オープンから
1 year, 11 months, and 11 days 経過。
97.7% done