WordPress で SlideShare サムネイルを oEmbed で取得

SlideShare

SlideShare は、プレゼンテーションのスライド共有サービスです

登録していなくても公開されているスライドを見ることができます

いま話題の技術に関して知りたいという時などに、SlideShare を検索すれば簡潔にまとまった資料が見つかることが多いので大変重宝します (^^)

Powerpoint, LibreOffice, PDF等で作成した資料を公開できるようですが、私自身はもっぱら読むだけなので登録の仕方等については調べて下さい　m(__)m

SlideShareを記事に埋め込む

SlideShare は、既にWordPressでサポートされていますので、特別にプラグイン等を使用しなくても直ぐに記事に埋め込むことが出来ます

埋め込みたい SlideShare のスライドがあったら、そのURLをコピーして投稿記事に貼り付けるだけです

埋め込むとこんな感じで表示されます

ここで　あれちょっと大きめに表示されてるなと思った方　さすがです　(^^)

レスポンシブに対応するために、jQuery の FitVids.js にちょっと追加の記述をしています

// Target your #container, #wrapper etc.
//ほとんどのテーマでコンテンツは entry-content class になっている
$(".entry-content").fitVids({
    customSelector: [
        "iframe[src*='slideshare']"
    ]
});

こわくない Git from Kota Saito

ブラウザの幅を変えるとうまくフィットしているのが確認出来ます　(^^)

SlideShare のサムネイルを取得

前回までに Vimeo, youtube, Vine, Instagram, Flickr のサムネイルを取得する方法で紹介した oEmbed を使って SlideShare サムネイルの取得をやってみます

前回までの記事は下記を参照して下さい

今回もほとんど同じように出来ますが、サムネイルが小さいのでスライドのイメージからサムネイルを生成してみました

サンプルプログラム

プログラムは、$post_content に入っているコンテンツ内を正規表現を使い SlideShare のURLからIDを取得します

最初に正規表現でマッチしたIDを使い json 形式のデータを取得します

//SlideShare サムネイル画像
if(empty($thumburl)){
    if( preg_match_all('#(^|\])\s*https?://(www\.)?slideshare\.net/([a-z0-9_\-/]+)\s*#im', $post_content, $matches)){
       if(!empty($matches[3][0])){
            $obj = $this->oembed_cache_get("http://www.slideshare.net/api/oembed/2?format=json&url=http://www.slideshare.net/{$matches[3][0]}");
            if ( is_object( $obj )){
                if(!empty($obj->slide_image_baseurl)){
                    $thumburl = "http:" . $obj->slide_image_baseurl . "1" . $obj->slide_image_baseurl_suffix;
                    $atrsize = array('width' => $obj->width, 'height' =>$obj->height);
                }
            }
        }
    }
}

ちなみに oEmbed の問い合わせが多くならないようにキャッシュを利用します

/**
 * oEmbed データ取得
 * transient キャッシュを用いて効率化する
 * 
 * @param string $url   oEmbed 問い合わせ用URL
 */
public function oembed_cache_get($url) {
        
    $key = md5( 'celtis_embed_' . $url );
    $cache = get_transient( $key);
    if($cache !== false){
        $obj = json_decode( $cache );
    }
    else {
        $response = wp_safe_remote_get( $url );
        if ( ! is_wp_error( $response ) && $response['response']['code'] === 200 ) {
            $obj = json_decode( $response['body'] );
            if ( is_object( $obj ) && !empty( $obj->type ) ){
                //oEmbed データをキャッシュしておく
                set_transient( $key, $response['body'], DAY_IN_SECONDS);
            }
            else {
                $obj = '';
            }
        }
    }
    return($obj);
}

参照　slideshare.net/developers/oembed

oEmbed 取得データ