🔍 TacmicCMS 2.0 完全独習マニュアル 全体ロードマップ（文字と画像の融合）

▲ 【図】TacmicCMS 2.0 完全独習マニュアル 全体ロードマップ

1 基礎・思想編（Ch 1〜2）

20年のCMS発展史と最新PHP 8.5/MariaDBの堅牢な基盤アーキテクチャを学びます。

2 導入・環境構築（Ch 3）

サーバー要件、TRUST_PATH分離配置、Webインストールウィザードと初期防壁を設定します。

3 運用・レイアウト（Ch 4〜6）

管理画面の全機能、ブロックの自由な配置、Smartyテンプレートのカスタマイズを実践します。

4 モジュール・開発（Ch 7〜8）

主要9大モジュールの実践活用から、D3複製・REST API連携まで完全網羅します。

TacmicCMS 2.0 完全独習マニュアルへようこそ！本書は、かつて300ページを超える名著『XOOPS独習マニュアル』を執筆された Tac Hisaoka（ひさぱぱ）の思想と実践知を完全継承し、最新のモダンWeb時代（PHP 8.5+・MariaDB utf8mb4・CSS3 Grid/Flexbox・WAF防御）に合わせて書き下ろされた実践的ガイドブックです。

第1章のラインナップ

• 1-1: TacmicCMS 2.0 へようこそ：20年の歴史と、今なぜTacmicCMSが選ばれるのか
• 1-2: TacmicCMSで実現できること：企業サイトから会員制ポータル、電子出版まで
• 1-3: ホームページ作成と運用の流れ：企画・ローカル開発・本番公開の3ステップ

20年の歴史を受け継ぎ、未来へ進化し続けるCMS

TacmicCMS（タックミックCMS）は、2000年代初頭のオープンソース黎明期に誕生した XOOPS（ズープス）、その正統進化系である XOOPS Cube Legacy (XCL)、そして国際標準CMSとして発展した ImpressCMS のDNAを正統に受け継ぎ、最新の PHP 8.5+ ネイティブ環境 へと完全リファクタリングされた次世代エンタープライズWebCMSです。

📷 図 1-1: TacmicCMS 2.0 実際の運用サイトフロント画面

なぜ今、TacmicCMSなのか？

• 超高速なページ読み込み：重厚化しすぎた他の巨大CMSとは異なり、無駄を削ぎ落としたコア構造と最適化されたSQLクエリにより、一瞬でページが表示されます。
• 圧倒的な堅牢性とセキュリティ：Web公開ディレクトリ（html/）とプログラム中枢（trust_path/）を物理的に分離する「TRUST_PATHアーキテクチャ」と、リアルタイムWAF（Protector）により、サイバー攻撃を根本から遮断します。
• 自由自在な拡張性（D3モジュール）：同じモジュール（トピックスやギャラリー）を「お知らせ用」「社員ブログ用」「プレスリリース用」と名前を変えて何個でも安全に複製・並行運用できます。

🔍 TacmicCMS 2.0 が活躍する4大ビジネス領域（文字と画像の融合）

▲ 【図】TacmicCMS 2.0 が活躍する4大ビジネス領域

1 企業公式・コーポレート

お知らせ（d3news）、会社案内、施工写真（d3gallery）、問い合わせフォーム（formmail）を統合運用。

2 会員制ポータル・限定配信

ゲスト・無料会員・有料プレミアム会員の3段階権限で限定コンテンツや資料配布を厳格に制御。

3 オンラインマニュアル・電子書籍

Web上で体系的な社内マニュアルを作成し、ワンクリックでEPUB電子書籍や印刷用A4出力に対応。

4 アプリ連携・API基盤

投稿データをiPhone/AndroidアプリやVue/React製SPAフロントエンドへJSON形式でリアルタイム供給。

コーポレートサイトから会員限定ポータルまで自在に構築

TacmicCMS 2.0は、企業や団体のあらゆるWebニーズにワンストップで対応できる万能のフレームワークです。

🔍 ホームページ作成と運用の4大ステップ（文字と画像の融合）

▲ 【図】ホームページ作成と運用の4大ステップ

1 ステップ1：情報設計と選定

サイトの目的を明確にし、必要なモジュール（ニュース、フォーム、ギャラリー等）を選定します。

2 ステップ2：ローカル検証

パソコン内のローカルサーバーでテーマの適用、モジュールのインストール、ブロック配置を確認します。

3 ステップ3：本番サーバー設置

公開領域（html/）と非公開領域（trust_path/）を分離配置し、Webウィザードで初期構築。

4 ステップ4：公開と安全運用

WAF (Protector) による防御を有効化し、定期バックアップを取りながら記事更新を行います。

企画からローカル検証、本番公開への王道プロセス

TacmicCMSでサイトを成功させるための標準的なワークフローは以下の4ステップです：

1. ステップ1：情報設計とモジュールの選定
   サイトに必要な機能（新着情報、お問い合わせ、写真紹介など）を洗い出し、対応する標準モジュールを決定します。
2. ステップ2：ローカル開発環境での構築・検証
   パソコン内のローカルサーバー（tcms.local等）で、デザインテーマの適用、モジュールのインストール、テスト記事の投稿、ブロックの配置確認を行います。
3. ステップ3：サーバーへのファイル配置とインストール
   公開用サーバーに html/ と trust_path/ を分離配置し、Webインストーラーを実行。データベースと設定を連携します。
4. ステップ4：日々の運用とセキュリティ管理
   WYSIWYGエディタによる新着記事投稿、Protectorによる攻撃ログ監視、データベースの定期バックアップを実施します。

🔍 TacmicCMS 2.0 に至るCMS進化の歴史的系譜（文字と画像の融合）

▲ 【図】TacmicCMS 2.0 に至るCMS進化の歴史的系譜

1 2001年〜 XOOPS黎明期

オープンソースCMSの金字塔。モジュールとブロックによる革新的なサイト構成モデルを確立。

2 2005年〜 XCL / ImpressCMS

国際標準への進化とともに、同一モジュールを何個でも増設できるD3アーキテクチャが誕生。

3 2020年代 レガシーの課題

PHP 8.x非互換、EUC-JP/SJIS文字化け、セキュリティ旧態化により多くのサイトが存続危機に。

4 現在 TacmicCMS 2.0

Tac Hisaoka（ひさぱぱ）によりPHP 8.5+ネイティブ、utf8mb4、完全モダンリファクタリングを達成。

TacmicCMS 2.0が他のCMSと決定的に異なる「5つの超技術」と、2000年代中盤から受け継がれてきた「D3・TRUST_PATHの正統な系譜」を解説します。

第2章のラインナップ

• 2-1: PHP 8.5+ 完全対応と高速実行基盤：最新PHPランタイムでのネイティブ稼働
• 2-2: MariaDB & utf8mb4 完全ネイティブ：絵文字（🍣🍺）や多言語の文字化け撲滅
• 2-3: 次世代HTMLPurifier：モダンCSS Grid/Flexboxを崩さず保つサニタイズ
• 2-4: WAF (Protector) によるサイバー攻撃の自動遮断：リアルタイム迎撃システム
• 2-5: D3アーキテクチャの系譜：GIJOE氏考案、XOOPS ➔ XCL ➔ ImpressCMS ➔ TacmicCMS 2.0

多くのレガシーCMSは、PHP 8.0以降で導入された厳格な型チェックや非推奨警告（Deprecated）に対応できず動作不能に陥ります。TacmicCMS 2.0は、コアエンジンからすべてのモジュールに至るまで、最新のPHP 8.5+ に完全リファクタリングされています。

📷 図 2-1: PHP 8.5.4 稼働証明画面（サーバー環境情報）

PHP 8.5+ リファクタリングの主要ポイント

• 未定義変数・配列キーアクセス（Undefined array key）の完全撲滅：厳密な isset() / ?? 演算子による安全処理。
• PDOデータベースアクセスの標準化：レガシーな mysql_ / mysqli_ 直打ちを完全撤廃し、プリペアドステートメントによるSQLインジェクション対策を強化。
• Smarty 4/5 テンプレート基盤への刷新：PHP 8.5の高速JITコンパイラと連動し、キャッシュ生成速度が劇的に向上。
• 継続的な公式パッチ提供：最新のPHPバージョンアップや脆弱性にも、ImpressCMS.jpのコミュニティ連携により迅速な対応パッチが提供されます。

🔍 MariaDB & utf8mb4 完全ネイティブの優位性（文字と画像の融合）

▲ 【図】MariaDB & utf8mb4 完全ネイティブの優位性

1 絵文字・異体字の完全対応

スマートフォンの絵文字（🍣✨🎉）や人名旧字体、JIS第4水準漢字も文字化け・エラー皆無で保存。

2 utf8mb4_general_ci

MariaDB/MySQLの最新照合順序に最適化されたインデックス設計で、高速なあいまい検索を実現。

3 PDOプリペアドステートメント

SQLクエリとパラメータを完全分離し、SQLインジェクション脆弱性を根本から根絶。

4 超高速クエリキャッシュ

MariaDB 10.6+のパフォーマンスを最大限に引き出すインデックス最適化で大量アクセスも軽快。

絵文字・特殊記号・多言語をそのまま保存・表示

従来のXOOPS系CMSでは、データベースの文字コードが EUC-JP や 3バイトの UTF-8 (utf8mb3) で構築されていたため、スマートフォンの絵文字（🍣、🎉、🥺）や人名・地名の異体字を入力すると「???」と文字化けしたり、データベースエラーが発生していました。

🔍 次世代HTMLPurifierと最新Web標準対応（文字と画像の融合）

▲ 【図】次世代HTMLPurifierと最新Web標準対応

1 CSS Grid & Flexbox許可

モダンなグリッド配置やフレックスボックスのインラインCSSをホワイトリストで安全に許可。

2 悪意あるスクリプト遮断

XSS（クロスサイトスクリプティング）攻撃につながる不正なJavaScriptやiframeを完全無力化。

3 レスポンシブタグの保護

スマートフォン表示に必要なviewportやHTML5セマンティックタグを自動整形・保護。

4 WYSIWYGエディタ連携

CKEditorで直感的に組んだリッチなレイアウトを崩さず、そのまま安全にWebへ反映。

モダンCSSを破壊しない、安心・安全なHTMLサニタイザー

ユーザーが投稿した記事に悪意のあるJavaScriptコード（XSS脆弱性）が混入するのを防ぐため、TacmicCMSは世界最高峰のHTMLサニタイザー HTMLPurifier を内蔵しています。

さらにTacmicCMS 2.0では、最新のモダンCSS仕様（display: grid, display: flex, grid-template-columns, gap, border-radius 等）をホワイトリストとして完全認識するよう独自拡張。管理画面から投稿したモダンな2カラム・3カラムカードデザインが、保存時に崩されることなく美しく表示されます。

サイバー攻撃を瞬時に検知・自律迎撃する要塞型アーキテクチャ

TacmicCMSには、世界最強クラスのCMS内蔵型WAF（Web Application Firewall）である Protector（プロテクター） が標準装備されています。

📷 図 2-2: Protector 防御センター設定画面

Protectorが自動迎撃する主な攻撃

• SQLインジェクション攻撃：URLや入力フォームに不正なSQL命令を注入する攻撃をリアルタイム検知し、即座に接続遮断。
• DoS攻撃・高速F5アタック：1秒間に規定回数以上の異常リクエストを送信する悪質ボットを一時追放。
• 管理者ブルートフォース攻撃：管理画面への連続パスワード推測アタックを検知し、該当IPを自動ロック。

🔍 GIJOE氏考案 D3（Duplicable V3）アーキテクチャの構造（文字と画像の融合）

▲ 【図】GIJOE氏考案 D3（Duplicable V3）アーキテクチャの構造

1 公開側ラッパー (html/modules)

モジュール名ディレクトリを別名でコピーするだけで、全く同じ機能を何個でも増設可能。

2 非公開ロジック (trust_path)

プログラム本体はtrust_path内に1つだけ集約。セキュリティとメンテナンス性を両立。

3 独立したDBテーブル

d3news_1, d3news_2 のように自動プレフィックス分離され、データ混在の心配がありません。

4 名前空間の衝突ゼロ

関数名やSmarty定数の重複を回避する動的リネーム機構が内蔵されています。

XOOPSから受け継がれた伝説の設計思想とTRUST_PATH分離

TacmicCMSの最大の特徴であり、強固な拡張性と安全性を支えているのが「D3（Duplicatable V3）アーキテクチャ」です。

🔍 TacmicCMS 2.0 インストール成功へのチェックリスト（文字と画像の融合）

▲ 【図】TacmicCMS 2.0 インストール成功へのチェックリスト

1 環境の事前確認

PHP 8.5+、MariaDB 10.6+、Apache mod_rewriteの稼働状況を確認します。

