赤田町内会

（前提条件）
〇〇_tempate又は前年度のページを複製して、今年度のページを新規に作成していく。
※前年度のページ内容をソースレベルでコピーしたり、参照する場合は、必ず一旦複製してコピーしたページを見ながら作業すること。
→今年度と前年度のページを同時に開いて作業すると、間違って前年度のページの中身を書き換えたりすることがあるため
➀写真の切取り（トリミング）/サイズ縮小
全て250×160ピクセルに切り取り、保存するときは、品質を６０％まで画質を下げることで10KB程度/1ファイルまで容量を削減できる。
→JTrimでの操作手順(PDFで参照)
➁システムのライブラリに、縮小した写真を新規追加する。
➂行事の説明文を記述する。
➃写真の掲載（単独ページ）
１行に２枚の写真を挿入する。コメントがある場合は記述し、ない場合には全角空白を示すHTMLソース([& emsp ;])を書く。
⑤写真の掲載（体協ページ）
まずは、画面を開いた時に最初に表示させる行事を有効にする。さらに、その行事内容を作成済である印を記述する。（体協内の全行事共通作業）
写真の掲載は➃と同様。
⑥最終行に更新日を記入する。

➀写真は、１ファイルのサイズ容量を縮小（10KB程度）してからシステムにアップロードすること。撮影したままの状態（例えば１MB超えるサイズ）でシステムに入れると各町内会への割当容量3000MBがすぐにオーバしてしまう。
➁動画は5MB/1ファイルの制限を守れはアップロードできますが、写真と同じ理由で割当容量を圧迫するので、2025年以前に第2期CMSサイトに掲載した動画は全て町内会専用YouTubeに移動させて、ホームページからはリンクで参照するように変更した。[2026/5時点で移行作業中で1032MB(34%)まで縮小した。100MB程度まで軽減できる見込み]
➂必ずソースモードで編集すること。ビジュアルモードで編集すると、例えば全角空白が入っただけでもシステムが勝手にレイアウトを調整して表示が崩れることがあるため。
➃作業中の内容は細目に更新ボタンを押して保存すること。間違って保存したとしても、システムが自動で保存のタイミングでバックアップを取っているので、戻すことができる。

ページの内容により、下記の形式に分かれています。
➀投稿ページ・・・行事紹介は全てこの形式。基本は行事単位に単独のページにしていますが、例外として体協ページだけは、４つの行事をタブで切替えて表示させるため、ページ内に４つの行事内容が混在する。ページ内のレイアウトは、行事の紹介文に続いて写真を１行に２枚表示させるだけの繰り返しになっています。
また、行事内容によってはスタメンや得点経過などを表形式に表示する場合がある。
➁固定ページ・・・行事ごとに新しく作成するページではなく、町内紹介、お問合せ等、普段変更のないページです。
➂投稿ページ（トピックス）・・・同じページ内に記事を追加していく形式のページです。
➃トップページのウィジット・・・お知らせ、ダウンロード、おくやみ欄など。

岡山市がWEB画面上で容易にホームページの更新が出来るようにWordpressを導入してシステムを構築した。このシステムを赤田町内会用にカスタマイズしたのが現行のホームページです。
➀外観のテーマ（ページのレイアウト）は６テーマの中から以下を選択しています。
d-chounai_2（画像参照）
➁ページのソースはBootstrap（画像参照）記述によるレスポンシブwebデザインを実現しています。
➂追加CSSでメニューボタンの色などを個別に表現している。

掲載する写真の準備（トリミングや容量縮小）が出来たら
➀トップページのログインから編集画面（ダッシュボード）を開く
➁メディア→新規追加の画面に写真データをドロップする
➂写真を１枚ずつライブラリから選んでコメント入力して投稿
➃写真の角丸指定を入れる
⇒詳細な手順書（PDF）は、こちらをご覧下さい

行事紹介のページを作成するには
➀スマホやデジカメで写真を撮影
➁写真を250×160にトリミング
➂写真の画像ｻｲｽﾞをなるべく縮小(品質60%で10KB/枚前後にできる)
➃編集画面にログインして写真を選んでコメント入力
[重要事項]
(写真のデータ量を縮小する理由)
デジカメやスマホの性能が向上し、写真の解像度が上がり、写真１ファイルのデータ
容量が1MBを超えるようになった。
このままシステムにアップロードすると各町内会に割当られているデータ容量の制限
値3000MBが、あっという間に一杯になる。
(2025 年度の写真掲載例)
10行事の紹介ページに掲載した写真は合計で358 枚です。仮に1ファイル1MBとす
ると1年度で358MBを使用し、9年間でオーバしてしまう。