Follow @papepo100
    

FC2ブログのスマホサイトでユーザタグを使える様にする方法

ブログパーツ
0 0 2016/12/10
sptag.png FC2ブログのプラグインにスマホサイト用のユーザタグがなかったので自分で作ろうとしました。
ところが、スマホ用プラグインのフリーエリアを作成してPCサイトと同じ様に下記を実装しても出力されない。。
<p class="plugin-tag" &align>
    <!--ctag-->
        <a href="<%ctag_url>"><%ctag_name></a>    
    <!--/ctag-->
</p>
何でかなっと思ってFC2ブログ変数の仕様を読んでみると <!--ctag--><!--/ctag-->はサイドバーメニュー用のタグであるとの事。。
なぜこんな縛りをするんだと思いながら、何とかする方法を検討し、結局、XMLHttpRequestを利用して、PCサイトからサイドバーに設置しているユーザタグをとってくることにしました。

スマホ用のテンプレートを開いて<head>~</head>内に以下の関数を用意し、 (PCサイトのプラグインでユーザタグを一番最初に設置していることを前提にしています。)
<script>
function getTagCloud() {
    var doc = new Object();
    var dom_parser = new DOMParser();
    var http = new XMLHttpRequest();
    http.open('GET', "<%url>?pc", false);
    http.send();
    if (http.status == 200) {
        doc = dom_parser.parseFromString(http.responseText,"text/html");
    }
    tags = doc.getElementsByClassName('plugin-tag');
    if (tags.length > 0) {
        document.write(tags[0].outerHTML);
    }
}
</script>
sptag2.png プラグインのフリーエリアで「フリーエリアの設定」で以下の様に呼び出します。

<script type="text/javascript"><!--
getTagCloud();
//--></script>
sptag3.png スマホビューで確認したところ一番目の画像の様にユーザタグのリストが表示されました。
ところが、適当なユーザタグをクリックしてみたところ、PCサイトが開いてしまいます。
sptag4.png そこでマニュアルでURLの末尾に&spをつけてみるとトップページに飛ばされてしまいました。。
続きは次回の記事で。。
スポンサーサイト
このエントリーをはてなブックマークに追加

コメント

非公開コメント