2 2ディレクトリの配置

公開ディレクトリ（html/）と非公開領域（trust_path/）を物理的に分離してサーバーに配置。

3 パーミッション設定

uploads/, cache/, templates_c/ にWebサーバーの書込権限を正しく付与します。

4 Webウィザード実行

ブラウザでアクセスし、画面の指示に従ってDB情報と管理者アカウントを入力します。

TacmicCMS 2.0をレンタルサーバーやローカル環境へ導入する完全手順です。ファイルの配置場所からパーミッション設定、インストール後のセキュリティ対策まで詳しく解説します。

第3章のラインナップ

• 3-1: サーバー動作要件と推奨環境：PHPバージョン、MySQL/MariaDB、必須拡張
• 3-2: ファイルのサーバー配置とアップロード方法：htmlとtrust_pathの置き分け、ZIP解凍 vs SFTP
• 3-3: Webインストールウィザード完全攻略：全画面ステップ解説
• 3-4: インストール直後の超重要設定：installフォルダ削除とmainfile.phpの444化
• 3-5: TRUST_PATH（非公開領域）の安全管理：公開領域からの完全分離
• 3-6: WAF (Protector) の初期設定と防御ルール：初期推奨設定
• 3-7: PHP推奨設定 (php.ini)：メモリ上限、アップロードサイズ、OPcache

🔍 サーバー動作要件と推奨スペック一覧（文字と画像の融合）

▲ 【図】サーバー動作要件と推奨スペック一覧

1 PHP 8.5 / 8.4 / 8.3

OPcacheおよびJIT推奨。メモリ上限（memory_limit）は 128MB〜256MB を推奨します。

2 MariaDB 10.6+ / MySQL 8.0+

文字コード utf8mb4、照合順序 utf8mb4_general_ci。InnoDBエンジン必須。

3 Apache 2.4+ / Nginx

PATH_INFOサポート（スマートURL用）、mod_rewrite、mod_headers（セキュリティヘッダー）。

4 必須PHP拡張モジュール

pdo_mysql, mbstring, gd, curl, openssl, xml, zip がすべて有効であること。

TacmicCMS 2.0 が快適に動作するシステム要件

🔍 サーバーファイル配置とTRUST_PATH物理分離レイアウト（文字と画像の融合）

▲ 【図】サーバーファイル配置とTRUST_PATH物理分離レイアウト

1 ドキュメントルート (public_html)

index.php, mainfile.php, themes/, modules/, uploads/ を配置します。

2 非公開領域 (trust_path)

Webから直接アクセスできない上位ディレクトリにコアプログラムとモジュール本体を格納。

3 mainfile.phpのパス指定

XOOPS_ROOT_PATH と XOOPS_TRUST_PATH をサーバーの絶対パスで正しく設定。

4 書込可能ディレクトリの権限

uploads/ および trust_path内の cache/, templates_c/ に 777/775 を設定。

html と trust_path の置き分け＆ZIP一括アップロードの極意

TacmicCMSのZIPファイルを解凍すると、大きく分けて html/ と trust_path/ の2つのフォルダが存在します。この2つの配置場所を正しく理解することが、安全な運用の最大の鍵です。

1. 2大フォルダの置き場所ルール

2. アップロード方法：FTPソフト vs サーバー管理画面（ZIP解凍）

CMSには数千〜数万個のファイルが含まれます。通常のFTPソフト（FileZilla等）で1ファイルずつバラバラに転送すると、30分以上かかる上に途中で転送漏れが発生し、原因不明のエラーの原因になります。

🔍 Webインストールウィザード完全攻略 4ステップ（文字と画像の融合）

▲ 【図】Webインストールウィザード完全攻略 4ステップ

1 言語選択と環境チェック

日本語（ja_utf8）を選択し、サーバー環境とディレクトリ権限の自動チェックを通過。

2 データベース接続設定

ホスト名（localhost）、DB名、ユーザー名、パスワード、テーブル接頭辞（zaukyeoj_）を入力。

3 サイト基本情報と管理者作成

サイト名、サイト副題、管理者ユーザー名、メールアドレス、ログインパスワードを設定。

4 テーブル生成とインストール完了

必要な全テーブルが自動生成され、そのまま管理者ダッシュボードへログインします。

ブラウザから対話形式でセットアップする流れ

サーバーにファイルを配置後、ブラウザでサイトのURL（例: https://example.com/）にアクセスすると、自動的にインストールウィザードが起動します。

1. 言語選択：日本語（ja_utf8）を選択して「次へ」をクリック。
2. サーバー環境チェック：PHP拡張機能や必須フォルダのパーミッション（書き込み権限）が緑色で合格しているか確認。
3. パスとURLの設定：サイトURL、物理パス、そして TRUST_PATH の絶対パスを入力。
4. データベース接続設定：MariaDB/MySQLのホスト名（通常 localhost）、データベース名、ユーザー名、パスワードを入力。
5. データベーステーブル生成：自動的に標準テーブルが生成されます。
6. サイト管理者アカウント作成：サイト管理者（webmaster）のユーザー名、メールアドレス、パスワードを決定。
7. インストール完了：おめでとうございます！これでサイトの骨組みが完成しました。

🔍 インストール直後に必ず実施する3大セキュリティ処置（文字と画像の融合）

▲ 【図】インストール直後に必ず実施する3大セキュリティ処置

1 install フォルダの完全削除

html/install ディレクトリを削除（またはリネーム）し、不正な再インストールを防止。

2 mainfile.php の書込保護

パーミッションを 444（読込専用）に変更し、設定ファイルの不正書き換えをブロック。

3 Protector の初期有効化

管理者メニューからProtectorを開き、WAF防御スコアと設定状態を確認。

4 一般設定の初期確認

一般設定画面でサイト名、管理者メール、使用言語が正しく反映されているかを点検。

サイトを守るための2大必須セキュリティ作業

ウィザード完了後、サイトを公開する前に必ず以下の2点を行ってください：

🔍 TRUST_PATH（非公開領域）による絶対防壁メカニズム（文字と画像の融合）

▲ 【図】TRUST_PATH（非公開領域）による絶対防壁メカニズム

1 Web直接アクセスの完全遮断

ブラウザから URLを直接入力しても 403 Forbidden またはファイルが存在しない安全設計。

2 PHP内部からのみ読込可能

Webサーバーの内部プロセスからローカルファイルとしてのみ require される隔離構造。

3 機密情報・キャッシュの隔離

DB接続情報やSmartyコンパイル済みファイルが外部に漏洩するリスクをゼロにします。

4 改ざん耐性の飛躍的向上

仮に公開領域に不正スクリプトを置かれても、CMS中枢ロジックは改ざん不能です。

プログラム中枢をブラウザから隠蔽する物理的防御

TacmicCMSの中核ロジック（modules/、templates_c/、cache/）は、すべて TRUST_PATH 内で管理されます。

もしサーバーの制約上、やむを得ず trust_path を公開領域内に置かざるを得ない場合は、必ず trust_path/ 直下に以下の .htaccess を配置して直接アクセスを拒否してください：

# trust_path/.htaccess
<IfModule mod_authz_core.c>
  Require all denied
</IfModule>
<IfModule !mod_authz_core.c>
  Deny from all
</IfModule>

🔍 Protector (WAF) のリアルタイム防御フロー（文字と画像の融合）

▲ 【図】Protector (WAF) のリアルタイム防御フロー

1 precheck（事前検査）

リクエスト受信の瞬間、GET/POSTパラメータに潜む悪意あるSQLやスクリプトを瞬時に検出。

2 DoS攻撃・連打の自動拒否

同一IPアドレスからの短時間の過剰アクセスを検知し、一時的に接続を自動遮断。

3 SQLインジェクション遮断

UNION SELECT や DROP TABLE などの危険なクエリパターンを無害化・破棄。

4 postcheck & IP自動BAN

不正アクセスを試みた悪質なIPを自動的にアクセス拒否リストへ登録し、管理者にログ通知。

Protectorモジュールの推奨初期設定

管理画面の「Protector 防御センター」を開き、初期防御ルールを有効化します。

• DoS攻撃・高速巡回ボット対策：「一時停止または遮断」を選択。1秒間に規定回数以上の高速アクセスを行う不正IPを一時追放します。
• パスワード総当たり（ブルートフォース）対策：「5回連続失敗で遮断」を推奨。機械的な管理者ログイン攻撃を防ぎます。
• 管理者IPの登録：自社の固定IPアドレスがある場合は、「管理者許可リスト」に登録しておくと、誤遮断される心配がありません。

🔍 PHP 8.5+ 推奨設定 (php.ini) の最重要ディレクティブ（文字と画像の融合）

▲ 【図】PHP 8.5+ 推奨設定 (php.ini) の最重要ディレクティブ

1 memory_limit = 256M

写真の自動リサイズ処理や大容量データのバックアップ処理を安全に完遂させます。

2 upload_max_filesize = 50M

高解像度写真やPDF資料をストレスなくアップロードできるように設定（post_max_size=60M）。

3 max_execution_time = 60

一括処理やデータベースエクスポート時の処理中断・タイムアウトを防止します。

4 opcache.enable = 1

PHP 8.5のOPcacheとJITコンパイラを有効にし、レスポンス速度を極限まで高速化。

本番運用のための推奨 php.ini

; エラー表示（本番環境では必ず画面非表示にし、ログにのみ記録）
display_errors = Off
log_errors = On

; メモリ上限と画像アップロードサイズ
memory_limit = 256M
upload_max_filesize = 32M
post_max_size = 40M

; セッションセキュリティ（Cookieの盗聴・改ざん防止）
session.cookie_httponly = 1
session.cookie_secure = 1      ; HTTPS（SSL）運用の場合は1
session.use_only_cookies = 1

; OPcache（ページの爆速キャッシュ）
opcache.enable = 1
opcache.memory_consumption = 128

🔍 コントロールパネル 9大管理機能マップ（文字と画像の融合）

▲ 【図】コントロールパネル 9大管理機能マップ

1 ダッシュボード＆基本設定

サイト全体の稼働状態、一般設定、メール、メタタグ、言語環境を統括。

2 モジュール・ブロック配置

機能のインストール・更新（⟳）とトップページをはじめとする画面レイアウト管理。

3 ユーザー＆3段階権限設計

会員一覧・検索、管理者／無料会員／ゲストごとの閲覧制限マトリクス。

4 保守・バックアップ・編集

画像マネージャー、DBワンクリック退避、WYSIWYG（CKEditor）活用。

コントロールパネル（管理画面 admin.php）は、サイト運営者やIT管理者が日常的に触れるTacmicCMSの「心臓部・コックピット」です。本章では、ダッシュボードの全体像から環境設定、アカウント・権限管理、メディア管理、バックアップ、システム診断まで、全9分野を徹底的に解き明かします。

第4章のラインナップ

管理画面（admin.php）のログイン直後に表示されるダッシュボードの全体構造と、日々の安全な運用操作を解説します。

📷 図 4-1: コントロールパネル・ダッシュボード全景

🔍 ダッシュボード画面の主要構成と稼働カード（文字と画像の融合）

▲ 【図】ダッシュボード画面の主要構成と稼働カード

1 管理ヘッダーバー

サイト名、フロント確認リンク、ログイン中の管理者アカウント情報。

2 クイックショートカット

基本設定、モジュール管理、ブロック管理へワンクリックでジャンプ。

3 システム稼働ステータス

PHPバージョン、DB接続状況、Protector防御ステータスを即座に把握。

4 キャッシュクリアボタン

更新内容がフロントに即時反映されない場合の最速リフレッシュ。

ダッシュボードの3大エリア構成

1. 最上部ヘッダーバー：
   サイト名、フロントエンドへの切り替えリンク、ログイン中の管理者名、ログアウトボタンが常時配置されています。
2. リアルタイム稼働ステータスカード：
   「登録ユーザー数」「WAFセキュリティ防御件数」「PHPバージョン（8.5.4）」「最新記事数」が一目で把握できます。異常なアクセス急増や未承認ユーザーの有無を瞬時に確認できます。
3. システム中枢機能ショートカット：
   「一般設定」「モジュール管理」「ブロック管理」「ユーザー管理」「グループ権限」「バックアップ」の各画面へ1クリックで直行できます。
4. インストール済みモジュール一覧：
   トピックス、フォトギャラリー、フォームメールなど、サイトに導入されている各モジュールの固有管理画面へアクセスできます。

🔍 管理画面のセキュリティ保護とセッション管理（文字と画像の融合）

▲ 【図】管理画面のセキュリティ保護とセッション管理

1 管理者IP＆セッション照合

アクセス元IPアドレスを監視し、セッションハイジャックを未然に防止。

2 常時SSL（HTTPS）通信

暗号化通信により管理者パスワードや個人情報の盗聴をブロック。

