ありのごとくあつまりてFC2ブログカスタマイズ,共有テンプレート,素材リンク集,フリーソフトの紹介など。 迷子にならないブログ作りを目指し... 何か1つでも お役に立てる情報 を提供できたらいいなぁと思っています。

このページの記事目次 (2011年09月 の記事 2 件)

  ← 前の月へ 2011年09月 次の月へ →

スマートフォン用テンプレートのプレビュー方法

2011/09/10 (土)  カテゴリー: ブログカスタマイズ上級

FC2ブログを スマートフォン(iPhone, Android, Windows Mobile 等) 及び iPod touch から閲覧する時に適応される テンプレート、これをカスタマイズ出来るようになりました! 2011年8月30日頃~ 一部サーバーで導入, 2011年9月7日 公式アナウンス 有り

iPhone 3G/4G tester でスマートフォン用テンプレートをプレビューしたもの

でも、「iPhone とか持ってないし...」 という方も多いですよね。 私も持っていないので 殆どが手探りの状態ですが、スマートフォンを持っていなくてもプレビューすることは可能ですので、その方法をいくつか紹介します。

まず、知りたいのは 今どんな見え方になっているかですよね。 現在FC2ブログで用意されている スマホ用公式テンプレートは 2種類あるのですが...

追記 (2012/04/24) :
今は 公式・共有で100種類以上の スマートフォン用テンプレート が使えるようになっています。

FC2ブログ Webクリップアイコン 
(apple-touch-icon.png)

IE や Sleipnir 等 (Trident エンジン) のブラウザでは 確認できない CSS設定 がいくつか入っています。

また、それ以外のブラウザでも (カスタマイズしない状態では) 各所のリンクをクリックすると パソコンでの表示に戻ってしまうので、色々と不都合があります。 (※カスタマイズすれば、辿りやすいリンクに変更も可能)

と、いう訳で...



Safari のユーザーエージェントを変更して iPhone の実際の表示に近いもので 動作確認(プレビュー)をする方法

iPhone表示は、ブラウザ『Safari』で比較的近い確認できると思います。ブラウザメニューの設定→詳細→開発表示チェック。メニューの開発→ユーザエージェント(iPhone)。ウインドウ狭める。 http://www.apple.com/jp/safari/
http://twitter.com/paroday/status/108564599934173184

と、Paroday(@paroday)さん から教えて頂いたので、早速 Safari(Windows版)をダウンロード。 以下の手順で設定しました。 簡単です^^

キーワード検索 : スマートフォン  iPhone  ブラウザ  プレビュー  テンプレート  

スポンサーリンク

はてなブックマーク  Google Bookmarks Google Bookmarks Yahoo!ブックマーク Facebook Twitter
お役に立ちましたら、応援して頂けると嬉しいです(*´`*)
記事を読んで頂きありがとうございます。 FC2ブログランキング

URL http://arinogotokuatumarite.blog19.fc2.com/blog-entry-204.html

2011/09/10 ~ | Comment (0) tweet? | ↑ ページ先頭へ ↑ |

SEOにも有効なFC2ブログの新変数 lastpage_url

2011/09/24 (土)  カテゴリー: FC2マニア・仕様関連
ページ移動用の変数で出力されているもの

スマートフォン用テンプレート までカスタマイズできるようになったFC2ブログ。 テンプレート編集をしていて 「おっ!!」 と思う見慣れない変数(公式マニュアルには今のところ載っていないもの) を見つけて色々テスト。 PC用テンプレートモバイル(ガラケー)用テンプレート でも機能する 有効な変数 を見つけたので紹介します。

スマホ用テンプレートには、図のように ページ移動用のリンクが出力できる変数 が予め入っていますが、これは javascript を使わずに機能する便利なものです。
ここでの 4ページ目 は ./?cat=23&page=3 となっているように、○ページ目 とはズレています。 でも、この変数ではそれが出力できるようです。 ソースは以下のようなものになっています。

<!--firstpage_disp--><a href="<%firstpage_url><%tail_url>"><%firstpage_num></a>...<!--/firstpage_disp-->
<%template_pager1>
<!--lastpage_disp-->...<a href="<%lastpage_url><%tail_url>"><%lastpage_num></a><!--/lastpage_disp-->

<%template_pager1> は PC用では機能しないようですが、それ以外の 太字になっている変数 はPC用,モバイル用,スマホ用で 問題なく機能します。 という訳で...

ページナビ部分,javascript ON・OFF の状態

このようにカスタマイズして使ってみることにしました! ちなみに、最初の図とページ数が異なるのは、PC用 と 携帯用(スマホ用・モバイル用) で表示件数の設定を変えているためです。
[ 関連記事 : FC2ブログ 環境設定の変更 ブログの設定2011 ]


PC用テンプレートに <%lastpage_url> を設置する方法,その目的

キーワード検索 : FC2ブログ  ページナビ  変数  スクリプト未使用  SEO対策  

スポンサーリンク

はてなブックマーク  Google Bookmarks Google Bookmarks Yahoo!ブックマーク Facebook Twitter
お役に立ちましたら、応援して頂けると嬉しいです(*´`*)
記事を読んで頂きありがとうございます。 FC2ブログランキング

URL http://arinogotokuatumarite.blog19.fc2.com/blog-entry-205.html

2011/09/24 ~ | Comment (0) tweet? | ↑ ページ先頭へ ↑ |