シーサーブログユーザーはスマートフォンでもPCサイトを表示させよう

 シーサーブログのスマートフォンサイトは広告がいっぱいだ。

 ん?「スマートフォンサイトは設定して無い」って?

 残念でした。

 スマートフォンサイトは自動的に出来ちゃってるのだ。

 シーサーブログユーザーは、一度スマートフォンで自分のブログにアクセスしてみるといい。

 いつの間にかスマートフォンサイトが出来ているから!

 しかも、べたべたと広告がいっぱいである。

シーサーブログユーザーはスマートフォンでも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デザインというのだそうだ。

コメント

  • ありがとうございます。あなたは神様みたいな存在です。助かりました。

    by 匿名    2015年2月26日 3:24 PM

  • 出来るわけ無いと思っていたので、かなり満足です!
    ありがとう!

    by 匿名    2015年3月13日 8:37 AM

  • 記事中の
    「『自由欄形式』を『ブログタイトル』の上に設置し、『自由形式』以外のコンテンツを削除。」
    を実施すると、デフォルトの「ブログタイトル」と「ブログ説明」が表示されなくなりませんか?

    by 匿名    2015年3月31日 10:14 PM

  • 元に戻方法を教えてください。

    by サッチー    2015年4月4日 1:25 PM

  • 本当にありがとうございました。
    ブログにお店の情報を載せていて、
    スマホの時代になり勝手にスマホ表示されるように悩んでました。
    ホームページを作らずにすんで良かったです。
    感謝、感謝です!

    by miki    2015年5月6日 9:28 AM

  • この記事を見て、これでやっていたんですけど、モバイルフレンドリーには対応してないですよね。
    モバイルフレンドリーに対応するにはやはりスマホサイトも作らないとダメでしょうか?

    by 匿名    2015年5月20日 1:07 AM

  • >モバイルフレンドリーに対応するにはやはりスマホサイトも作らないとダメでしょうか?
    「レスポンスウェブデザイン」にすればいいでしょ。
    そうすれば、PCもタブレットもスマホもすべての画面に適合し、モバイルフレンドリーなブログに仕上がるよ。

    >サッチー
    上の説明の逆をやれば、もとに戻るよ。
    要は、入力した部分を削除せよ。

    by xxx    2015年6月10日 1:42 PM

  • こんなにも簡単にできる方法を無料公開とは恐れ入ります。
    そしてありがとうございました。

    by 名無し    2015年7月3日 11:12 PM

  • 利用させて頂いてます。ありがとうございます。

    質問なのですが
    コメント欄のサイズが大きいらしく
    画面が動いてしまいます。
    cssでサイズを変えればいいのでしょうか。
    初心者ですみません・・・。

    by aya    2016年2月3日 8:57 AM

  • めちゃめちゃ参考になりました。
    ありがとうございます。

    by ひろのゴルフ日記    2016年5月5日 3:27 PM

  • HTML?の知識が全くない私でもできました!
    ありがとうございました(*´∀`)♪

    by 匿名    2016年6月6日 11:32 AM

  • クッキーが無効になっているブラウザで、無限ループになってしまいました。、

    by daikon    2016年8月15日 8:14 AM

  • シーサーブログの「スマートフォン専用ページを表示」を消す方法ですが、#iphone-link { display: none !important; }は、
    どこに追加すればよろしいのでしょうか?

    by 匿名    2016年8月22日 10:45 PM

  • スマホで、PCサイトを表示できました!
    どうもありがとうございます。

    ちなみに、シーサーブログの「スマートフォン専用ページを表示」を消す方法ですが、#iphone-link { display: none !important; }をスタイルシートのどの部分に追加したらよいのでしょうか?

    by mick    2016年8月24日 6:59 AM

  • 出来ました☺
    これでアドセンスpv少しは上がります!
    助かりました。ありがとうございます❗

    by 匿名    2016年11月10日 6:57 PM

  • 「デザイン」⇒「デザイン設定」⇒適応しているスタイルシートをクリックしました。
    #iphone-link { display: none !important; }
    はHTMLのどこに追加すれば良いですか?
    よろしくお願いします。

    by kenta    2016年11月18日 11:09 AM

コメントを残す




*

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

関連記事

Googleアドセンスってなに?
description次第で検索順位が変わる・訪問者が増える
FC2ブログの記事をテキストエディタでWordPress用に書き換えよう
WinSCPのバージョンアップ
FC2ブログにアップロードした写真のGPS情報を確認する方法
wordpressテーマSTINGER3のサイドバー【NEW ENTRY】のアイキャッチ画像を削除
メタデーターdescriptionsでサイトの訪問者を増やそう
WordPress4.0、「ウインドウの高さに合わせてエディターを広げる」機能のON・OFF
GooglePlayアプリのダウンロードサイトへのリンクバナーを作ろう
FC2ブログ記事直下に広告とランキングを自動的に挿入する
wordpressでPCと他のデバイスで表示を変える関数(タグ)
FC2ブログの記事をワードプレスにインポート
シーサーブログの最近の記事の設定の仕方
WordPressで使っていない画像を探して削除
ページタイトルの問題点と改善点を把握して訪問者を増やそう

Menu

HOME

 TOP