画像とファイルアップロードの概要
「すぐ使えるCMS」のVer. 4.4 以上の製品では、「画像」欄に画像以外のファイルもアップロードできます。
製品やバージョンによっては画像以外がアップロードできないように制限してありますが、この制限を解除する方法のご説明です。
画像とファイル切り替えの仕組み
表示用テンプレート(templates/article/ 配下のファイル)からその画像の <img> タグがすべて無くなると、ファイル(※1)がアップロードできるようになります。
なお、製品によっては既にファイルに切り替えた設定になっている場合があります。
※1 「ファイル」は、ここでは画像を表す拡張子( png/gif/jpg/jpeg )を持たないファイルを指します。Ver. 4.8 以上の製品では、svg と svgz も画像とみなされます。
画像・ファイル切り替え可能製品
- 添付ファイル付 ウェブページ更新ツール 大容量版 Ver. 4.8 以上
- 画像付 ウェブページ更新ツール 大容量版 Ver. 4.7 以上(販売は終了)
- 画像付 ニュース更新ツール 大容量版 Ver. 4.4 以上(販売は終了)
- 画像付 ニュース更新ツール Ver. 4.5 以上(販売は終了)
画像欄にファイルをアップロードする方法
1.テンプレートから画像タグを削除
一覧テンプレート templates/article/article_list.txt
templates/article/article_list.txt から該当する画像の<img>タグを削除し、代わりにファイルダウンロード用のリンクを追加して下さい。
削除する画像タグの例
下記のような画像タグが削除対象です(「#」は数字)。
<img src="%_d_%/%_imagename_escaped_#_%">
<img src="%_d_%/%_thumbnail_escaped_#_%">
追加するファイルリンクの例
代りに、以下の様なファイルのリンクを追加して下さい。※青字は番号に変更
<a href="%_d_%/%_imagename_escaped_#_%" title="%_imagetext_#_%"
class="%_icon_class_#_%">%_imagetext_#_%</a>
記事ページテンプレート templates/article/article_image_#.txt
※製品によってはこのファイルはありません。「#」は数字。
templates/article/article_image_#.txt から該当する画像の<img>タグを削除し、代わりにファイルダウンロード用のリンクを追加して下さい。
削除する画像タグの例
<img src="%_d_%/%_filename_escaped_%" alt="%_imagetext_%">
<img src="%_d_%/%_thumbnail_escaped_%" alt="%_imagetext_%">
追加するファイルリンクの例
代りに、以下の様なファイルのリンクを追加して下さい。
<a href="%_d_%/%_filename_escaped_%" title="%_imagetext_%"
class="%_icon_class_%">%_imagetext_%</a>
2.テンプレートファイルアップロード
編集した下記のテンプレートをサーバに上書きアップロードして下さい。
- templates/article/article_list.txt
- templates/article/article_image_#.txt
3.確認
管理画面からファイルがアップロードできるか確認して下さい。
4.管理画面のテンプレート調整
管理画面には項目名として「画像」という表示が残っていますので以下のテンプレートファイルを編集して「ファイル」などに変更して下さい。
- templates/admin/2.html (入力画面)
- templates/admin/3.html (確認画面)
テンプレートを変更したらサーバに上書きアップロードして管理画面の表示をご確認下さい。
アイコン表示について
ファイル種別を表すクラス名
ファイルに関しては、「%_icon_class_#_%」または「%_icon_class_%」というテンプレート変数が使用できます。
ここにはファイルの種別に応じて以下のいずれかが出力されます。
xls doc ppt pdf txt zip gif general
これらはスタイルシートのクラス指定として利用できます。
スタイルシートの設定例
a.doc {
padding-left: 20px;
background: url(./icons/doc.gif) no-repeat top left;
}
アイコンを画像タグで表示する場合
スタイルシート(CSS)を使わずに、ファイルのアイコンを画像タグで表示したい場合はテンプレートに以下のように追加して下さい。
※青字は番号に変更
<img src="icons/%_icon_class_#_%.gif" alt="">