PostToPod

Convert your blog posts into vertical short videos with a single click. Designed for Classic Editor. ブログ記事を1クリックで縦型ショート動画へ変換。クラシックエディター専用設計の軽量プラグイン。

---

🚀 Description / 概要

[English]

PostToPod is a lightweight, single-function WordPress plugin that converts your blog posts into vertical short videos (9:16) tailored for TikTok, YouTube Shorts, and Instagram Reels—completely within your browser. It adds a dedicated metabox to the Classic Editor screen, scans the post structure (Title and Headings), and renders an animated video with subtitles and background music (MP4/WebM) on the fly.

[日本語]

PostToPod は、WordPressのブログ記事からTikTok、YouTube Shorts、Instagram Reels向けの縦型ショート動画（9:16）をブラウザ完結で一発生成する、軽量・単一機能のプラグインです。 クラシックエディター（Classic Editor）の投稿画面に専用のメタボックスを追加し、記事の構造（タイトル・見出し）をスキャンして、自動でテロップ付きのアニメーション動画（MP4/WebM）をレンダリングします。

---

✨ Features / 主な機能

• 1-Click Heading Scan / 1クリック見出しスキャン
  • Automatically extracts h2, h3, and h4 tags from the post content instantly.
  • 記事内の h2, h3, h4 タグを瞬時に抽出します。
• 2-Layer Rich Background / 2レイヤーリッチ背景
  • Automatically transforms the featured image into a "blurred full-screen background" + "centered slow-zoom foreground" for a modern, professional look.
  • アイキャッチ画像を自動で「全面ぼかし背景」＋「中央ズーム配置」にして、今風の動画らしいリッチな質感に仕上げます。
• Smart Captions & Text Box / 自動テロップ＆角丸座布団
  • Supports automatic text wrapping based on Canvas dimensions and features a semi-transparent background box (captions cushion) to maximize readability.
  • 文字数に応じたCanvas自動折り返しと、どんな背景でも抜群に文字が見やすくなる半透明の背景ボックス（座布団）を実装。
• Seamless BGM Mixing / BGMシームレス合成
  • Mixes selected background tracks (Lo-Fi, Tech, Pop, or Mute) directly into the video stream using the Web Audio API.
  • Lo-Fi、Tech、PopなどのBGMをWeb Audio APIで動画ストリームに直接ミックス。
• Pure Client-Side Rendering / 完全フロントエンド処理
  • No server-side dependencies (like FFmpeg). Generation and downloads are processed entirely via the user's browser, keeping your server fast and secure.
  • サーバーサイド（FFmpeg等）に一切の負荷をかけず、ブラウザの処理だけで高速に動画ファイルを生成・ダウンロードできます。

---

🛠 Installation / インストール方法

1. Clone or download the ZIP of this repository. GitHubからリポジトリをクローンまたはZIPダウンロードします。
2. Place the post-to-pod folder into your WordPress plugins directory (/wp-content/plugins/). WordPressのプラグインディレクトリ（/wp-content/plugins/）に post-to-pod フォルダとして配置します。
3. Activate PostToPod from the 'Plugins' menu in your WordPress admin dashboard. WordPress管理画面の「プラグイン」メニューから PostToPod を有効化します。

---

📦 Directory Structure / ディレクトリ構造

post-to-pod/
├── post-to-pod.php          # Main plugin file (Asset enqueuing & versioning)
├── includes/
│   └── admin-metabox.php    # Admin metabox HTML & structure definitions
├── assets/
│   ├── css/
│   │   └── admin-style.css  # UI styling for the metabox and preview frame
│   ├── js/
│   │   ├── admin-script.js  # Editor linkage & UI interactions
│   │   └── video-creator.js # Canvas rendering & MediaRecorder core engine
│   └── audio/
│       ├── bgm-lofi.mp3     # Chill Lo-Fi track
│       ├── bgm-tech.mp3     # Cyber Tech track
│       └── bgm-pop.mp3      # Upbeat Pop track
└── README.md                # This documentation file