CMS「すぐ使えるCGI」の開発者がご質問にお答えします

 

画像付ウェブページ更新ツールの詳細ページでもPCと携帯の2種類のデザインで同時更新できますか? (No. 1256)

回答日: 2012-11-16
<< 掲示板一覧  >> 質問する

質問

現在、画像付ウェブページ更新ツールを設置テストさせて頂いております。

PCと携帯の2種類のデザインでの同時更新につきまして、
一覧は「全一覧」をPC用に、「短い一覧」を携帯用に使うとサポートページで確認いたしましたが、詳細ページでも2種類のデザインでページを書き出す事は可能でしょうか?(PC用・携帯用)

ウェブページ更新ツールでは実現可能なようですが、「画像アップロード機能付き製品や添付ファイルアップロード付き製品にはこの方法は使用できません。」と記載されておりましたので確認させて頂きます。

よろしくおねがいいたします。
投稿日時: 2012-11-16 13:15

回答

「すぐ使えるCGI」のご利用ありがとうございます。

■画像がある場合の対応可否について

携帯用とPC用に2種類のHTMLを書き出す方法は下記のページでご案内している通りですが、この方法は、やはり「画像付」や「添付ファイル付」の製品では採用いただけません。

「携帯サイトとPCサイトの新着情報を同時に更新する方法」
http://sugutsukaeru.jp/support/243/

どちらかで画像やファイルが表示から抜け落ちてしまうのです。


■対応方法1:スマホ対象の場合

もし「携帯用」が最近のスマホ(スマートフォン)対象でしたら、「レスポンシブWebデザイン」と呼ばれる、CSS スタイルシートを表示幅によって切り替える方法で、一つのHTMLでの対応が可能かと思います。

具体的には、以下のように、幅に合わせて追加で CSS ファイルを定義していく作業となります。

==============
/* デフォルトの定義(980-1119px) */
...

/* 大ディスプレイ */
@media (min-width: 1200px) { ... }

/* タブレット横置き & PC */
@media (min-width: 768px) and (max-width: 979px) { ... }

/* タブレット縦置き & 携帯横置き */
@media (max-width: 767px) { ... }

/* 携帯縦置き */
@media (max-width: 480px) { ... }
==============


◇「レスポンシブWebデザイン」についてご参考(外部サイト)

「Ascii.jp ゼロから始めるレスポンシブWebデザイン入門 - 第1回」
レスポンシブWebデザインとは
http://ascii.jp/elem/000/000/697/697463/



■対応方法2:有料カスタマイズ

有料となりますが、「画像付 ウェブページ更新ツール」で2種類のページが書き出せるようにカスタマイズする事は可能です。
カスタマイズについて詳しくは、下記のページをご参照下さい。

「カスタマイズのご案内」
http://sugutsukaeru.jp/support/66/


どうぞご検討よろしくお願いします。
回答日: 2012-11-16

さらに詳しく