管理画面を外部攻撃から守る鉄壁ルール

• セッションタイムアウト：管理画面を一定時間操作しない場合、自動的にセッションが切断され、離席時の第三者による不正操作を防止します。
• Cookie保護属性（HttpOnly / Secure）：JavaScriptからのCookie盗聴（XSS攻撃）を防ぐ HttpOnly と、HTTPS通信時のみ送信を許可する Secure 属性が常時適用されています。
• ログイン元IPの記録：管理者のログインIPアドレスが毎回データベースに記録され、万が一不正なログインがあった場合もログから特定可能です。

🔍 ワンクリック・キャッシュクリアの実行エリア（文字と画像の融合）

▲ 【図】ワンクリック・キャッシュクリアの実行エリア

1 キャッシュクリアボタン

クリックひとつで templates_c と cache フォルダ内の一時ファイルを一括パージ。

「テンプレートを変えたのに画面が変わらない！」ときの解決法

TacmicCMSは高速化のため、SmartyテンプレートやブロックのHTMLを trust_path/templates_c/ や trust_path/cache/ に自動キャッシュしています。

サイトのタイトル、SEO用METAタグ、メール送信設定、登録制限など、サイト全体の根幹ルールを制御する一般設定（環境設定）の全貌です。

📷 図 4-2: サイト一般設定・全体基本設定画面

サイトの「顔」となるサイト名、キャッチコピー、管理者アドレス、標準テーマなどを設定する最重要画面です。下図の赤枠ピン（❶〜❹）と連動して各項目の役割を解説します。

🔍 画面と操作ガイドの照合マップ（文字と画像の融合）

▲ 【図4-2】全体基本設定（confcat_id=1）の主要4項目ピンポイント解説

1 サイト名（サイトタイトル）

ブラウザのタブ見出しやGoogle等の検索結果に最も大きく太字で掲載される公式サイトの正式名称です。

2 サイト副題（スローガン）

サイト名の横に添えるキャッチコピーや企業理念です。テーマによってはヘッダー上部に美しく配置されます。

3 管理者メールアドレス

システムからのエラー通知、新規会員登録通知、フォーム送信受付などを一括受信する社内代表アドレスです。

4 デフォルトの使用言語

標準言語を指定します（通常は japanese）。TacmicCMSは完全UTF-8ネイティブのため文字化けの心配はありません。

その他の重要オプション

• デフォルトのテーマ選択：標準で適用するデザインテーマ（tacmiccms, tacmic_boot 等）。訪問者が自由に選べるテーマセレクタ機能も提供されています。
• サイト閉鎖モード：リニューアル作業中や緊急メンテナンス時に一般ユーザーからのアクセスを遮断し、「現在メンテナンス中です」と告知画面を表示します。管理者は通常通りログインして動作確認が可能です。

検索エンジン（Google・Yahoo）で上位表示を狙うSEO設定

📷 図 4-3: METAタグ・SEO・フッタ設定画面

• META Keywords（キーワード）：サイトの関連キーワードをカンマ区切りで入力（例: TacmicCMS, PHP8.5, CMS開発, ホームページ制作）。
• META Description（説明文）：Google検索結果のスニペットに表示される100〜120文字程度の簡潔なサイト説明文。クリック率（CTR）に大きく影響します。
• フッタ表記（Footer Copyright）：全ページの最下部に表示される著作権表示（例: © 2026 TacmicCMS All Rights Reserved.）。HTMLタグでのリンク記述も可能です。

メールの未達・迷惑メール判定を防ぐ確実な設定

近年の厳しいメールセキュリティ（SPF / DKIM / DMARC）に対応するため、適切な送信方式の選択が不可欠です：

📷 図 4-4: メール送信環境（PHP mail / SMTP認証）設定画面

会員制サイトの入会フローを決定する

📷 図 4-5: ユーザー登録・アクティベーション設定画面

• 新規ユーザー登録を許可するか：一般公開の会員制サイトなら「はい」、社内専用ポータルなら「いいえ（管理者手動登録のみ）」に設定。
• アクティベーション（メール認証）方式：
  ・ユーザー自身によるメール確認（推奨）：登録後、確認URLをクリックするまで仮登録とし、捨てアドやボットを排除。
  ・管理者による手動承認：BtoBや審査制ファンクラブに最適。管理者が承認するまでログイン不可。
  ・即時アクティベーション：登録完了と同時に即ログイン可能。

🔍 検索・バナー・デバッグモード設定パネル（文字と画像の融合）

▲ 【図】検索・バナー・デバッグモード設定パネル

1 サイト内検索オプション

最小キーワード長や検索対象モジュールの絞り込み設定。

2 バナーシステム管理

スポンサーバナーのローテーション表示とクリック数計測。

3 PHPデバッグモード

開発時にPHPエラーやSmarty警告を画面上に可視化（本番公開時は必ずOFF）。

4 MySQL/SQLクエリデバッグ

実行されたSQLクエリ一覧と実行時間をポップアップで詳細確認。

デバッグモードの取り扱い【超重要】

モジュールのインストール、新バージョンへのアップデート、メインメニューでの並び順調整、安全なアンインストール手順を解説します。

📷 図 4-3: モジュール管理画面（インストール済み一覧）

🔍 インストール済みモジュール一覧テーブル（文字と画像の融合）

▲ 【図】インストール済みモジュール一覧テーブル

1 モジュール名・アイコン

導入済みモジュールの公式名称とアイコン表示。

2 バージョン番号

現在稼働中のモジュールバージョン。

3 公開／非公開スイッチ

サイトメニューやフロントからの利用可否をワンクリック切替。

4 操作アイコン群

一般設定、権限、更新（⟳）、アンインストールへの直通リンク。

モジュール一覧画面の見方

モジュール管理画面は2つのセクションに分かれています：

• インストール済みモジュール：現在サイト上で稼働しているモジュールの一覧。モジュール名、バージョン番号、表示順、操作アイコン（一般設定、更新、アンインストール）が並びます。
• 未インストールモジュール：サーバー上にファイルは置かれているが、まだデータベースに組み込まれていないモジュール。「インストール」アイコンをクリックすることで導入できます。

🔍 未インストールモジュール一覧と新規導入ボタン（文字と画像の融合）

▲ 【図】未インストールモジュール一覧と新規導入ボタン

1 未導入モジュール検出

サーバーの modules/ にアップロードされた新規モジュールを自動一覧化。

2 モジュール概要・作者情報

機能概要と推奨環境の確認。

3 インストール実行ボタン

ワンクリックでDBテーブルを自動生成し、システムへ即座に組み込み。

ワンクリックで完了するインストール処理の裏側

未インストール一覧にあるモジュールの「インストール」ボタンを押すと、自動的に以下の処理が実行されます：

1. sql/mysql.sql に基づき、データベースに専用テーブルが生成される。
2. モジュールの環境設定パラメータがデータベースの config テーブルに登録される。
3. 標準ブロック（新着一覧など）がブロック管理に追加される。
4. 管理者グループ（Webmaster）へ全権限が自動付与される。

モジュール管理画面では、各モジュールの表示名称や並び順の変更、そしてプログラム更新時のスキーマ同期処理を一元管理できます。下図の番号ピン（❶〜❸）に対応して操作手順を解説します。

🔍 モジュール管理の主要操作エリア（文字と画像の融合）

▲ 【図4-6】モジュール一覧テーブルの各行操作コントロール（モジュール名・表示順・更新アイコン）

1 モジュールタイトル（メニュー表示名）

サイトのメインメニューに表示される名称を自由に変更できます（例: 「サイトマップ」→「サイト案内」）。

2 表示順序（並び順ウェイト）

数値が小さいもの（0, 1, 2...）ほど、メインメニューの最上位（左側）に優先して表示されます。

3 モジュール更新（⟳）アイコン

プログラム修正後にクリック！DBテーブルの変更差分適用やテンプレート再読み込みをワンクリックで実行します。

🔍 表示順序（並び順ウェイト）の入力と保存（文字と画像の融合）

▲ 【図】表示順序（並び順ウェイト）の入力と保存

1 並び順ウェイト数値

0, 1, 2...と数値を指定。小さい数値ほどメインメニューの左側（上位）に配置されます。

メニューの並び順を整える「ウェイト（重み）」の法則

各モジュールの「表示順」入力欄に数値を入力し、画面下の「送信」を押すことで、サイトのメインメニューでの並び順を自由に変えられます：

• 数値が小さいもの（0, 1, 2...）ほど、メニューの上（または左）に表示されます。
• メニューに表示したくない内部モジュール（ProtectorやALTSYSなど）は、モジュール一般設定で「メインメニューに表示しない」に設定するか、表示順を大きくしておきます。

🔍 モジュールのアンインストール操作エリア（文字と画像の融合）

▲ 【図】モジュールのアンインストール操作エリア

1 アンインストールボタン

モジュールを安全に解除。DBテーブルも削除されるため実行前にバックアップ推奨！

一時停止と完全削除の違い

• アクティブ解除（一時無効化）：モジュールの「有効」チェックを外すと、一般ユーザーからのアクセスを一時的に遮断できます（データベース内の投稿データはそのまま安全に保持されます）。
• アンインストール（完全削除）：ゴミ箱アイコンをクリックすると、モジュールがアンインストールされます。【注意】モジュールが作成したデータベーステーブルや過去の投稿データもすべて完全に消去されます。二度と元に戻せませんので、事前に必ずバックアップを取得してください。

登録された会員アカウントの検索、編集、パスワード再発行、不正ユーザーの凍結（BAN）、一括メール配信などの実務操作を解説します。

📷 図 4-4: ユーザー管理画面（会員一覧・検索フィルタ）

🔍 登録ユーザー一覧と検索フィルター（文字と画像の融合）

▲ 【図】登録ユーザー一覧と検索フィルター

1 ユーザー名・アバター

登録メンバーのハンドルネームとプロフィール。

2 登録メールアドレス

会員の連絡先メールと登録日時。

3 所属グループ

管理者・一般会員・プレミアム会員などの所属ランク。

4 編集・詳細アクション

プロフィール変更やパスワード再設定の直通リンク。

目的のアカウントを瞬時に探し出すフィルタ機能

ユーザー数が増加しても、高度な検索条件で対象者をすぐに絞り込めます：

• ユーザー名／メールアドレスの部分一致検索
• 所属グループによる絞り込み（「プレミアム会員」だけを抽出など）
• 登録日・最終ログイン日時（過去1年ログインのない休眠アカウントの調査）
• 投稿記事数によるソート（優良アクティブユーザーの抽出）

管理者が手動でメンバーを追加する手順

📷 図 4-8: 新規ユーザー手動追加画面

1. 「ユーザー管理」画面の「新規ユーザー追加」をクリック。
2. 希望するユーザー名、メールアドレス、初期パスワードを入力。
3. 所属させたいグループ（例: 「一般会員」「編集スタッフ」）にチェック。
4. 「登録」をクリックすると、即座にアカウントが有効化されます。
5. パスワードを忘れたユーザーがいる場合は、編集画面から新しい仮パスワードを上書き設定するか、パスワード再発行リンクを発行できます。

🔍 アカウント凍結・削除コントロール（文字と画像の融合）

▲ 【図】アカウント凍結・削除コントロール

1 ステータス変更（アクティブ／停止）

スパムアカウントを即時無効化し、サイトへのログインを遮断。

不正ユーザーへの毅然とした対処

• アカウントの凍結（無効化）：ユーザー詳細画面で「アクティブ」のチェックを外すと、そのユーザーはサイトへのログインが一切できなくなります（過去の投稿データは維持）。
• 完全削除（退会処理）：ユーザーを完全に削除すると、登録情報がデータベースから抹消されます。
• スパムアカウントの一括削除：検索条件で「投稿数 0件 かつ メール認証未完了」などを抽出し、チェックボックスで一括選択してまとめて削除できます。

登録メンバーへのお知らせ一斉配信（mailusers）

「コントロールパネル ➔ メール一括送信（mailusers）」機能を使えば、外部の有料メルマガスタンドを契約することなく、サイト内の会員へ一斉連絡が可能です。

📷 図 4-5: ユーザー一括メール送信画面

一括送信の便利テクニック

• ターゲット配信：「全登録ユーザー宛」はもちろん、「プレミアム会員限定の特別案内」や「運営スタッフのみへの業務連絡」など、グループ別に宛先を絞り込めます。
• 差し込みタグの利用：本文中に {X_UNAME} と書くと、受信者それぞれの名前（例: 「〇〇様、こんにちは」）に自動変換されて送信されます。

グループごとに「どの管理画面に入れるか」「どのモジュールを閲覧・投稿できるか」を精密に制御する権限設計の真髄です。

📷 図 4-6: グループ＆アクセス権限管理画面

