外掛說明
Add your own CSS classes to specific Pages, Posts, or Custom Post Types—without editing theme files.
Add custom <body> classes—safely prefixed—on any Page, Post, CPT, or WooCommerce view (Shop, Cart, Checkout, My Account) with zero theme edits.
I created Custom Class Add On Page as a simple way to manage <body> classes with a safe ccaop_ prefix. Choose the target (Page, Blog page, Single Post, CPT archive/single, or a specific CPT item), save, and the class is injected via the body_class filter. Clean code, lightweight implementation, and solving real problems are the focus. Collaboration and feedback are welcome.
Highlights
– Add classes to: a single Page, the Blog (Posts) page, all Single Posts, CPT Archive, all CPT Singles, or a specific CPT item.
– Safe auto-prefix (ccaop_) prevents conflicts.
– WooCommerce-aware: Shop (product archive), Cart, Checkout, and My Account are supported.
– Clean admin UI with a table listing every rule you’ve created (class + location) and a delete action.
– Activation redirect: after activation, you’re taken straight to the settings page.
– Lightweight: uses the body_class filter only—no front-end bloat.
Video Tutorial
⚡ What you can configure
- Enter a custom class name (auto-saved as
ccaop_{your_class}). - Choose where to apply it: Page / Post / Custom Post.
- For Page pick any page (Blog/Posts page is intentionally excluded here; use Post Blog page).
- For Post choose Blog page (posts index) or All single posts.
- For Custom Post choose the CPT and target (Archive, All single, or Specific item).
Usage
- Go to Dashboard Class Option.
- Type your class name (e.g.
hero, saves asccaop_hero). - Select Page / Post / Custom Post, then pick the exact target.
- Click Save. Visit the selected view and inspect
<body>—you’ll see your class.
⚡ Features
- Ready to use—no coding needed
- Auto-prefixed classes to avoid collisions
- Page / Post / CPT (archive, single, specific item) targets
- WooCommerce Shop, Cart, Checkout, My Account support
- Rule list with delete action
- Lightweight & fast, theme-agnostic
- Works with cached sites (no dynamic output buffering)
WooCommerce Notes
If you select the Shop page under Page, the plugin detects it as the product archive and adds your class on Shop views correctly.
Similarly, Cart, Checkout (including endpoints like order-pay, order-received) and My Account are handled.
螢幕擷圖
Settings screen—add a class and choose where it applies 
Page/Post/CPT selectors (conditional dropdowns) 
Rules table with locations and delete action 
Example: class added to <body>on the front end
WooCommerce Shop page with custom body class
安裝方式
Minimum Requirements
- WordPress 5.8 or greater
- PHP 7.2 or greater
- MySQL 5.0 or greater
Automatic Installation
- In your WordPress dashboard, go to Plugins Add New.
- Search for Custom Class Add On Page.
- Click Install Now and then Activate.
You’ll be redirected to the settings page.
Manual Installation
- Upload the plugin folder to
/wp-content/plugins/. - Activate the plugin from Plugins in your dashboard.
- Go to Class Option in the admin menu.
Updating
Automatic updates should work seamlessly. As always, back up your site before updating.
常見問題集
-
Will this change my site’s HTML structure?
-
No. It only appends your custom class to the
<body>element via WordPress’sbody_classfilter. -
Can I add multiple rules?
-
Yes. Add as many mappings (class location) as you need. Each shows up in the table where you can delete them later.
-
Why can’t I see the Blog (Posts) page under “Page”?
-
By design, the Blog page is managed under Post Blog page to avoid confusion with static pages.
-
Does it support WooCommerce pages?
-
Yes—Shop (product archive), Cart, Checkout (and its endpoints), and My Account are supported.
-
Will my class be exactly what I type?
-
Your input is sanitized and auto-prefixed with
ccaop_(e.g.containerccaop_container) to keep it safe and unique.
使用者評論
這個外掛目前沒有任何使用者評論。
參與者及開發者
變更記錄
1.0.0
- Initial release: add custom classes to Pages, Posts, and CPTs; WooCommerce-aware; rule list; activation redirect.