シーサーブログのスマートフォンサイトは広告がいっぱいだ。
ん？「スマートフォンサイトは設定して無い」って？
残念でした。
スマートフォンサイトは自動的に出来ちゃってるのだ。
シーサーブログユーザーは、一度スマートフォンで自分のブログにアクセスしてみるといい。
いつの間にかスマートフォンサイトが出来ているから！
しかも、べたべたと広告がいっぱいである。
シーサーブログユーザーはスマートフォンでもPCサイトを表示させよう
シーサーブログのスマートフォンサイトの広告、消すことも、場所を動かすことも出来ない。
なぜなら、シーサーブログはスマートフォンサイトのHTMLを公開していないから。
そのくせ、なぜか携帯用のサイトでは広告がほとんど無い。
しかもスタイルシートもHTMLも公開されている。
まあ、無料ブログにとっては、広告収入がほしいってところだろうから仕方が無いといえば仕方が無い。
が、あまりにも広告が多すぎる。
シーサーブログはスマートフォンでもPCテンプレートで表示させた方がいいと思う。
スマートフォンでPCサイトを表示させるには？
スマートフォンでシーサーブログを見たときにPCサイトを見せるための方法はちゃんとある。
1、『デザイン』→『スマートフォン』→『コンテンツ』とクリック。
2、『自由欄形式』を『ブログタイトル』の上に設置し、『自由形式』以外のコンテンツを削除。
3、『自由形式』をクリックし、以下を記載。
<SCRIPT LANGUAGE="JavaScript">
<!--
document.cookie = 'force_pc=1; max-age=15768000; path=/';
document.cookie = 'force_sp=0; max-age=15768000; path=/';
location.href=location.pathname;
setTimeout("autoLink()",1000);
// -->
</SCRIPT>
4、『保存』ボタンをクリック。
5、『保存』ボタンをクリック。
これで、スマートフォンで閲覧してもPCサイトが表示されるようになる。
さあ、シーサーブログユーザーはスマートフォンで自分のブログを見てみよう。
PCサイトで表示されているものと同じサイト表示が見れる。
が、そこには大きな「スマートフォン専用ページを表示」の表示が！！！
さあ、この「スマートフォン専用ページを表示」をどうする？
シーサーブログの「スマートフォン専用ページを表示」を消そう
「スマートフォン専用ページを表示」は、PC用テンプレートのHTMLの中にも、コンテンツHTMLの中にもそれらしい記載が無い。
どうも、シーサーブログにデフォルトで設定されているらしい。
ここはスタイルシートにdisplay: noneというのを追加して、「スマートフォン専用ページを表示」を表示されないようにしてしまおう。
display: noneの効果
display: noneで指定した部分は、表示されない。
表示されないだけでなく、領域もなくなる。
「スマートフォン専用ページを表示」という表示が出ていた部分が隙間無く表示されなくなる。
display: noneの使用で表示を消すとSEO上問題があるか？
ここで、気になるのは、検索エンジンなどでスパムとみなされないかという点だが、「正当な理由で利用する限り問題がない」という話が米GoogleのエンジニアMatt Cutts氏から出ているそうだ。
要は、display: noneで表示させない部分に、やたらに複数のテキストを入れたりしない限り今のところ問題ないということらしい。
シーサーブログの「スマートフォン専用ページを表示」を消す方法
1、「デザイン」⇒「デザイン設定」⇒適応しているスタイルシートをクリック。
2、#iphone-link { display: none !important; }を追加。
3、保存をクリック。
これで、「スマートフォン専用ページを表示」が消える。
後は、PC用のテンプレートやスタイルシートをPCでもスマートフォンでも閲覧できる形に変えるだけ。
この、PCでも、スマートフォンでも適切な表示がされるサイトのデザインをレスポンシブWebデザインというのだそうだ。
コメント
ありがとうございます。あなたは神様みたいな存在です。助かりました。
出来るわけ無いと思っていたので、かなり満足です！
ありがとう！
記事中の
「『自由欄形式』を『ブログタイトル』の上に設置し、『自由形式』以外のコンテンツを削除。」
を実施すると、デフォルトの「ブログタイトル」と「ブログ説明」が表示されなくなりませんか？
元に戻方法を教えてください。
本当にありがとうございました。
ブログにお店の情報を載せていて、
スマホの時代になり勝手にスマホ表示されるように悩んでました。
ホームページを作らずにすんで良かったです。
感謝、感謝です！
この記事を見て、これでやっていたんですけど、モバイルフレンドリーには対応してないですよね。
モバイルフレンドリーに対応するにはやはりスマホサイトも作らないとダメでしょうか？
＞モバイルフレンドリーに対応するにはやはりスマホサイトも作らないとダメでしょうか？
「レスポンスウェブデザイン」にすればいいでしょ。
そうすれば、PCもタブレットもスマホもすべての画面に適合し、モバイルフレンドリーなブログに仕上がるよ。
＞サッチー
上の説明の逆をやれば、もとに戻るよ。
要は、入力した部分を削除せよ。
こんなにも簡単にできる方法を無料公開とは恐れ入ります。
そしてありがとうございました。
利用させて頂いてます。ありがとうございます。
質問なのですが
コメント欄のサイズが大きいらしく
画面が動いてしまいます。
cssでサイズを変えればいいのでしょうか。
初心者ですみません・・・。
めちゃめちゃ参考になりました。
ありがとうございます。
HTML?の知識が全くない私でもできました！
ありがとうございました(*´∀`)♪
クッキーが無効になっているブラウザで、無限ループになってしまいました。、
シーサーブログの「スマートフォン専用ページを表示」を消す方法ですが、#iphone-link { display: none !important; }は、
どこに追加すればよろしいのでしょうか？
スマホで、ＰＣサイトを表示できました！
どうもありがとうございます。
ちなみに、シーサーブログの「スマートフォン専用ページを表示」を消す方法ですが、#iphone-link { display: none !important; }をスタイルシートのどの部分に追加したらよいのでしょうか？
出来ました☺
これでアドセンスpv少しは上がります！
助かりました。ありがとうございます❗
「デザイン」⇒「デザイン設定」⇒適応しているスタイルシートをクリックしました。
#iphone-link { display: none !important; }
はHTMLのどこに追加すれば良いですか？
よろしくお願いします。
＞#iphone-link { display: none !important; }
はHTMLのどこに追加すれば良いですか？
でお悩みの皆様、私のケースでは、/* twitter quote */の直前の行に追加したところ、うまくいきました！
＞管理人さま
上記の方法に誤りがありましたら、ご指摘いただけますと幸いです。
非常に役立つ情報、ありがとうございました！！！
こんにちは、貴重な情報をありがとうございます。
質問があります。
2、『自由欄形式』を『ブログタイトル』の上に設置し、『自由形式』以外のコンテンツを削除。
と書いてある通りにしたかったのですが、
『デザイン』→『スマートフォン』→『コンテンツ』とクリックして開いても、まず自由欄形式と書かれているものが見当たらず、
どこをクリックしてもなんの反応もありません。
わたしが開いて見ているページを写真で送って見ていただくことは可能でしょうか。
上の方の補足で
＞#iphone-link { display: none !important; }
はHTMLのどこに追加すれば良いですか？
デザイン→PC→デザイン設定→今設定してるデザインをクリック→スタイルシート編集
で一番下にある/* twitter quote */の直前の行に追加してうまくいきました！
“PC”のスタイルシート編集ってことに気が付かずスマートフォンの方ばかりでやって苦戦していたので、同じような方がいれば参考になればと思います！
＞つきいち Riderさん
お陰様で「スマートフォン専用ページを表示」を削除出来ました！ありがとうございました！
＞管理人さん
めちゃくちゃ分かりやすく感謝しています(;O;)ありがとうございました！
助かりました！