🔍 3大基本グループ一覧とメンバー数確認（文字と画像の融合）

▲ 【図】3大基本グループ一覧とメンバー数確認

1管理者

管理画面の全権限を所持するシステム最高管理者グループ。

2登録ユーザ

会員専用記事の閲覧やコメント投稿が可能なログインユーザー。

3ゲスト

未ログインの一般訪問者。公開ページのみアクセス可能。

4 グループ編集・メンバー追加

各グループの権限設定や所属ユーザーの管理画面へ遷移。

TacmicCMSにあらかじめ組み込まれている3大基本グループ

カスタムグループの追加手順

📷 図 4-11: 新規グループ作成フォーム

企業の運用体制やビジネスモデルに合わせて、独自のグループを無制限に増設できます：

• 「有料プレミアム会員」グループ：月額サブスク会員だけに特別鑑定書や限定セミナー動画を公開。
• 「広報スタッフ」グループ：管理画面の「トピックス (d3news)」の投稿・編集権限だけを与え、システム設定やユーザー個人情報には一切触らせない安全運用。
• 「ライター」グループ：記事のドラッグ執筆のみを許可し、公開承認は管理者が行うワークフロー。

🔍 管理権限付与チェックボックス（文字と画像の融合）

▲ 【図】管理権限付与チェックボックス

1 モジュール個別管理権限

「お知らせだけ更新できる担当者」のように特定モジュールのみ権限付与。

2 ブロック管理権限

レイアウト変更を許可するかどうかのスイッチ。

3 全権管理者権限（注意）

最高管理者権限。信頼できる中核メンバーのみに限定付与。

管理画面の部分解放（最小権限の原則）

「グループ管理 ➔ システム管理権限」画面では、管理画面の15以上の管理機能（ブロック管理、テンプレート管理、ユーザー管理、バックアップ等）の中から、特定の機能だけにチェックを入れて許可できます。

アルバイトスタッフや外注会社に管理作業を依頼する際も、マスターパスワードを教える必要がなく、万全のセキュリティが維持されます。

🔍 モジュールアクセス権限マトリクス表（文字と画像の融合）

▲ 【図】モジュールアクセス権限マトリクス表

1 グループ別チェックボックス

各グループ（ゲスト／無料／プレミアム）ごとのアクセス許可チェック。

2 閲覧許可の即時反映

チェックを外すだけで、未ログインユーザーへのモジュール非公開化が完了。

3 一括更新ボタン

変更した権限マトリクスを保存してサイト全体へ即座に適用。

チェックを入れるだけの簡単マトリクス設定

「グループ権限管理」の画面には、グループ名（縦軸）× モジュール名（横軸）の分かりやすいマトリクステーブルが展開されます。

「フォトギャラリーは会員だけに公開する」「ダウンロードセンターはゲストには見せない」といった制御も、該当するマスのチェックをON/OFFするだけで数秒で完了します。

サイト全体で共有する画像素材の管理や、記事執筆時にワンクリックで呼び出せる「画像マネージャー」、安全なアップロード許可設定を解説します。

📷 図 4-7: 画像マネージャー画面（カテゴリ別画像保管庫）

🔍 画像マネージャーのカテゴリ別ギャラリー（文字と画像の融合）

▲ 【図】画像マネージャーのカテゴリ別ギャラリー

1 画像カテゴリフォルダ

「バナー」「商品写真」「共通アイコン」などフォルダ別に分類整理。

2 サムネイルプレビュー

アップロード済み画像のプレビューとファイル名・容量確認。

3 ワンクリック挿入コード

エディタへ簡単に埋め込めるタグを瞬時にコピー。

サイト共有素材をフォルダ別にすっきり整理

1. 「コントロールパネル ➔ 画像マネージャー」を開きます。
2. 「カテゴリ（例: 会社ロゴ・バナー素材・スタッフ顔写真）」を作成します。
3. 画像をアップロードしておくと、どのモジュールの記事執筆画面からでも「画像ボタン」を押すだけでこの保管庫がポップアップし、サムネイルをクリックして本文へ即座に貼り付けられます。

🔍 アップロード制限とMIMEタイプ設定（文字と画像の融合）

▲ 【図】アップロード制限とMIMEタイプ設定

1 許可拡張子（jpg, png, webp, pdf）

安全な画像・ドキュメント形式のみをホワイトリスト指定。

2 最大ファイルサイズ制限

サーバー容量や帯域を保護するため、1ファイルあたりの上限を指定。

WebPやPDFの安全なアップロード許可

「コントロールパネル ➔ MIMEタイプ管理」では、アップロードを許可するファイル拡張子とMIMEタイプを厳格に管理しています。

• 次世代画像形式（WebP）の許可：軽量で高画質な image/webp を有効化することで、表示速度スコア（PageSpeed Insights）を大幅改善。
• 危険な拡張子の拒否：.php, .exe, .sh などのスクリプトファイルは、アップロード試行時にシステムが自動的に物理ブロックします。

Webサイトの財産である記事や会員データを、万が一のサーバー障害や誤操作から守るワンクリック・バックアップと復旧手順です。

📷 図 4-8: データベースバックアップ＆リストア画面

🔍 データベースバックアップ作成パネル（文字と画像の融合）

▲ 【図】データベースバックアップ作成パネル

1 対象テーブル選択

全テーブル一括バックアップ、または特定モジュールのテーブルだけを選択。

2 圧縮形式（gzip / 生SQL）

ファイルサイズを大幅に削減するgzip圧縮エクスポートに対応。

3 バックアップ生成実行

クリックひとつで MariaDB 全データの最新ダンプファイルを生成。

コマンド不要！ブラウザ上で数秒でSQLダンプを出力

1. 「コントロールパネル ➔ データベースバックアップ」を開きます。
2. バックアップ対象として「全テーブル一括」または特定モジュールのテーブルを選択。
3. 「バックアップ実行」ボタンをクリックすると、数秒で最新のSQLファイルが生成されます。
4. 生成された .sql（または圧縮 .sql.gz）をパソコンの手元にダウンロードして安全に保管します。

🔍 バックアップファイルの保存とリストア手順（文字と画像の融合）

▲ 【図】バックアップファイルの保存とリストア手順

1 バックアップ履歴一覧

生成日時、ファイルサイズ、ダウンロードリンクの一覧。

2 緊急リストア（復元）

万一の障害時、過去のバックアップSQLを読み込んで即座にサイト復旧。

トラブル発生時のリストア（復旧）手順

誤って記事を大量削除してしまったり、サーバー移行を行う際は、同じ画面の「データベース復旧（リストア）」タブから保管しておいたバックアップSQLファイルを指定して実行するだけで、保存時の正常な状態へ瞬時に巻き戻せます。

サーバーの稼働状態、PHP拡張、データベースの負荷、キャッシュの効き具合を診断するヘルスチェック機能です。

📷 図 4-9: システム環境診断画面（バージョン＆拡張機能一覧）

🔍 サーバー環境診断画面の重要パラメータ（文字と画像の融合）

▲ 【図】サーバー環境診断画面の重要パラメータ

1 PHPバージョン＆実行SAPI

PHP 8.5+ が正しく認識されているかを確認。

2 MariaDB / MySQLバージョン

DBエンジンのバージョンとutf8mb4エンコーディング状況。

3 メモリ割り当て（memory_limit）

PHPプロセスが使用可能な最大メモリ量。

4 OPcache / JIT有効状態

PHP 8.5高速化エンジンの稼働ステータス。

チェックすべき5大指標

• PHPバージョン：PHP 8.5.4 等の最新環境で動作していることを確認。
• MariaDB / MySQLバージョン：10.6+ または 8.0+ が稼働しているか。
• OPcache稼働状況：ページの爆速表示に不可欠なバイトコードキャッシュが「Enabled」になっているか。
• メモリリミット（memory_limit）：推奨の 256MB 以上が確保されているか。
• 最大アップロードサイズ：写真やPDFのアップロード上限（upload_max_filesize）を確認。

🔍 エラーログ確認と原因調査エリア（文字と画像の融合）

▲ 【図】エラーログ確認と原因調査エリア

1 システム通知・警告ログ

未定義変数や非推奨関数のログをリアルタイムで追跡。

2 スタックトレース表示

エラー発生時のファイル名と行番号を即座に特定。

万が一画面が真っ白になったときの3ステップ対応

1. ステップ1：キャッシュをクリアする
   管理画面のキャッシュクリアを実行するか、FTPで trust_path/templates_c/ 内のファイルを削除。
2. ステップ2：デバッグモードを一時的にONにする
   一般設定の「デバッグモード」を「PHPデバッグ」にしてリロードし、具体的なエラーメッセージやファイル行番号を確認。
3. ステップ3：Protectorの拒否ログを確認する
   短時間に連続操作したことで、自分のIPがWAFに一時遮断されていないかProtectorログをチェック。

ワープロ感覚で見出し作成、文字装飾、写真貼り付け、テーブル作成ができる統合エディタCKEditorの実践活用法です。

📷 図 4-10: WYSIWYG記事執筆画面（文字装飾・画像アップロード連動）

🔍 WYSIWYGエディタの見出し・文字装飾ツールバー（文字と画像の融合）

▲ 【図】WYSIWYGエディタの見出し・文字装飾ツールバー

1 見出しドロップダウン

見出し2（h2）、見出し3（h3）をセマンティックに正しく適用。

2 太字・斜体・文字色

重要なキーワードの強調やアクセントカラー指定。

3 箇条書き・番号付きリスト

読みやすい構造化リストをマウス操作だけで作成。

4 リンク挿入・解除

内部リンク・外部リンクのURLや新規タブ設定。

SEOに好かれる美しい文書構造の作り方

文字を大きくしたいからといって、フォントサイズ変更を多用するのはSEO上おすすめできません。ツールバーの「フォーマット」プルダウンから正しいタグを選択しましょう：

• 見出し2 (<h2>)：記事の大見出し（セクションの区切り）。
• 見出し3 (<h3>)：見出し2の中の小項目。
• 標準 (<p>)：一般の本文段落。
• 引用 (<blockquote>)：他サイトや書籍からの引用文。

🔍 写真の配置・リサイズ・回り込みツール（文字と画像の融合）

▲ 【図】写真の配置・リサイズ・回り込みツール

1 画像アップロード＆配置

エディタ画面に写真をドラッグ＆ドロップするだけで即座に挿入。

2 サイズハンドル・リサイズ

四隅のハンドルをドラッグして直感的に画像サイズを調整。

3 テキスト回り込み（左寄せ・右寄せ）

写真の周囲に文章を自然に回り込ませるフロート設定。

雑誌のようなテキスト回り込みレイアウト

1. デスクトップやフォルダから、写真をエディタの好きな位置へドラッグ＆ドロップ！
2. 貼り付けられた写真をダブルクリックすると「画像プロパティ」画面が開きます。
3. 「配置」で「左（Left）」または「右（Right）」を選択すると、画像の横に文章が美しく回り込みます。
4. 画像の四隅のハンドルをマウスで引っ張るだけで、見た目のサイズを自由に拡大縮小できます。

🔍 レスポンシブな表（テーブル）作成パネル（文字と画像の融合）

▲ 【図】レスポンシブな表（テーブル）作成パネル

1 グリッド選択による表挿入

行数と列数をマウスでドラッグして一瞬でテーブル生成。

2 ヘッダー行の指定

表の第1行を見出し（th）に設定し、デザインとアクセシビリティを両立。

3 スタイル適用

ストライプ背景やボーダー枠線を美しく整え、スマホでも崩れない表示を実現。

スマートフォンで崩れない料金表や仕様表

エディタの「表挿入」アイコンをクリックし、行数と列数を指定するだけで綺麗な表が完成します。表プロパティで「幅: 100%」に設定しておくことで、スマートフォンの画面幅に合わせて自動的に最適幅にフィットし、横スクロールにも対応します。

🔍 ブロック管理とトップページ構成 4大設計ステップ（文字と画像の融合）

▲ 【図】ブロック管理とトップページ構成 4大設計ステップ

1 配置ポジションの決定

ヘッダー・左右サイドバー・中央上下（Center Top/Bottom）から選択。

2 表示条件（ページの絞り込み）

「トップページのみ」「全ページ」「特定モジュール」を指定。

3 アクセス権限の出し分け

未ログイン訪問者向け入会導線 vs ログイン会員向け限定ブロック。

4 カスタムブロックの作成

自由なHTML/CSSやバナー群をマウス操作で即時配置。

TacmicCMSのWebサイトは「ブロック」という部品を自在に組み立てて構築されます。トップページやサイドバーにどの情報を配置し、誰に見せるかを完全にコントロールするプロのレイアウト手法を網羅します。

第5章のラインナップ

