小規模Webサイト向け CMS 「すぐ使えるCGI」のサポート情報

携帯サイトとPCサイトを同時に更新する方法(画像が必要な場合)

最終更新日: 2012-01-31
「画像付ニュース更新ツール」では、PC用サイトと携帯用サイト(モバイルサイト、スマートフォン用、スマートホン用、スマホ用)の両方を同時に更新することができます。

>> HTML でサンプルを見る (ページ内 [I-MODE] ボタンで携帯ページにリンク)

管理画面の方をスマートフォン対応させる方法はこちらです。

テキストのみの更新でよい場合

テキストのみの更新でよい場合は、下記ページをご参照下さい。より自由なデザイン調整が可能です。

携帯サイトとPCサイトの新着情報を同時に更新する方法

設定方法

製品の設置

画像付 ニュース更新ツール」をダウンロードしてサーバに設置して下さい。

設置が初めての方は「ステップ by ステップガイド」または「クイックガイド」(2回目以降またはCGIの設置に慣れている方向け)を参照して下さい。
テストで使用する場合、無料トライアルでご利用いただけます。

テンプレートの編集

「全一覧」をPC用に、「短い一覧」を携帯用に使います。

全一覧のテンプレート編集

「全一覧」のテンプレート(artcle_list.html と article_list.txt)は通常のウェブサイトのデザインに準じて編集して下さい。

必要であれば、このテンプレート中に携帯用のページへのリンクを記載します。リンクの表記は、デフォルトのファイル名を使用している場合以下の通りです。

<A HREF="index_short.html">携帯の方はこちら</A>


短い一覧のテンプレート編集

「短い一覧」用のテンプレート(short_list.html と short_list.txt)は携帯端末用に編集します。
これも、既存の携帯用サイトがあればそのデザインに合わせて編集して構いません。どのキャリアでも表示できる汎用の編集例は下記の通りです。

short_list.html の編集例

テキストや画像は適宜差し替えて下さい。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<title>サイトのタイトル</title>
<meta name="Description" content="サイト・ページの要約" />
<meta name="keywords" content="キーワードを,カンマ区切で,記載します" />
</head>
<body bgcolor="#ffffff">
<a name="top">
<h2>
<img src="image/logo.gif" width="18" height="18" alt="ロゴ" hspace="6" />
タイトルを書きます
</h2>
</a>
<p>
ようこそ! ○○サイトの新着情報です。
</p>

<!--- article list : generate from short_list.txt --->
%_article_list_%

[<a HREF="#top">ページトップへ</a>]
</body>
</html>


short_list.txt の編集例

下記例だと少し改行が多めに入ってしまう端末もありますが、どのキャリアでもひとまず見やすく表示されます。

<p>
【%_yyyy_%/%_mm_%/%_dd_%】<br />
<b>%_subject_%</b>
</p>
%_body_%
<br />
<img src="%_d_%/%_imagename_escaped_1_%" alt="">
<br />


書き出し件数の設定

デフォルトでは、「短い一覧」には3件しか書き出されませんので、admin/admin.cgi 内の設定でこれを変更して下さい。

全件を携帯用サイトにも表示する場合、「0」を設定して下さい。

記事が長い場合、全件を書き出すとエラーになる可能性もありますので、長く書く予定の場合 数十件までに制限しておくのがおすすめです。

変更対象部分

#---------------------------------
# 短い一覧に表示する件数
#---------------------------------

$conf{short_list_no} = 3; 

変更例(全件表示の場合)

#---------------------------------
# 短い一覧に表示する件数
#---------------------------------

$conf{short_list_no} = 0; 

変更例(記事内容が長い場合)

#---------------------------------
# 短い一覧に表示する件数
#---------------------------------

$conf{short_list_no} = 30; 

アップロード

編集した以下のファイルをサーバにアップロードして下さい。

templates/article/article_list.html
templates/article/article_list.txt
templates/article/short_list.html
templates/article/short_list.txt
admin/admin.cgi


確認

管理画面にアクセスし、一覧下の「再構築(テンプレート変更反映)」ボタンを押して下さい。
ページを再読み込みして、2つのデザインでページが生成されていることを確認して下さい。

関連リンク

さらに詳しく