まったくもって時代と逆行しているんですが、どうしても Seesaa ブログのスマートフォン版へのアクセスを無効にしたい。

スマートフォン版へのアクセスを無効にするというのは適切な表現ではないですね。アクセスするのはユーザ側の意向だし。

要するに「iPhone や Android 端末でアクセスしてきたユーザはスマートフォン版のページを開くのではなく、デスクトップ版のページへ強制的に飛ばしたい」のです。

スマートフォンの爆発的な普及によって、スマートフォン非対応のブログをスマートフォンに対応させる方法という解説はたくさん見つかります。しかし、この真逆であるスマートフォン版は表示させない方法という解説は2012年5月現在ひとつも見つからない。なのでちょっと考えて実装してみました。

Seesaa ブログはクッキーでデバイスをコントロールしている

「スマートフォンからのアクセス（media type が handheld で且つ 画面サイズが xxxピクセル以下）だったら http://myweblogblog.seesaa.net/s/ ではなくて http://myweblogblog.seesaa.net/ へリダイレクトしなさい」というやり方でオッケーかと軽く考えていました。

ところが、Seesaa スマートフォン版のHTMLソースを見ると、メディアではなくクッキーで制御しているようで。。。いろいろと試行錯誤を繰り返していますが、結局、スマートフォンでアクセスしてきたユーザを強制的にデスクトップ版に飛ばすスマートなやり方が見つからず結局、どうしたかというと・・・

スマホページにデスクトップへ戻るクッキーリンクを貼る

Seesaa ブログは "force_pc" というクッキーを作り、このクッキーを読んで デスクトップ版（PC版） / スマホ版の表示を振り分けているようです。そこでデスクトップ版のソースにスマートフォン版へ飛ばすリンクをコピペしてきて、それにちょっと手を加えます。そのリンクをクリックすればデスクトップ版へ飛ばす force_pc クッキーを書き換え、それ以降はデスクトップ版が表示されるという流れになります。

まず、スマートフォンのデザイン − コンテンツを開いて、「ブログタイトル」、「ブログ説明」の２つのコンテンツを残し、それ以外は全てゴミ箱へ捨てます。

次に、自由形式のコンテンツをヘッダー領域の先頭に追加します（記事コンテンツの領域ではありません。図参照）。

この自由形式コンテンツに下記のコードを記入します。

<script>
document.cookie = 'force_pc=1; max-age=157680000; path=/';
document.cookie = 'force_sp=0; max-age=157680000; path=/';
var url = location.href;

document.write('<meta http-equiv="refresh" content="0; URL="' + url + '">');
</script>

[保存]ボタンで保存してコンテンツは完了です。

上記のリンク部分は、スマートフォン版が開かれたときに表示される「デスクトップ版」に記述されているコードをそのまま使用しています。

このままだと転送されるまでの間にSeesaa広告が表示されまくるので CSS で body全体を非表示にします。

body{display:none}

スマートフォンでアクセスしてきたユーザはスマートフォン版のページをいったん開く。そこにデスクトップ版へ誘導するリンクがあるのでクリックしてもらう。そしてデスクトップ版へ、という流れになります。スマートフォン版にアクセスしたスマホユーザは数秒でPC版へ転送されます。

クッキーの有効期限は15768000秒なので半年間。閲覧者がブラウザからクッキーを削除しない限り半年間は強制的にPC版に飛ぶことになります。

PC版に飛ばすJavaScriptはコレが一番安定している

スマホ版からPC版に飛ばすとき、スマホ Seesaa 広告の JavaScript の処理が完了するまで時間が掛かることがあります。普通に永久ループに見える。

結構いろいろなパターンの JavaScript で検証しましたが、最も安定して永久ループをほとんど起こさないコードが上記のものです。他の書き方だと不安定です。

スマホからのアクセスユーザを強制的にデスクトップ版に飛ばす理由は Seesaa スマホテンプレートが広告だらけだから以外の何物でもありません。ただ、デスクトップ版のテンプレートがそのままではスマホユーザは読みづらくてお話になりませんから、レスポンシブデザインにカスタマイズすることになります。

スマホ版からデスクトップ版へ強制的に飛ばしてしまう方法と、Seesaa ブログを手っ取り早くカンタンにレスポンシブにカスタマイズする方法は併せて「Seesaaブログスマホ広告を消す悩みを消す方法」で紹介しています。

Seesaaブログのスマホ版で表示される広告などを非表示にしたい

スマホの広告ってウルさ過ぎますよね。禁じ手ではありましょうが、非表示に出来るものは非表示にしてしまいたい。スマートフォンのデザイン CSS に下記を貼り付けてます。

/*--- 広告を非表示 ---*/
[id*="adArea"]{visibility:hidden;height:0px;}
[id*="jt:seesaa_seesaa"]{display:none;visibility:hidden;height:0;}
[class*="adlantis"]{visibility:hidden;}
[id*="adblock"]{display:none;visibility:hidden;height:0px;}
[class*="ad_block"]{display:none;visibility:hidden;height:0px;}
[class*="seesaaAdA"]{display:none;visibility:hidden;height:0px;}
.seesaa-adLink, .adlink, .adBoth, .adText, .adUrl, .adImage, .adSponsor, .adSponsorUrl, .adHr{visibility:hidden;height:0px;width:0px;}
[class*="ad_frame"]{display:none;visibility:hidden;height:0px;}
[class*="adlantis_sticky_zone"]{display:none;}
[id*="androidGame"]{display:none;visibility:hidden;height:0px;}
[class*="ichioshi"]{display:none;visibility:hidden;height:0px;}
[class*="top-ad"]{display:none;visibility:hidden;height:0px;}
[class*="im_ad"]{display:none;visibility:hidden;height:0px;}
[class*="androidgame"]{display:none;visibility:hidden;height:0px;}
[id*="iphonead"]{display:none;visibility:hidden;height:0px;}
[id*="iphoneFooterAd"]{display:none;visibility:hidden;height:0px;}
[id*="androidFooterAd"]{display:none;visibility:hidden;height:0px;}
[id*="adstir_ad"]{display:none;visibility:hidden;height:0px;}
[class*="seesaa-adBox"]{display:none;visibility:hidden;height:0px;}
[class*="adBox"]{display:none;visibility:hidden;height:0px;}
[class*="adTitle"]{display:none;visibility:hidden;height:0px;}
[id*="adcon"]{display:none;visibility:hidden;height:0px;}
[id*="imobile_adspotdiv"]{display:none;visibility:hidden;height:0px;}
[id*="nend_adspace"]{display:none!important;visibility:hidden!important;height:0px!important;}

/* スマートフォン版で表示のリンクを非表示 2014年5月追記*/
#iphone-link{display: none !important;}

ひとしきり広告関連に display:none を追加していますので、如何なものかとは思いますが。もっとスマートなやり方があるのかもしれませんが、上のやり方で暫定対応です。Seesaa のスマートフォン版HTMLがカスタマイズできればベストですけど仕方ありません。

こちらの記事「Seesaaブログの「スマートフォン専用ページを表示」を消す (改修版)」で、上記の最新版を紹介しています。併せてご参照ください。

追記：2014年5月25日
※上記の CSS は 2014年5月現在、Basic テンプレートに対応したアップデート版のご紹介があります。こちらの最新記事を参照ください。

追記：2014年5月28日
修正を加えた最新版があります。こちらの最新記事をご参照ください。

追記：2015年6月7日
スマホ版広告をスッキリ消すスタイルシートの更新は１つの記事に統一しました。
» Seesaaスマホ版Basic/Photoテンプレート究極のカスタマイズ