• 5-1: ブロックシステムの仕組みと表示ポジション：左・右・中央上・中央下の5大エリア
• 5-2: ブロックの表示条件設定：トップページのみ／全ページ／特定モジュール限定
• 5-3: グループ別アクセス権限によるブロック出し分け：ゲスト向けと会員向けの情報分離
• 5-4: カスタムブロックの作成：自由なHTML・お知らせバナー・動画埋め込み
• 5-5: 各モジュール提供ブロック一覧とプロの配置黄金比：売れるトップページの鉄則設計

TacmicCMSの最大の特徴が、ドラッグ不要で直感的にエリア配置できる「ALTSYS高度ブロック管理」です。下図のカラー番号ピン（❶〜❹）と連動して、ブロックのタイトル設定から表示位置・並び順・権限管理までを詳しく解説します。

🔍 ALTSYS ブロック管理 行設定マップ（文字と画像の融合）

▲ 【図5-1】ALTSYS ブロック管理テーブルの1行あたりの全設定項目（ログインブロック例）

1 表示タイトル（編集可能）

フロント画面の見出し文字を書き換えます。空白にするとブロック見出しバー自体を非表示にできます。

2 表示位置ミニマップセレクタ

「左サイドバー」「中央上」「中央下」「右サイドバー」などのラジオボタンを視覚的マップからワンタップで選択。

3 優先度（並び順ウェイト）

同じエリア内に複数のブロックがある場合の上下順序。数値が小さいもの（0, 1, 2...）ほど上に表示されます。

4 公開ページ ＆ 閲覧権限グループ

「トップページのみ表示」「全ページ表示」の切り替えと、「ログイン会員のみ閲覧可能」などのグループ権限を複数選択可能です。

画面のどこに何を置くかを決める5大配置エリア

配置エリアの選び方のコツ

• 中央上部（Center Top）：トップページを開いた瞬間に最も目を引くエリア。ビジュアルスライダー（slider）や最重要のお知らせを配置します。
• 左または右サイドバー（Left/Right）：サイト共通のナビゲーション（メインメニュー、ログインブロック、最新トピックス、カテゴリ一覧）に最適です。
• 中央下部（Center Bottom）：記事を読み終わった訪問者へ「次のアクション」を促す問い合わせバナーや関連ダウンロードリンクを配置します。

🔍 ブロック表示条件（対象ページ絞り込み）設定（文字と画像の融合）

▲ 【図】ブロック表示条件（対象ページ絞り込み）設定

1 トップページのみ表示

「トップページ」にチェックを入れるだけで、フロント専用ウィジェット化。

2 全ページ共通表示

サイドバーのメインメニューや検索窓など、サイト全域に出す場合。

3 特定モジュール連動

「ニュース閲覧時のみ関連ブロックを出す」等のコンテキスト連動。

4 非表示設定

削除せずに一時的にブロックを非公開化するトグル。

「トップページだけ」「全ページ」「特定モジュールのみ」の自在な出し分け

ブロックは、サイト内のどのページに表示するかを個別に指定できます。この設定を使いこなすことで、トップページは華やかに、下層ページはすっきりと見やすいWebサイトが完成します。

🔍 グループ別ブロックアクセス権限設定（文字と画像の融合）

▲ 【図】グループ別ブロックアクセス権限設定

1 ゲスト限定ブロック

未登録ユーザーにだけ「無料会員登録はこちら！」バナーを表示。

2 登録会員限定ブロック

ログイン中のユーザーにだけマイページや会員限定リンクを表示。

3 プレミアム会員限定ブロック

有料会員専用の特別コンテンツやサポート窓口を表示。

「未ログイン者」と「ログイン会員」で見える世界を変える

TacmicCMSのブロック管理は、グループ単位の権限管理と完全に直結しています。チェックボックスをON/OFFするだけで、同じトップページでも訪問者の属性に応じたパーソナライズ表示が実現します。

🔍 カスタムブロック作成画面（文字と画像の融合）

▲ 【図】カスタムブロック作成画面

1 ブロックタイトル

フロントのブロック上部に表示される見出しタイトル。

2 コンテンツ形式（HTML / テキスト / PHP）

HTMLPurifierが効く安全なリッチHTMLブロックを作成可能。

3 本文入力エリア

バナー画像や告知文、問い合わせボタンのHTMLを自由に入力。

バナー、YouTube動画、Googleマップ、自由な告知を自由配置

モジュールが提供する標準ブロックだけでなく、管理画面から自由なテキストやHTMLを書き込める「カスタムブロック」を無制限に作成できます。

1. カスタムブロックの新規作成：
   「ALTSYS ➔ ブロック管理」の画面最下部にある「カスタムブロックの追加」をクリックします。
2. コンテンツの形式（Content Type）を選択：
   ・HTML：文字装飾、画像リンク、YouTube動画の <iframe>、Googleマップの埋め込みに最適。
   ・テキスト（改行自動変換）：シンプルなお知らせ文言を手軽に表示。
   ・PHPスクリプト：高度な動的処理やAPI連携結果を出力（※管理者のみ許可）。
3. 本文の入力と保存：
   本文欄にバナー画像タグやメッセージを記述し、配置エリア（左、右、中央等）と表示ページを選択して「送信」を押せば完了です！

🔍 プロが実践するトップページ配置の黄金レイアウト比（文字と画像の融合）

▲ 【図】プロが実践するトップページ配置の黄金レイアウト比

1 中央最上部 (Center Top 1)

ヒーロースライダー（slider）で最も伝えたいメッセージを大迫力訴求。

2 中央上部 (Center Top 2)

重要なお知らせ（d3news）で最新の企業動向・プレスリリースを速報表示。

3 中央メインコンテンツ

会社概要や主要サービス紹介のカスタムブロックを美しくグリッド配置。

4 中央下部＆サイドバー

写真ギャラリー（d3gallery）、カタログDL、お問い合わせバナーを網羅。

標準モジュールのブロック一覧と「売れるトップページ」の黄金比

主要モジュールをインストールすると、以下の魅力的なブロックが自動的に利用可能になります：

🔍 デザインとテンプレートカスタマイズ 4大手法（文字と画像の融合）

▲ 【図】デザインとテンプレートカスタマイズ 4大手法

1 テーマ（themes/）の切替

サイト全体のHTML骨格（theme.html）とCSSによる外観の一新。

2 Smartyテンプレート編集

モジュールが出力するHTML構造を管理画面から安全に調整。

3 CSS Grid / Flexbox最適化

最新のレスポンシブデザインでスマホ・タブレット表示を最適化。

4 D3テンプレートの個別連動

複製したモジュールごとの専用テンプレートで個別デザインを適用。

「ボタンの色を変えたい」「記事一覧のレイアウトを横並びカードにしたい」「不要な項目を非表示にしたい」――そんな見た目のカスタマイズを、安全に管理画面から行うための完全ガイドです。

第6章のラインナップ

• 6-1: テーマ（themes）とSmartyテンプレートの仕組み：ページ全体と部品の関係
• 6-2: ALTSYS テンプレート管理による安全な編集手順：複製tplset作成の絶対原則
• 6-3: モジュール別テンプレートの探し方：一覧・詳細・ブロックはどれを直す？
• 6-4: すぐに使えるSmartyタグと変数一覧：条件分岐・ループ・ログイン判定
• 6-5: CSSスタイルシートの編集とレスポンシブデザイン調整：スマホ最適化の勘所

🔍 Smartyテンプレートエンジンの描画メカニズム（文字と画像の融合）

▲ 【図】Smartyテンプレートエンジンの描画メカニズム

1 ロジックとデザインの完全分離

PHPプログラムがデータを供給し、SmartyタグでHTMLに美しく流し込み。

2 自動コンパイル (templates_c)

SmartyタグはPHPに自動変換・キャッシュされ、高速に実行。

3 altsys（高度システム管理）

ファイルを直接触らず、Web管理画面から安全に差分編集＆履歴管理。

4 テーマ内オーバーライド

themes/テーマ名/templates/ 内に置くだけで安全に上書き可能。

ページの外枠を決める「テーマ」と中身を作る「モジュールテンプレート」

TacmicCMSの見た目は、2重のテンプレート構造で組み合わさっています：

1. テーマ（Theme：themes/テーマ名/theme.html）：
   サイト全体の「外枠」を担当します。ヘッダー（ロゴ・グローバルナビ）、サイドバーの枠、フッター、全体のCSSスタイルシートを統括します。
2. モジュールテンプレート（Module Template：modules/{モジュール名}/templates/*.html）：
   外枠の中に埋め込まれる「各機能の中身」を担当します。トピックスの記事一覧、写真ギャラリーのサムネイル並び、お問い合わせフォームの入力枠などです。

初期テンプレート（default）を直接触らない！安全な複製の極意

テンプレートをカスタマイズする際、最も安全で推奨される手順が「ALTSYS DBテンプレートマネージャー」によるテンプレートセットの複製です。

📷 図 6-1: ALTSYS DBテンプレートマネージャー（テンプレートセット管理画面）

失敗しないテンプレートカスタマイズの3ステップ

🔍 ALTSYSテンプレート一覧とモジュール絞り込み（文字と画像の融合）

▲ 【図】ALTSYSテンプレート一覧とモジュール絞り込み

1 モジュール選択プルダウン

編集したいモジュール（d3news, d3gallery等）を瞬時に絞り込み。

2 テンプレート種別アイコン

メイン画面用（main_*.html）とブロック用（b_*.html）を色分け表示。

3 編集（鉛筆）アイコン

クリックしてSmartyテンプレートのオンライン編集画面を開く。

4 差分比較・リセット

オリジナルのデフォルトテンプレートと変更差分をいつでも確認・復元。

「一覧画面」「詳細画面」「ブロック」はどのファイルを直せばいい？

D3モジュールのテンプレート名は、すべて一定の規則に従って命名されています。規則を知っていれば、目的の画面を一瞬で見つけ出せます：

🔍 よく使うSmarty基本タグ・変数リファレンス（文字と画像の融合）

▲ 【図】よく使うSmarty基本タグ・変数リファレンス

1 <{$xoops_sitename}>

一般設定で登録したサイト名を出力（<{$xoops_slogan}>: 副題）。

2 <{$xoops_url}>

サイトのベースURL（http://...）を絶対パスで安全に出力。

3 <{if $xoops_isuser}>

ログイン中の会員だけに表示する条件分岐（<{else}>: ゲスト向け）。

4 <{foreach from=$item ...}>

新着記事や写真リストをループ処理して一覧表示。

コピペで使える！デザイン変更に必須のSmartyスニペット

テンプレート内で最も頻繁に使われる定番のSmartyタグと変数です：

1. ログイン状態や管理者権限による表示分岐

<!-- 管理者にだけ編集ボタンを表示する -->
<{if $xoops_isadmin}>
  <a href="<{$mydirurl}>/edit.php?id=<{$item.id}>" class="btn-edit">✏️ この記事を編集</a>
<{/if}>

<!-- 会員ログイン中かゲストかでメッセージを切り替える -->
<{if $xoops_isuser}>
  <p>ようこそ、<strong><{$xoops_uname}></strong> 様！</p>
<{else}>
  <p>会員の方は <a href="<{$xoops_url}>/user.php">こちらからログイン</a> してください。</p>
<{/if}>

2. 記事一覧のループ表示（foreach）

<ul class="news-list">
<{foreach item=topic from=$topics}>
  <li>
    <span class="date"><{$topic.post_date|date_format:"%Y年%m月%d日"}></span>
    <span class="cat"><{$topic.category_name}></span>
    <a href="<{$topic.url}>"><{$topic.title}></a>
  </li>
<{/foreach}>
</ul>

🔍 モダンCSS（Grid & Flexbox）レスポンシブ設計の極意（文字と画像の融合）

▲ 【図】モダンCSS（Grid & Flexbox）レスポンシブ設計の極意

1 モバイルファースト設計

スマートフォン表示を基準にスタイルを設計し、PCへ拡張。

2 CSS Grid レイアウト

display: grid; repeat(auto-fit, minmax(...)) で自動折り返しグリッド。

3 Flexboxによるパーツ整列

アイコン＋テキストの縦横揃えを flex; align-items: center で実現。

4 HTMLPurifierセーフ

TacmicCMSの次世代PurifierがインラインCSSグリッド属性を完全保護。

スマートフォン表示を完璧に仕上げるCSSテクニック

デザインの微調整（余白、文字サイズ、カードの折り返し）は、テーマの style.css またはモジュールの専用CSS（例: d3news.css）で行います。

モダンな2カラム・レスポンシブカードの記述例

/* PCでは横並び2カラム、スマホでは1列に自動スタック */
.news-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  margin: 20px 0;
}
.news-card-item {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 16px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.04);
}

🔍 主要9大モジュール総合マップ（文字と画像の融合）

▲ 【図】主要9大モジュール総合マップ

