プラグイン

WP Social Bookmarking LightをArthemia用に編集する

前の記事でWP Social Bookmarking Light を入れてみたと書いてみたものの、実はすんなりインストールできたわけでなかった。

どうも本宅の方で使っているWordpressのテーマ「Arthemia」のCSSとぶつかるのか、アイコンを整列させてみると、下のように変な点が一緒に表示される。仕方がないので、ソースを編集することにした。

ソース名称：wp-social-bookmarking-light/wp-social-bookmarking-light.php

ソースを見てみると、アイコンの整列には、ul と li のタグを使用してCSSでレイアウトを指定しているみたい。CSSの命令がテーマと干渉して、うまく表示できないようだ。
そこで、ul と li のタグを除くことにした。

［その作業の覚え書き］
ソースの文頭の辺りの下記の部分からliタグを除く

[php]
function link_raw( $url ){
return ”

  • “.$url.”

    • “;
    }
    [/php]
    ↓

    [php]
    function link_raw( $url ){
    return ” “.$url.” “;
    }
    [/php]
    半角スペースを入れると、ブログ上に表示した時に、アイコンとアイコンの間にその分のスペースが空く。

    後半の方にある下記のソースから、ulタグとクラス定義文を抜く

    [php]
    return ”

      {$out}


    “;
    [/php]
    ↓
    抜いた上で、少し修飾して下記の様に編集。ここは好きにレイアウトすればよし。
    ↓

    [php]
    return ”

    {$out}

    “;
    [/php]

    [php]

    [/php]
    このdivタグは、Arthemiaのテーマ内では、横線を引いてくれるよう定義してある。hrタグのようなもの。

    以上の改造が終わると下記の様にちゃんと表示。

    ※ WP Social Bookmarking Lightのプラグインがアップデートする都度、書き直すこと。
    ※ WP Social Bookmarking Light　1.6.0　時の話です。

    ただ、この方法は問題もあって、使用しているTwitter button、Facebook like、hatena bottun 以外のアイコンも並べると、上下がずれる。当面は、この三つが欲しかったので、それ以外を表示しないことにして、問題を先送りしたのだが、mixiやGreeのボタンも並べたいなあ。

    ※この話はArthemia Premium (ver1)に関してのものです。

    記事の共有：