1 情報発信系モジュール

d3news（ニュース・お知らせ）、d3gallery（施工・商品写真）、slider（トップスライダー）。

2 対話・資料系モジュール

formmail（SSL対応問い合わせ）、d3downloads（カタログ・PDF配布）、manual（ドキュメント）。

3 基盤・SEO系モジュール

sitemap（全自動XMLサイトマップ）、protector（リアルタイムWAF防御）。

4 次世代AI連携モジュール

tacmic_ai（Geminiによる自動記事生成・120字要約・3分類パーソナライズ）。

TacmicCMSに収録されている各モジュールについて、①インストール後の変化、②基本設定の重要項目、③投稿の手順、④編集と運用管理、⑤トップページへのブロック配置、⑥テンプレートによる見た目変更 の6大要素を徹底解説します。

第7章で完全マスターする9大モジュール

d3news は、企業の「新着情報」「プレスリリース」「スタッフブログ」を支える最強のニュース配信モジュールです。

📷 図 7-1: d3news トピックス一覧画面（カテゴリフィルタ＆新着表示）

🔍 d3news フロント画面とメニュー変化（文字と画像の融合）

▲ 【図】d3news フロント画面とメニュー変化

1 メインメニューへの追加

サイトメニューに「お知らせ」が自動追加され、即座に閲覧可能。

2 新着トピックス一覧

日付、カテゴリバッジ、記事タイトル、投稿者が整然とリスト表示。

3 カテゴリ別ナビゲーション

サイドバーまたは一覧上部にカテゴリ切り替えタブが生成。

インストールを実行した瞬間にサイト内で起きること

1. データベースに専用テーブルが生成：
   zaukyeoj_d3news_contents（記事本文）、zaukyeoj_d3news_categories（カテゴリ定義）、zaukyeoj_d3news_comments（読者コメント）などが自動生成されます。
2. メインメニューに「トピックス」が自動追加：
   サイト訪問者がクリックできるナビゲーションリンクが出現します。
3. ブロック管理に新着ブロックが追加：
   「最新トピックス一覧」「トピックスカテゴリ一覧」の2大ブロックがブロック管理に登場します。
4. 初期画面：
   まだ記事がない状態では「記事がありません」と表示され、管理者ログイン時のみ「新規投稿」ボタンが表示されます。

🔍 d3news 一般設定パネル（文字と画像の融合）

▲ 【図】d3news 一般設定パネル

1 1ページあたり表示件数

一覧画面に表示する記事件数（推奨: 10〜15件）。

2 アイキャッチ画像サイズ

サムネイルの最大幅・高さを自動トリミングする設定。

3 一般ユーザーの投稿権限

管理者のみ投稿可能、または特定グループの会員にも投稿を許可するか。

d3newsの動作を決める重要設定項目

「コントロールパネル ➔ モジュール管理 ➔ d3newsの一般設定（歯車アイコン）」を開きます。

新着ニュース（d3news）の投稿画面は、直感的なWYSIWYGエディタと画像ドラッグ＆ドロップ機能を備えた使いやすい設計になっています。下図の番号ピン（❶〜❹）に沿って入力すれば、誰でも5分でプロ品質の記事が公開できます。

🔍 投稿フォーム入力ガイド（文字と画像の融合）

▲ 【図7-2】d3news 記事投稿フォームの上半部（タイトル・カテゴリ・アイキャッチ画像登録部）

1 記事タイトル（見出し）

読者の目を引く明快なタイトルを入力します。検索エンジンで重要なキーワードを自然に含めると効果的です。

2 所属カテゴリの選択

あらかじめ管理画面で作成したカテゴリ（お知らせ、イベント、リリース等）をドロップダウンから選択します。

3 優先順位（表示ウェイト）

記事の表示順序を数値で調整できます。同日投稿された記事の中で最上位に固定したい場合は数値を大きく設定します。

4 アイキャッチ画像のアップロード

ドラッグ＆ドロップで記事の代表サムネイル写真を登録可能。一覧ブロックやSNSシェア（OGP）に自動連動します。

投稿を完了するまでの全ステップ

1. 本文執筆（WYSIWYGエディタ）：リッチテキストエディタで小見出しの装飾、リスト箇条書き、文中画像の貼り付けを行います。
2. 公開日時の指定（予約投稿）：即座に公開する場合は現在時刻のまま、後日公開したい場合は希望の日時を指定します。指定時刻までは一般ユーザーから秘匿されます。
3. 下書き保存・公開：「下書き保存」でレビュー待ちにするか、「公開」ボタンで即座にサイト上へリリースします。

過去記事の修正、予約投稿、非公開化の運用フロー

📷 図 7-3: d3news カテゴリ一覧・管理画面

• 記事の修正：管理者ログイン状態で記事詳細画面を開くと、画面上部に「✏️ この記事を編集」ボタンが表示され、クリックひとつで編集画面へ入れます。
• 日時指定の予約公開：公開日時を「来週月曜の朝9:00」に設定しておくと、その時刻になるまで一般の訪問者には一切表示されず、指定時刻に自動公開されます。
• 下書き・非公開化：ステータスを「下書き（Draft）」に変更することで、URLを知っていても一般ユーザーは閲覧できなくなります。

🔍 d3news 新着ブロックの配置と表示設定（文字と画像の融合）

▲ 【図】d3news 新着ブロックの配置と表示設定

1 表示件数（5〜8件推奨）

トップページをスッキリ保ちつつ、最新の動向を漏れなくアピール。

2 日付とカテゴリバッジの表示

日付表示フォーマット（YYYY/MM/DD）とカラーバッジ。

3 一覧ページへの「もっと見る」リンク

過去ログ一覧（/modules/d3news/）へスムーズに誘導。

トップページの中央に「最新のお知らせ」を並べる手順

1. 「ALTSYS ➔ ブロック管理」を開きます。
2. モジュール選択で「トピックス (d3news)」を絞り込みます。
3. 「最新トピックス一覧（Topics List）」のブロックを見つけます。
4. 表示エリア：中央上部（Center Top）または左サイドバー（Left）を選択。
5. 表示ページ：「トップページのみ」にチェック。
6. ブロックのオプション設定：歯車アイコンを押し、「表示件数（例: 5件）」「日付表示の有無」を指定。
7. 「送信」ボタンを押してトップページをリロードすると、最新トピックスが美しく掲載されます！

🔍 d3news テンプレートの構造とカスタマイズ（文字と画像の融合）

▲ 【図】d3news テンプレートの構造とカスタマイズ

1 メイン一覧テンプレート (main_index.html)

カード型レイアウトやテーブル型レイアウトへのデザイン切替。

2 詳細表示テンプレート (main_article.html)

本文、SNSシェアボタン、前後の記事ナビゲーションの配置調整。

d3newsの見た目をカスタマイズする対象テンプレート

• 一覧画面：d3news_main_index.html（記事タイトルのフォントサイズ、日付の並び、ページネーション）
• 詳細画面：d3news_main_article.html（記事本文の余白、前後の記事へのナビゲーションリンク）
• トップ新着ブロック：d3news_b_topics.html（トップページに表示されるリストのデザイン）

d3gallery は、アルバム管理と美しいLightboxスライドショーを備えたメディアギャラリーです。

📷 図 7-3: d3gallery メディアギャラリー画面（アルバム＆最近の写真）

インストール直後の状態とアルバムの作成

インストールすると、画像アップロード用ディレクトリ（uploads/d3gallery/）が初期化され、専用テーブル（zaukyeoj_d3gallery_photos, zaukyeoj_d3gallery_categories）が生成されます。

まずは管理画面から「アルバム（例: 2026年社内イベント、新製品カタログ写真）」を作成します。

📷 図 7-5: d3gallery アルバム＆メディア管理画面

🔍 d3gallery 一般設定パネル（文字と画像の融合）

▲ 【図】d3gallery 一般設定パネル

1 最大画像解像度（長辺1920px）

スマホで撮影した大容量写真を自動でWeb最適化リサイズ。

2 サムネイル生成エンジン (GD/Imagick)

一覧表示用の正方形・長方形サムネイルを高画質で自動生成。

3 許可拡張子（jpg, png, webp）

次世代画像形式WebPにも完全対応。

一般設定の重要チューニング

• 最大画像サイズ：2048pxなどに制限し、サーバー容量の圧迫を防止。
• サムネイル幅/高さ：一覧表示用の縮小サイズ（300x200px等）を定義。
• 許可拡張子：jpg, jpeg, png, gif, webp を許可。

🔍 写真の一括ドラッグ＆ドロップアップロード画面（文字と画像の融合）

▲ 【図】写真の一括ドラッグ＆ドロップアップロード画面

1 ドラッグ＆ドロップドロップゾーン

PCフォルダから複数写真をまとめてドロップするだけで一括登録。

2 アルバム選択プルダウン

どの施工事例・アルバムに写真を格納するかを指定。

3 タイトル・キャプション入力

1枚ずつの写真に説明文や撮影日、タグを付与。

写真をまとめて登録する手順

1. ギャラリー画面の「写真をアップロード」をクリック。
2. 所属させたい「アルバム」を選択。
3. パソコンから複数枚の画像ファイルをまとめてドラッグ＆ドロップ！
4. 各写真にタイトル（キャプション）や撮影日、説明文を入力して保存。
5. 自動的に高画質サムネイルが生成され、ギャラリーに公開されます。

🔍 写真の並び替え・アルバム移動操作エリア（文字と画像の融合）

▲ 【図】写真の並び替え・アルバム移動操作エリア

1 アルバム間の写真移動

チェックを入れた写真を別のアルバムへ一括で移動。

2 並び順（ウェイト）変更

目立たせたいベストショットを先頭にドラッグ配置。

登録した写真の管理と並び替え

写真詳細画面からいつでもタイトルや説明文を変更可能。アルバム間の移動や、表示順（ウェイト）の数値調整による並び替えもマウス操作で行えます。

🔍 ギャラリーブロックの配置とビジュアル訴求（文字と画像の融合）

▲ 【図】ギャラリーブロックの配置とビジュアル訴求

1 最新フォトグリッドブロック

トップページ下部に最新の写真4〜8枚を美しいタイル状に自動表示。

2 クリックでフルサイズ拡大

ページ遷移なしで写真がポップアップ拡大するLightbox連動。

トップページに写真グリッドを埋め込む

「ALTSYS ➔ ブロック管理」で「d3gallery / 最近追加された写真」を選択し、中央下部（Center Bottom）に「トップページのみ」で配置します。ブロック設定で「表示枚数: 6枚」などにすると、美しい3×2の写真グリッドがトップに並びます。

🔍 ギャラリーテンプレートのCSSグリッド・Lightbox設計（文字と画像の融合）

▲ 【図】ギャラリーテンプレートのCSSグリッド・Lightbox設計

1 CSS Grid カラム数（3列・4列）

PCでは4列、スマホでは2列に切り替わるレスポンシブグリッド。

2 Lightboxポップアップ属性

Smartyテンプレート内の data-lightbox 属性でポップアップ動作を制御。

カスタマイズ対象テンプレート

d3gallery_main_index.html（アルバム一覧）、d3gallery_main_photo.html（写真詳細）、d3gallery_b_recent.html（トップ用ブロック）。CSSで画像のホバーエフェクト（拡大・フェード）を追加できます。

formmail は、プログラミング不要で自由な入力フォームやアンケートを構築できる万能フォームモジュールです。

📷 図 7-4: formmail フォーム一覧画面（問い合わせ・アンケート）

🔍 formmail フロント問い合わせ画面と初期フォーム（文字と画像の融合）

▲ 【図】formmail フロント問い合わせ画面と初期フォーム

1 必須入力チェックマーク

お名前、メールアドレス、件名、内容などの必須バリデーション。

2 入力確認画面ボタン

送信前に内容をユーザーに再確認させる安心の2ステップ送信。

3 SSL暗号化送信通知

通信が暗号化されていることを明示し、ユーザーの離脱を防止。

インストール直後の状態

インストールすると、標準の「総合お問い合わせフォーム」が1件サンプルとして自動登録されます。お名前、メールアドレス、電話番号、ご相談内容があらかじめセットされているため、そのまますぐに実運用を開始できます。

🔍 formmail メール送信・自動返信設定パネル（文字と画像の融合）

▲ 【図】formmail メール送信・自動返信設定パネル

1 管理者通知先メールアドレス

問い合わせ受信時に即座に転送する社内アドレス（複数指定可）。

2 自動返信メールテンプレート

「お問い合わせありがとうございます」の文面と受付控えを自動返信。

3 文字コードエンコーディング (UTF-8)

スマホや各種メーラーでの文字化けを完全防止するヘッダー設定。

メール送信の最重要設定

• 管理者通知先メールアドレス：フォームから送信があった際に通知を受け取る社内アドレス。
• 自動返信（サンキューメール）の有効化：お客様へ「お問い合わせを受け付けました」という確認メールを自動返信。
• 文字コード設定：UTF-8またはISO-2022-JPによる文字化け完全防止。

ドラッグ操作でフォーム項目を自在に追加

📷 図 7-7: formmail フォーム項目設計画面

管理画面の「フォーム項目管理」から、以下のパーツを何個でも追加・配置できます：

• 一行テキスト（お名前、会社名）
• 複数行テキスト（お問い合わせ内容）
• セレクトボックス／ラジオボタン（ご相談種別）
• チェックボックス（希望する資料）
• ファイル添付（履歴書PDFや写真の受付）

🔍 受信ログ管理とCSV一括エクスポート（文字と画像の融合）

▲ 【図】受信ログ管理とCSV一括エクスポート

1 受信データ一覧

過去の問い合わせ履歴、送信日時、ステータス（未対応／対応済）。

2 CSVダウンロードボタン

全問い合わせデータをExcel/スプレッドシート用CSVで一括出力。

3 個人情報の安全パージ

一定期間が経過した個人情報データを安全に一括削除。

受信した問い合わせの管理とCSV出力

送信された問い合わせはメールで届くだけでなく、管理画面の「受信ログ」に安全に蓄積されます。いつでも一覧で確認でき、Excelで開ける「CSV一括ダウンロード」もワンクリックで実行できます。

🔍 サイト全域への問い合わせ導線とバナー連携（文字と画像の融合）

▲ 【図】サイト全域への問い合わせ導線とバナー連携

1 ヘッダー／フッターのCTAボタン

「無料お見積り・お問い合わせ」への目立つボタンリンク。

2 サイドバー固定バナーブロック

どの記事を読んでいても問い合わせフォームへジャンプできるブロック配置。

訪問者をスムーズにフォームへ導く設計

サイドバーに「お問い合わせはこちら」のバナーブロックを配置し、URL /m/formmail/ へ誘導します。また、特定の商品ページ内にフォームを直接埋め込むことも可能です。

🔍 フォームデザインとモバイルフレンドリー調整（文字と画像の融合）

▲ 【図】フォームデザインとモバイルフレンドリー調整

1 入力フォームの横幅100%化

スマートフォンで押しやすい大きな入力フィールドとタップ領域。

2 送信ボタンの立体デザイン

hoverエフェクトと鮮やかなカラーで送信CVR（成約率）を向上。

フォームデザインのカスタマイズ

formmail_main_index.html を編集することで、入力フィールドの角丸（border-radius）や送信ボタンのグラデーション、必須項目のバッジ色などをブランドイメージに合わせて調整できます。

d3downloads は、PDFカタログ、製品マニュアル、仕様書などのファイル配布とダウンロード集計を行うリポジトリモジュールです。

📷 図 7-5: d3downloads ダウンロードセンター画面

🔍 d3downloads フロント画面とカテゴリ階層（文字と画像の融合）

▲ 【図】d3downloads フロント画面とカテゴリ階層

1 配布カテゴリツリー

「カタログ」「取扱説明書」「申請書PDF」「各種ドライバ」等の階層分類。

2 資料一覧カード

ファイル名、サムネイル、ファイルサイズ、更新日時をスッキリ表示。

3 ダウンロードボタン

ワンクリックでファイルダウンロードを開始するわかりやすいボタン。

インストールとカテゴリ構成

インストール後、管理画面で「製品カタログ」「取扱説明書」「申請書式」などのカテゴリを作成します。

🔍 d3downloads 一般設定パネル（文字と画像の融合）

▲ 【図】d3downloads 一般設定パネル

1 最大ファイルサイズ制限

大容量PDFやZIPファイルを安全にアップロードできるサイズ指定。

2 閲覧・DL権限（グループ別）

誰でも落とせる公開資料 vs 会員登録が必要な限定資料の出し分け。

一般設定の重要ポイント

• 最大ファイルサイズ：20MBや50MBなどサーバーの許容値に合わせて設定。
• 閲覧・DL権限：「ゲストOK」「登録ユーザー限定」などをカテゴリごとに細かく制御可能。

🔍 資料ファイル登録フォーム（文字と画像の融合）

▲ 【図】資料ファイル登録フォーム

1 ファイルアップロード

PDF, ZIP, DOCX 等の資料実体をサーバーにアップロード。

2 表紙・サムネイル画像

資料の表紙やスクリーンショットを登録して視覚的魅力をアップ。

3 バージョン番号・更新情報

「Ver 2.1.0」などの版数と、改訂内容の箇条書き解説。

ファイルの登録手順

ファイルをアップロードし、資料の表紙画像（サムネイル）、バージョン番号（例: Ver 2.1）、更新履歴を入力して登録します。

🔍 バージョン更新とダウンロード統計（文字と画像の融合）

▲ 【図】バージョン更新とダウンロード統計

1 ファイル差し替え更新

URLを変えずに最新版ファイルへスムーズに差し替え。

2 ダウンロード数カウンタ

どの資料が何回ダウンロードされたかの人気度計測。

改訂版の差し替えとダウンロード数の分析

過去のダウンロード統計（日別・月別・累計）をグラフで確認可能。改訂版ファイルへ上書き更新しても、累計カウントやURLを維持できます。

🔍 ダウンロードランキングブロックの配置（文字と画像の融合）

▲ 【図】ダウンロードランキングブロックの配置

1 人気ランキングブロック

ダウンロード数の多い順にトップ5資料を王冠アイコン付きで表示。

2 最新カタログ速報ブロック

新しく追加された製品カタログをトップページでPR。

トップページに人気資料を掲載

「d3downloads / 人気ダウンロードTOP5」ブロックを右サイドバー等に配置することで、見込み客の資料請求を劇的に増やせます。

🔍 ダウンロード画面のSmartyテンプレート（文字と画像の融合）

▲ 【図】ダウンロード画面のSmartyテンプレート

1 カード型ファイル一覧

サムネイル主体のリッチなカードデザインへカスタマイズ。

2 利用規約同意チェック

「ダウンロード前に利用規約に同意する」必須チェックの組み込み。

テンプレート

d3downloads_main_index.html（一覧）、d3downloads_main_detail.html（詳細・ダウンロードボタン）。

d3chapter（マニュアル名: manual）は、体系的な文書を「本」として編纂し、EPUB電子書籍や印刷形式で出力できる文書出版モジュールです。

📷 図 7-6: d3chapter 公式マニュアル（目次一覧・EPUB出力・印刷画面連動）

🔍 d3chapter 4階層ドキュメントツリー構造（文字と画像の融合）

▲ 【図】d3chapter 4階層ドキュメントツリー構造

1 第1階層（部・編）

マニュアルの大きな大区分（layer1）。

2 第2階層（章）

テーマごとのまとまり（layer2）。

3 第3階層（節）

具体的な操作手順・設定項目（layer3）。

4 第4階層（項）

詳細な小見出しや補足（layer4）。

部・章・節・項の美しい階層ツリー

d3chapter は、第1層（部・章）➔ 第2層（節）➔ 第3層（項）➔ 第4層（目）という4段階のアウトライン構造をサポート。膨大な技術文書や業務マニュアルを美しく構造化できます。

🔍 d3chapter 一般設定パネル（文字と画像の融合）

▲ 【図】d3chapter 一般設定パネル

1 スマートURL (PATH_INFO)

content.php/章/節 の標準URL生成スイッチ。

2 EPUB電子書籍出力の有効化

ワンクリックでKindle/Apple Books用EPUBファイルを生成する機能。

3 印刷用A4ビュー機能

全章または指定章をまとめて印刷・PDF保存できるクリーンビュー。

設定項目

• EPUB出力時の書名・著者名：電子書籍としてダウンロードされた際のメタデータ設定。
• 目次の初期展開階層：第2階層まで表示するか、第3階層まで全展開するか。

アウトライン編集と執筆手順

📷 図 7-7: d3chapter アウトライン編集画面（章立てと階層番号指定）

「アウトライン編集」画面で「1-1」「1-2」「2-1」のように階層番号とタイトルを一括入力し、あとは各項目の「編集」ボタンからCKEditorで本文を執筆します。

リナンバリング機能と印刷・EPUB

📷 図 7-11: d3chapter アウトライン一括リナンバリング画面

📷 図 7-12: A4印刷最適化プレビュー画面

• リナンバリング（番号自動振り直し）：途中に章を追加しても、ワンクリックで全項目の連番（1-1, 1-2, 1-3...）を綺麗に再計算。
• EPUB出力（epub.php）：iPhone（Apple Books）やKindleでそのまま読める電子書籍を即座に出力。
• 印刷ビュー（print.php）：A4印刷に最適化されたすっきりしたレイアウトを表示。

🔍 マニュアル目次ブロックの配置（文字と画像の融合）

▲ 【図】マニュアル目次ブロックの配置

1 折りたたみ式目次ブロック

左サイドバーに現在地がハイライトされるアコーディオン目次を配置。

2 トップページクイック目次

全章のインデックスをカード型でトップページに一覧提示。

目次ブロックの活用

「d3chapter / 目次ブロック」をサイドバーに配置すると、いまマニュアルのどのページを読んでいるかがハイライト表示され、読者が迷子になりません。

🔍 マニュアル本文のCSS装飾とカードデザイン（文字と画像の融合）

▲ 【図】マニュアル本文のCSS装飾とカードデザイン

1 文字と画像の融合カード

図と番号ピン（❶❷❸）を組み合わせた見やすい操作手順枠。

2 コードブロック＆アラート枠

TIP、NOTE、WARNINGなどの重要アラートを色分け強調。

CSSカスタマイズ

d3chapter.css または chapox.css を編集することで、見出し（h1〜h4）のデザインや引用枠、前後のページ送りボタンのスタイルを調整できます。

🔍 トップビジュアルスライダー（slider）の構造と役割（文字と画像の融合）

▲ 【図】トップビジュアルスライダー（slider）の構造と役割

1 メインキャッチコピー

訪問者が最初に目にする最重要キャッチコピーとサブテキスト。

2 フルワイド背景画像

高解像度写真を画面いっぱいに表示してサイトの高級感を演出。

3 CTAアクションボタン

「詳しくはこちら」「無料相談はこちら」等の成約リンク。

4 スライドインジケーター

自動スライドおよび左右矢印による直感的な切り替え。

slider は、トップページに大迫力のビジュアルカルーセルを配置するスライダー管理モジュールです。

管理画面

📷 図 7-13: slider スライダー画像管理画面

インストールすると、スライダー画像の一覧、新規スライド追加フォーム、表示秒数の設定画面が利用可能になります。

🔍 スライド画像の登録・見出し設定手順（文字と画像の融合）

▲ 【図】スライド画像の登録・見出し設定手順

1 画像ファイル選択

横1920px・縦600px前後の最適化画像をアップロード。

2 見出し・本文入力

スライド上に重ねて表示するテキストを指定。

3 リンク先URL設定

クリック時にジャンプさせたい特設ページURLを指定。

4 表示順序（並び順）

1枚目、2枚目、3枚目とスライドの再生順序を制御。

スライドの登録手順

1. スライダー画像をアップロード（推奨サイズ: 横1200〜1920px、縦500〜700px）。
2. スライド上に重ねて表示する「キャッチコピー（見出し）」と「説明文」を入力。
3. クリックした際の「リンク先URL（例: 特設キャンペーンページ等）」を入力して保存。

🔍 トップページ中央最上部へのスライダー配置（文字と画像の融合）

▲ 【図】トップページ中央最上部へのスライダー配置

1 中央上部 (Center Top 1)

ブロック管理で最優先順位（ウェイト0）に配置。

2 トップページ限定表示

全ページではなくトップページのみに絞り込み指定。

3 全グループ閲覧許可

ゲスト・一般会員問わずすべての訪問者に訴求。

トップ配置

「ALTSYS ➔ ブロック管理」で「Slider / メインスライダーブロック」を中央上部（Center Top）に「トップページのみ」で配置します。最上部に表示するため、並び順（ウェイト）を 0 または 1 に設定します。

🔍 スライドアニメーション・エフェクト設定（文字と画像の融合）

▲ 【図】スライドアニメーション・エフェクト設定

1 フェード vs スライド

やさしいフェードイン、またはダイナミックな横スライドを選択。

2 自動再生秒数

推奨5〜7秒間隔。長すぎず短すぎない最適な読了時間を設定。

3 ホバー時一時停止

ユーザーがマウスを乗せている間はスライドを一時停止。

動作カスタマイズ

スライドの切り替え時間（例: 5000ミリ秒 = 5秒）、フェードイン/スライドアニメーション、自動再生のON/OFFを好みに応じて微調整できます。

sitemap は、全モジュールを自動走査してサイト全体のツリーを動的生成するSEO支援モジュールです。

📷 図 7-8: sitemap サイトマップ自動生成画面

🔍 サイトマップ自動巡回・構造生成の仕組み（文字と画像の融合）

▲ 【図】サイトマップ自動巡回・構造生成の仕組み

1 全モジュール自動検知

インストール済みのモジュールを自動スキャンしてページ抽出。

2 カテゴリ・階層ツリー化

新着情報のカテゴリやマニュアル章立てをツリー構造化。

3 アクセス権限連動

ゲストが見られない会員専用ページを自動で非公開除外。

プラグインによる自動検知

インストールするだけで、d3news、d3gallery、manual、formmail などの各モジュール内に用意された sitemap.plugin.php を自動検知し、カテゴリや記事の階層ツリーを全自動生成します。

🔍 XMLサイトマップと検索エンジン連携（文字と画像の融合）

▲ 【図】XMLサイトマップと検索エンジン連携

1 sitemap.xml 自動生成

Google Search Console用の標準XMLフィードを即時出力。

2 フッターナビゲーション

ユーザー向けHTMLサイトマップへの直通リンクをフッターに配置。

3 更新頻度の自動通知

記事が更新された際に検索エンジンへ更新ピンを送信。

SEO対策とナビゲーション

フッターに「サイトマップ（/m/sitemap/）」へのリンクを設置することで、ユーザーの利便性が向上。さらに検索エンジン向けのXMLサイトマップを出力し、Googleサーチコンソールへの登録を支援します。

🔍 Protector (WAF) 総合セキュリティ概要（文字と画像の融合）

▲ 【図】Protector (WAF) 総合セキュリティ概要

1 リアルタイムWAF防御

SQLインジェクション、DoS連打、XSSスクリプトを水際で粉砕。

2 セキュリティ診断スコア

サイトの脆弱性（mainfileパーミッション等）を点数で即座に判定。

3 攻撃者IP自動遮断

しきい値を超えた不正アクセスIPを自動BANリストへ隔離。

4 詳細アクセスログ監視

いつ、どこから、どんな攻撃が試みられたかを管理画面で完全追跡。

protector は、サイトへの不正アクセスやサイバー攻撃をリアルタイムに自動防御するWAFシステムです。

🔍 セキュリティ診断スコアと安心チェック項目（文字と画像の融合）

▲ 【図】セキュリティ診断スコアと安心チェック項目

1 総合安全スコア（満点100）

緑色（90点以上）を維持することで最高度のセキュリティを保証。

2 TRUST_PATH分離判定

非公開領域が正しくWebルート外に存在するかを自動判定。

3 パーミッション検査

mainfile.php が 444（読込専用）になっているかを即座にチェック。

セキュリティ診断センター

管理画面を開くと、サーバーのパーミッションやphp.iniの設定、installディレクトリの残存チェックが行われ、安全スコアが表示されます。

🔍 Protector 推奨防御ルールとチューニング（文字と画像の融合）

▲ 【図】Protector 推奨防御ルールとチューニング

1 F5連打・DoS攻撃拒否

同一IPから10秒間に60回以上のリクエストを検知して一時遮断。

2 スパム投稿拒否

海外からの不審な英文リンクスパムを自動判別して破棄。

3 SQLインジェクション拒否

クエリ文字列に含まれる危険なキーワードを強力に無害化。

おすすめ防御パラメータ

• F5アタック・高速アクセス：1秒間に10回以上のアクセスを一時追放。
• 悪質IPの自動遮断：SQLインジェクションを試みたIPを「永久拒否リスト」へ自動登録。

🔍 万一の誤BAN時の管理者緊急復旧手順（文字と画像の融合）

▲ 【図】万一の誤BAN時の管理者緊急復旧手順

1 誤BANの原因

管理者がテストで連続投稿した際等にProtectorが攻撃と判定。

2 緊急解除手順

trust_path/modules/protector/configs/badips を直接空にして即座に復旧。

3 管理者IPホワイトリスト

管理者の固定IPをあらかじめ例外リストに登録して誤BANを恒久防止。

万が一管理者が締め出された場合の救済策

誤って管理者自身がBANされてしまった場合は、FTPまたはサーバーファイルマネージャーで trust_path/modules/protector/configs/ 内の拒否リストファイル（またはキャッシュ）を直接編集・削除することで即座に復帰できます。

🔍 次世代AI連携 (tacmic_ai) の全体像（文字と画像の融合）

▲ 【図】次世代AI連携 (tacmic_ai) の全体像

1 Google Gemini API連携

最先端の生成AIモデルを活用した高精度テキスト自動生成。

2 120文字高速要約

長文記事をSNSや一覧表示用にワンクリックで魅力的に要約。

3 3タイプ文体パーソナライズ

Action / Thinking / Emotion に合わせた最適な文体切り替え。

4 PDF鑑定書・レポート生成

AI生成テキストをPDF帳票へ組み込んでワンクリック出力。

tacmic_ai は、Google Gemini AIの超知能をCMS管理画面と直接統合する次世代コンテンツ支援モジュールです。

🔍 Gemini APIキーの取得と簡単設定手順（文字と画像の融合）

▲ 【図】Gemini APIキーの取得と簡単設定手順

1 Google AI Studio で取得

無料でAPIキーを即時発行（数分で完了）。

2 tacmic_ai 一般設定に入力

管理画面の設定欄にAPIキーを安全に保存。

3 モデル選択（Gemini 2.5/Flash）

用途に合わせて超高速モデルまたは高精度モデルを選択。

APIキーの接続

Google AI Studioで取得したGemini APIキーをモジュール一般設定に入力するだけで、AI接続が即座に確立されます。

🔍 記事生成・要約・パーソナライズの実践活用（文字と画像の融合）

▲ 【図】記事生成・要約・パーソナライズの実践活用

1 記事作成アシスタント

タイトルとキーワードを入れるだけでブログ記事のドラフトを即時生成。

2 SEOメタキーワード生成

記事本文から最も重要な検索キーワードを自動抽出。

3 多言語翻訳アシスタント

海外展開向けに英語や中国語への高精度翻訳をサポート。

AI活用の具体例

• 要約文の自動生成：長文コラムからSNS用や一覧画面用の120文字要約をワンクリック抽出。
• 告知記事のドラフト生成：「来月のイベント概要」の箇条書きから魅力的な告知文を自動起草。

🔍 独自モジュール開発とD3複製 4大アーキテクチャ（文字と画像の融合）

▲ 【図】独自モジュール開発とD3複製 4大アーキテクチャ

1 公開側ラッパーの構造

html/modules/ 内に配置する最小限のディスパッチャ。

2 非公開ロジックの分離

trust_path/modules/ 内に格納する中核ビジネスロジック。

3 D3複製（クローニング）

my_dirname 置換による無限モジュール増設の極意。

4 REST APIとモバイル連携

JSON APIを介したiPhone/AndroidアプリやSPAとの安全通信。

Webエンジニアやプログラマー向けに、TacmicCMS 2.0のモジュール開発アーキテクチャ、D3複製手順、PDOによるデータベースコーディング規約を解説します。

第8章のラインナップ

• 8-1: modules フォルダの構造と公開側ラッパー／非公開ロジックの分離
• 8-2: D3モジュールの複製（クローニング）完全手順：1分で新モジュール作成
• 8-3: データベース設計とPDO・SQL安全コーディング規約
• 8-4: REST API開発と外部連携：モバイルアプリやモダンフロントエンド接続

🔍 modules フォルダ構造と公開・非公開の完全分離（文字と画像の融合）

▲ 【図】modules フォルダ構造と公開・非公開の完全分離

1 html/modules/モジュール名/index.php

XOOPS_TRUST_PATH 内の main.php を呼び出すだけの安全ラッパー。

2 trust_path/modules/モジュール名/include/

関数群、クラス定義、DB操作ロジックの中枢プログラム。

3 trust_path/modules/モジュール名/templates/

Smartyテンプレートファイルを一元管理。

4 trust_path/modules/モジュール名/language/

日本語（ja_utf8）および英語の多言語リソースファイル。

公開側ラッパーと非公開ロジックの連携フロー

TacmicCMSにおけるD3モジュールは、以下の2箇所のディレクトリがペアになって動作します：

1. 公開側ディレクトリ (html/m/{mydirname}/)

各ファイルはわずか数行のラッパーコードのみで構成され、自身のディレクトリ名（$mydirname）を取得して TRUST_PATH 側のロジックを呼び出します：

<?php
// html/m/manual/index.php の例
require '../../mainfile.php';
$mydirname = basename(dirname(__FILE__));
require dirname(__FILE__) . '/mytrustdirname.php'; // $mytrustdirname = 'd3chapter';
require XOOPS_TRUST_PATH . '/modules/' . $mytrustdirname . '/main.php';
?>

2. 非公開側ディレクトリ (trust_path/modules/{mytrustdirname}/)

コントローラー、モデル、言語ファイル、Smartyテンプレート（templates/）、SQL定義（sql/mysql.sql）など、システムの全知性・実体がここに集約されています。

🔍 D3モジュールの複製（クローニング）4ステップ手順（文字と画像の融合）

▲ 【図】D3モジュールの複製（クローニング）4ステップ手順

1 公開ディレクトリの別名コピー

html/modules/d3news/ を d3news2/ にフォルダごとコピー。

2 trust_path側設定の確認

trust_path側は同一フォルダのまま共有（再配置不要！）。

3 管理画面でインストール

管理メニューの「モジュール管理」を開くと新規モジュールとして即座に認識。

4 独立したDBテーブル自動生成

zaukyeoj_d3news2_* のようにプレフィックスが自動分離されて稼働。

既存モジュールをクローンして新しいモジュールを作成する3ステップ

例えば、d3news を複製して「スタッフブログ（blog）」を作成する手順は以下の通り極めて簡単です：

🔍 データベース設計とPDO・SQL安全コーディング規約（文字と画像の融合）

▲ 【図】データベース設計とPDO・SQL安全コーディング規約

1 PDOプリペアドステートメント必須

変数値をSQL文字列に直接埋め込まず、必ずプレースホルダー（:id）を使用。

2 テーブルプレフィックス連動

XOOPS_DB_PREFIX . '_モジュール名_テーブル' で動的に決定。

3 utf8mb4_general_ci 統一

テーブル作成時の文字セットと照合順序をutf8mb4に統一。

4 トランザクション処理

複数テーブル更新時は BEGIN / COMMIT / ROLLBACK で整合性を担保。

安全で保守性の高いSQLクエリの記述

TacmicCMS 2.0で独自モジュールやカスタムスクリプトを開発する際は、以下のルールを遵守してください：

// データベースアクセスの推奨パターン例
$db = icms_db_Factory::instance();
$sql = "SELECT lid, title, updated FROM " . $db->prefix("{$mydirname}_contents") . " WHERE mystatus = 'Active' ORDER BY updated DESC LIMIT 10";
$result = $db->query($sql);
$items = [];
while ($row = $db->fetchArray($result)) {
    $items[] = [
        'lid'   => (int)$row['lid'],
        'title' => htmlspecialchars($row['title'], ENT_QUOTES, 'UTF-8'),
        'date'  => date('Y-m-d H:i', (int)$row['updated']),
    ];
}

🔍 REST API開発と外部連携（モバイルアプリ・SPA接続）（文字と画像の融合）

▲ 【図】REST API開発と外部連携（モバイルアプリ・SPA接続）

1 エンドポイント設計

/api/v1/news.php 等でクリーンなJSON出力を供給。

2 トークン認証（Bearer Token）

アプリ専用のAPIトークンによる安全な認可制御。

3 CORSヘッダー最適化

許可された外部オリジンからの非同期通信のみをホワイトリスト許可。

4 マルチプラットフォーム展開

iPhone / Android / Vue.js / React へのシームレスなデータ提供。

CMSデータをヘッドレスに外部配信する

TacmicCMSのデータを、FlutterやSwiftで開発するネイティブモバイルアプリや、Vue.js/Reactで作るSPAフロントエンドと連携させるためのJSON APIエンドポイントを構築する基本設計です：

<?php
// api/news.php の例
require '../mainfile.php';
header('Content-Type: application/json; charset=utf-8');

$db = icms_db_Factory::instance();
$sql = "SELECT lid, title, mycontent, updated FROM " . $db->prefix("d3news_contents") . " WHERE mystatus = 'Active' ORDER BY updated DESC LIMIT 20";
$result = $db->query($sql);
$data = [];
while ($row = $db->fetchArray($result)) {
    $data[] = [
        'id'      => (int)$row['lid'],
        'title'   => $row['title'],
        'content' => $row['mycontent'],
        'date'    => date('c', (int)$row['updated']),
    ];
}
echo json_encode(['status' => 'success', 'data' => $data], JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT);
?>