feat: Page Editor Phase 1 - Core Infrastructure
- Add is_bot() detection in TemplateOverride.php (30+ bot patterns)
- Add PageSSR.php for server-side rendering of page sections
- Add PlaceholderRenderer.php for dynamic content resolution
- Add PagesController.php REST API for pages/templates CRUD
- Register PagesController routes in Routes.php
API Endpoints:
- GET /pages - list all pages/templates
- GET /pages/{slug} - get page structure
- POST /pages/{slug} - save page
- GET /templates/{cpt} - get CPT template
- POST /templates/{cpt} - save template
- GET /content/{type}/{slug} - get content with template applied
This commit is contained in:
Dwindi Ramadhana
473
includes/Api/PagesController.php
Normal file
473
includes/Api/PagesController.php
Normal file
@@ -0,0 +1,473 @@
|
||||
<?php
|
||||
namespace WooNooW\Api;
|
||||
|
||||
use WP_REST_Request;
|
||||
use WP_REST_Response;
|
||||
use WP_Error;
|
||||
use WooNooW\Frontend\PlaceholderRenderer;
|
||||
use WooNooW\Frontend\PageSSR;
|
||||
|
||||
/**
|
||||
* Pages Controller
|
||||
* REST API for page structures and CPT templates
|
||||
*/
|
||||
class PagesController
|
||||
{
|
||||
/**
|
||||
* Register API routes
|
||||
*/
|
||||
public static function register_routes()
|
||||
{
|
||||
$namespace = 'woonoow/v1';
|
||||
|
||||
// List all pages and templates
|
||||
register_rest_route($namespace, '/pages', [
|
||||
'methods' => 'GET',
|
||||
'callback' => [__CLASS__, 'get_pages'],
|
||||
'permission_callback' => '__return_true',
|
||||
]);
|
||||
|
||||
// Get/Save page structure (structural pages)
|
||||
register_rest_route($namespace, '/pages/(?P<slug>[a-zA-Z0-9_-]+)', [
|
||||
[
|
||||
'methods' => 'GET',
|
||||
'callback' => [__CLASS__, 'get_page'],
|
||||
'permission_callback' => '__return_true',
|
||||
],
|
||||
[
|
||||
'methods' => 'POST',
|
||||
'callback' => [__CLASS__, 'save_page'],
|
||||
'permission_callback' => [__CLASS__, 'check_admin_permission'],
|
||||
],
|
||||
]);
|
||||
|
||||
// Get/Save CPT templates
|
||||
register_rest_route($namespace, '/templates/(?P<cpt>[a-zA-Z0-9_-]+)', [
|
||||
[
|
||||
'methods' => 'GET',
|
||||
'callback' => [__CLASS__, 'get_template'],
|
||||
'permission_callback' => '__return_true',
|
||||
],
|
||||
[
|
||||
'methods' => 'POST',
|
||||
'callback' => [__CLASS__, 'save_template'],
|
||||
'permission_callback' => [__CLASS__, 'check_admin_permission'],
|
||||
],
|
||||
]);
|
||||
|
||||
// Get post with template applied (for SPA rendering)
|
||||
register_rest_route($namespace, '/content/(?P<type>[a-zA-Z0-9_-]+)/(?P<slug>[a-zA-Z0-9_-]+)', [
|
||||
'methods' => 'GET',
|
||||
'callback' => [__CLASS__, 'get_content_with_template'],
|
||||
'permission_callback' => '__return_true',
|
||||
]);
|
||||
|
||||
// Create new page
|
||||
register_rest_route($namespace, '/pages', [
|
||||
'methods' => 'POST',
|
||||
'callback' => [__CLASS__, 'create_page'],
|
||||
'permission_callback' => [__CLASS__, 'check_admin_permission'],
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Check admin permission
|
||||
*/
|
||||
public static function check_admin_permission()
|
||||
{
|
||||
return current_user_can('manage_woocommerce');
|
||||
}
|
||||
|
||||
/**
|
||||
* Get all pages and templates
|
||||
*/
|
||||
public static function get_pages(WP_REST_Request $request)
|
||||
{
|
||||
$result = [];
|
||||
|
||||
// Get structural pages (pages with WooNooW structure)
|
||||
$pages = get_posts([
|
||||
'post_type' => 'page',
|
||||
'posts_per_page' => -1,
|
||||
'meta_query' => [
|
||||
[
|
||||
'key' => '_wn_page_structure',
|
||||
'compare' => 'EXISTS',
|
||||
],
|
||||
],
|
||||
]);
|
||||
|
||||
foreach ($pages as $page) {
|
||||
$result[] = [
|
||||
'id' => $page->ID,
|
||||
'type' => 'page',
|
||||
'slug' => $page->post_name,
|
||||
'title' => $page->post_title,
|
||||
'url' => get_permalink($page),
|
||||
'icon' => 'page',
|
||||
];
|
||||
}
|
||||
|
||||
// Get CPT templates
|
||||
$cpts = self::get_editable_post_types();
|
||||
foreach ($cpts as $cpt => $label) {
|
||||
$template = get_option("wn_template_{$cpt}", null);
|
||||
|
||||
$result[] = [
|
||||
'type' => 'template',
|
||||
'cpt' => $cpt,
|
||||
'title' => "{$label} Template",
|
||||
'icon' => 'template',
|
||||
'permalink_base' => self::get_cpt_permalink_base($cpt),
|
||||
'has_template' => !empty($template),
|
||||
];
|
||||
}
|
||||
|
||||
return new WP_REST_Response($result, 200);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get page structure by slug
|
||||
*/
|
||||
public static function get_page(WP_REST_Request $request)
|
||||
{
|
||||
$slug = $request->get_param('slug');
|
||||
|
||||
// Find page by slug
|
||||
$page = get_page_by_path($slug);
|
||||
if (!$page) {
|
||||
return new WP_Error('not_found', 'Page not found', ['status' => 404]);
|
||||
}
|
||||
|
||||
$structure = get_post_meta($page->ID, '_wn_page_structure', true);
|
||||
|
||||
// Get SEO data (Yoast/Rank Math)
|
||||
$seo = self::get_seo_data($page->ID);
|
||||
|
||||
return new WP_REST_Response([
|
||||
'id' => $page->ID,
|
||||
'type' => 'page',
|
||||
'slug' => $page->post_name,
|
||||
'title' => $page->post_title,
|
||||
'url' => get_permalink($page),
|
||||
'seo' => $seo,
|
||||
'structure' => $structure ?: ['sections' => []],
|
||||
], 200);
|
||||
}
|
||||
|
||||
/**
|
||||
* Save page structure
|
||||
*/
|
||||
public static function save_page(WP_REST_Request $request)
|
||||
{
|
||||
$slug = $request->get_param('slug');
|
||||
$body = $request->get_json_params();
|
||||
|
||||
// Find page by slug
|
||||
$page = get_page_by_path($slug);
|
||||
if (!$page) {
|
||||
return new WP_Error('not_found', 'Page not found', ['status' => 404]);
|
||||
}
|
||||
|
||||
// Validate structure
|
||||
$structure = $body['sections'] ?? null;
|
||||
if ($structure === null) {
|
||||
return new WP_Error('invalid_data', 'Missing sections data', ['status' => 400]);
|
||||
}
|
||||
|
||||
// Save structure
|
||||
$save_data = [
|
||||
'type' => 'page',
|
||||
'sections' => $structure,
|
||||
'updated_at' => current_time('mysql'),
|
||||
];
|
||||
|
||||
update_post_meta($page->ID, '_wn_page_structure', $save_data);
|
||||
|
||||
return new WP_REST_Response([
|
||||
'success' => true,
|
||||
'page' => [
|
||||
'id' => $page->ID,
|
||||
'slug' => $page->post_name,
|
||||
],
|
||||
], 200);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get CPT template
|
||||
*/
|
||||
public static function get_template(WP_REST_Request $request)
|
||||
{
|
||||
$cpt = $request->get_param('cpt');
|
||||
|
||||
// Validate CPT exists
|
||||
if (!post_type_exists($cpt) && $cpt !== 'post') {
|
||||
return new WP_Error('invalid_cpt', 'Invalid post type', ['status' => 400]);
|
||||
}
|
||||
|
||||
$template = get_option("wn_template_{$cpt}", null);
|
||||
$cpt_obj = get_post_type_object($cpt);
|
||||
|
||||
return new WP_REST_Response([
|
||||
'type' => 'template',
|
||||
'cpt' => $cpt,
|
||||
'title' => $cpt_obj ? $cpt_obj->labels->singular_name . ' Template' : ucfirst($cpt) . ' Template',
|
||||
'permalink_base' => self::get_cpt_permalink_base($cpt),
|
||||
'available_sources' => self::get_available_sources($cpt),
|
||||
'structure' => $template ?: ['sections' => []],
|
||||
], 200);
|
||||
}
|
||||
|
||||
/**
|
||||
* Save CPT template
|
||||
*/
|
||||
public static function save_template(WP_REST_Request $request)
|
||||
{
|
||||
$cpt = $request->get_param('cpt');
|
||||
$body = $request->get_json_params();
|
||||
|
||||
// Validate CPT exists
|
||||
if (!post_type_exists($cpt) && $cpt !== 'post') {
|
||||
return new WP_Error('invalid_cpt', 'Invalid post type', ['status' => 400]);
|
||||
}
|
||||
|
||||
// Validate structure
|
||||
$structure = $body['sections'] ?? null;
|
||||
if ($structure === null) {
|
||||
return new WP_Error('invalid_data', 'Missing sections data', ['status' => 400]);
|
||||
}
|
||||
|
||||
// Save template
|
||||
$save_data = [
|
||||
'type' => 'template',
|
||||
'cpt' => $cpt,
|
||||
'sections' => $structure,
|
||||
'updated_at' => current_time('mysql'),
|
||||
];
|
||||
|
||||
update_option("wn_template_{$cpt}", $save_data);
|
||||
|
||||
return new WP_REST_Response([
|
||||
'success' => true,
|
||||
'template' => [
|
||||
'cpt' => $cpt,
|
||||
],
|
||||
], 200);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get content with template applied (for SPA rendering)
|
||||
*/
|
||||
public static function get_content_with_template(WP_REST_Request $request)
|
||||
{
|
||||
$type = $request->get_param('type');
|
||||
$slug = $request->get_param('slug');
|
||||
|
||||
// Handle structural pages
|
||||
if ($type === 'page') {
|
||||
return self::get_page($request);
|
||||
}
|
||||
|
||||
// For CPT items, get post and apply template
|
||||
$post = get_page_by_path($slug, OBJECT, $type);
|
||||
if (!$post) {
|
||||
// Try with post type 'post' if type is 'blog'
|
||||
if ($type === 'blog') {
|
||||
$post = get_page_by_path($slug, OBJECT, 'post');
|
||||
$type = 'post';
|
||||
}
|
||||
}
|
||||
|
||||
if (!$post) {
|
||||
return new WP_Error('not_found', 'Content not found', ['status' => 404]);
|
||||
}
|
||||
|
||||
// Get template for this CPT
|
||||
$template = get_option("wn_template_{$type}", null);
|
||||
|
||||
// Build post data
|
||||
$post_data = PlaceholderRenderer::build_post_data($post);
|
||||
|
||||
// Get SEO data
|
||||
$seo = self::get_seo_data($post->ID);
|
||||
|
||||
// If template exists, resolve placeholders
|
||||
$rendered_sections = [];
|
||||
if ($template && !empty($template['sections'])) {
|
||||
foreach ($template['sections'] as $section) {
|
||||
$resolved_section = $section;
|
||||
$resolved_section['props'] = PageSSR::resolve_props($section['props'] ?? [], $post_data);
|
||||
$rendered_sections[] = $resolved_section;
|
||||
}
|
||||
}
|
||||
|
||||
return new WP_REST_Response([
|
||||
'type' => 'content',
|
||||
'cpt' => $type,
|
||||
'post' => $post_data,
|
||||
'seo' => $seo,
|
||||
'template' => $template ?: ['sections' => []],
|
||||
'rendered' => [
|
||||
'sections' => $rendered_sections,
|
||||
],
|
||||
], 200);
|
||||
}
|
||||
|
||||
/**
|
||||
* Create new page
|
||||
*/
|
||||
public static function create_page(WP_REST_Request $request)
|
||||
{
|
||||
$body = $request->get_json_params();
|
||||
|
||||
$title = sanitize_text_field($body['title'] ?? '');
|
||||
$slug = sanitize_title($body['slug'] ?? $title);
|
||||
|
||||
if (empty($title)) {
|
||||
return new WP_Error('invalid_data', 'Title is required', ['status' => 400]);
|
||||
}
|
||||
|
||||
// Check if page already exists
|
||||
if (get_page_by_path($slug)) {
|
||||
return new WP_Error('exists', 'Page with this slug already exists', ['status' => 400]);
|
||||
}
|
||||
|
||||
// Create page
|
||||
$page_id = wp_insert_post([
|
||||
'post_type' => 'page',
|
||||
'post_title' => $title,
|
||||
'post_name' => $slug,
|
||||
'post_status' => 'publish',
|
||||
]);
|
||||
|
||||
if (is_wp_error($page_id)) {
|
||||
return $page_id;
|
||||
}
|
||||
|
||||
// Initialize empty structure
|
||||
$structure = [
|
||||
'type' => 'page',
|
||||
'sections' => [],
|
||||
'created_at' => current_time('mysql'),
|
||||
];
|
||||
|
||||
update_post_meta($page_id, '_wn_page_structure', $structure);
|
||||
|
||||
return new WP_REST_Response([
|
||||
'success' => true,
|
||||
'page' => [
|
||||
'id' => $page_id,
|
||||
'slug' => $slug,
|
||||
'title' => $title,
|
||||
'url' => get_permalink($page_id),
|
||||
],
|
||||
], 201);
|
||||
}
|
||||
|
||||
// ========================================
|
||||
// Helper Methods
|
||||
// ========================================
|
||||
|
||||
/**
|
||||
* Get editable post types for templates
|
||||
*/
|
||||
private static function get_editable_post_types()
|
||||
{
|
||||
$types = [
|
||||
'post' => 'Blog Post',
|
||||
];
|
||||
|
||||
// Get public custom post types
|
||||
$custom_types = get_post_types([
|
||||
'public' => true,
|
||||
'_builtin' => false,
|
||||
], 'objects');
|
||||
|
||||
foreach ($custom_types as $type) {
|
||||
// Skip WooCommerce types (handled separately)
|
||||
if (in_array($type->name, ['product', 'shop_order', 'shop_coupon'])) {
|
||||
continue;
|
||||
}
|
||||
$types[$type->name] = $type->labels->singular_name;
|
||||
}
|
||||
|
||||
return $types;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get permalink base for a CPT
|
||||
*/
|
||||
private static function get_cpt_permalink_base($cpt)
|
||||
{
|
||||
if ($cpt === 'post') {
|
||||
// Get blog permalink structure
|
||||
$struct = get_option('permalink_structure');
|
||||
if (strpos($struct, '%postname%') !== false) {
|
||||
return '/blog/';
|
||||
}
|
||||
return '/';
|
||||
}
|
||||
|
||||
$obj = get_post_type_object($cpt);
|
||||
if ($obj && isset($obj->rewrite['slug'])) {
|
||||
return '/' . $obj->rewrite['slug'] . '/';
|
||||
}
|
||||
|
||||
return '/' . $cpt . '/';
|
||||
}
|
||||
|
||||
/**
|
||||
* Get available dynamic sources for a CPT
|
||||
*/
|
||||
private static function get_available_sources($cpt)
|
||||
{
|
||||
$sources = [
|
||||
['value' => 'post_title', 'label' => 'Title'],
|
||||
['value' => 'post_content', 'label' => 'Content'],
|
||||
['value' => 'post_excerpt', 'label' => 'Excerpt'],
|
||||
['value' => 'post_featured_image', 'label' => 'Featured Image'],
|
||||
['value' => 'post_author', 'label' => 'Author'],
|
||||
['value' => 'post_date', 'label' => 'Date'],
|
||||
['value' => 'post_url', 'label' => 'Permalink'],
|
||||
];
|
||||
|
||||
// Add taxonomy sources
|
||||
$taxonomies = get_object_taxonomies($cpt, 'objects');
|
||||
foreach ($taxonomies as $tax) {
|
||||
if ($tax->public) {
|
||||
$sources[] = [
|
||||
'value' => $tax->name,
|
||||
'label' => $tax->labels->name,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
// Add related posts source
|
||||
$sources[] = ['value' => 'related_posts', 'label' => 'Related Posts'];
|
||||
|
||||
return $sources;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get SEO data for a post (Yoast/Rank Math compatible)
|
||||
*/
|
||||
private static function get_seo_data($post_id)
|
||||
{
|
||||
$seo = [];
|
||||
|
||||
// Try Yoast
|
||||
$seo['meta_title'] = get_post_meta($post_id, '_yoast_wpseo_title', true) ?: get_the_title($post_id);
|
||||
$seo['meta_description'] = get_post_meta($post_id, '_yoast_wpseo_metadesc', true);
|
||||
$seo['canonical'] = get_post_meta($post_id, '_yoast_wpseo_canonical', true) ?: get_permalink($post_id);
|
||||
$seo['og_title'] = get_post_meta($post_id, '_yoast_wpseo_opengraph-title', true);
|
||||
$seo['og_description'] = get_post_meta($post_id, '_yoast_wpseo_opengraph-description', true);
|
||||
$seo['og_image'] = get_post_meta($post_id, '_yoast_wpseo_opengraph-image', true);
|
||||
|
||||
// Try Rank Math if Yoast not available
|
||||
if (empty($seo['meta_description'])) {
|
||||
$seo['meta_description'] = get_post_meta($post_id, 'rank_math_description', true);
|
||||
}
|
||||
|
||||
return $seo;
|
||||
}
|
||||
}
|
||||
@@ -35,6 +35,7 @@ use WooNooW\Frontend\HookBridge;
|
||||
use WooNooW\Api\Controllers\SettingsController;
|
||||
use WooNooW\Api\Controllers\CartController as ApiCartController;
|
||||
use WooNooW\Admin\AppearanceController;
|
||||
use WooNooW\Api\PagesController;
|
||||
|
||||
class Routes {
|
||||
public static function init() {
|
||||
@@ -181,6 +182,9 @@ class Routes {
|
||||
AddressController::register_routes();
|
||||
WishlistController::register_routes();
|
||||
HookBridge::register_routes();
|
||||
|
||||
// Pages and templates controller
|
||||
PagesController::register_routes();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
290
includes/Frontend/PageSSR.php
Normal file
290
includes/Frontend/PageSSR.php
Normal file
@@ -0,0 +1,290 @@
|
||||
<?php
|
||||
namespace WooNooW\Frontend;
|
||||
|
||||
/**
|
||||
* Page SSR (Server-Side Rendering)
|
||||
* Renders page sections as static HTML for search engine crawlers
|
||||
*/
|
||||
class PageSSR
|
||||
{
|
||||
/**
|
||||
* Render page structure to HTML
|
||||
*
|
||||
* @param array $structure Page structure with sections
|
||||
* @param array|null $post_data Post data for dynamic placeholders
|
||||
* @return string Rendered HTML
|
||||
*/
|
||||
public static function render($structure, $post_data = null)
|
||||
{
|
||||
if (empty($structure) || empty($structure['sections'])) {
|
||||
return '';
|
||||
}
|
||||
|
||||
$html = '';
|
||||
|
||||
foreach ($structure['sections'] as $section) {
|
||||
$html .= self::render_section($section, $post_data);
|
||||
}
|
||||
|
||||
return $html;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render a single section to HTML
|
||||
*
|
||||
* @param array $section Section data
|
||||
* @param array|null $post_data Post data for placeholders
|
||||
* @return string Section HTML
|
||||
*/
|
||||
public static function render_section($section, $post_data = null)
|
||||
{
|
||||
$type = $section['type'] ?? 'content';
|
||||
$props = $section['props'] ?? [];
|
||||
$layout = $section['layoutVariant'] ?? 'default';
|
||||
$color_scheme = $section['colorScheme'] ?? 'default';
|
||||
|
||||
// Resolve all props (replace dynamic placeholders with actual values)
|
||||
$resolved_props = self::resolve_props($props, $post_data);
|
||||
|
||||
// Generate section ID for anchor links
|
||||
$section_id = $section['id'] ?? 'section-' . uniqid();
|
||||
|
||||
// Render based on section type
|
||||
$method = 'render_' . str_replace('-', '_', $type);
|
||||
if (method_exists(__CLASS__, $method)) {
|
||||
return self::$method($resolved_props, $layout, $color_scheme, $section_id);
|
||||
}
|
||||
|
||||
// Fallback: generic section wrapper
|
||||
return self::render_generic($resolved_props, $type, $section_id);
|
||||
}
|
||||
|
||||
/**
|
||||
* Resolve props - replace dynamic placeholders with actual values
|
||||
*
|
||||
* @param array $props Section props
|
||||
* @param array|null $post_data Post data
|
||||
* @return array Resolved props with actual values
|
||||
*/
|
||||
public static function resolve_props($props, $post_data = null)
|
||||
{
|
||||
$resolved = [];
|
||||
|
||||
foreach ($props as $key => $prop) {
|
||||
if (!is_array($prop)) {
|
||||
$resolved[$key] = $prop;
|
||||
continue;
|
||||
}
|
||||
|
||||
$type = $prop['type'] ?? 'static';
|
||||
|
||||
if ($type === 'static') {
|
||||
$resolved[$key] = $prop['value'] ?? '';
|
||||
} elseif ($type === 'dynamic' && $post_data) {
|
||||
$source = $prop['source'] ?? '';
|
||||
$resolved[$key] = PlaceholderRenderer::get_value($source, $post_data);
|
||||
} else {
|
||||
$resolved[$key] = $prop['value'] ?? '';
|
||||
}
|
||||
}
|
||||
|
||||
return $resolved;
|
||||
}
|
||||
|
||||
// ========================================
|
||||
// Section Renderers
|
||||
// ========================================
|
||||
|
||||
/**
|
||||
* Render Hero section
|
||||
*/
|
||||
public static function render_hero($props, $layout, $color_scheme, $id)
|
||||
{
|
||||
$title = esc_html($props['title'] ?? '');
|
||||
$subtitle = esc_html($props['subtitle'] ?? '');
|
||||
$image = esc_url($props['image'] ?? '');
|
||||
$cta_text = esc_html($props['cta_text'] ?? '');
|
||||
$cta_url = esc_url($props['cta_url'] ?? '');
|
||||
|
||||
$html = "<section id=\"{$id}\" class=\"wn-section wn-hero wn-hero--{$layout} wn-scheme--{$color_scheme}\">";
|
||||
|
||||
if ($image) {
|
||||
$html .= "<img src=\"{$image}\" alt=\"{$title}\" class=\"wn-hero__image\" />";
|
||||
}
|
||||
|
||||
$html .= '<div class="wn-hero__content">';
|
||||
if ($title) {
|
||||
$html .= "<h1 class=\"wn-hero__title\">{$title}</h1>";
|
||||
}
|
||||
if ($subtitle) {
|
||||
$html .= "<p class=\"wn-hero__subtitle\">{$subtitle}</p>";
|
||||
}
|
||||
if ($cta_text && $cta_url) {
|
||||
$html .= "<a href=\"{$cta_url}\" class=\"wn-hero__cta\">{$cta_text}</a>";
|
||||
}
|
||||
$html .= '</div>';
|
||||
$html .= '</section>';
|
||||
|
||||
return $html;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render Content section (for post body, rich text)
|
||||
*/
|
||||
public static function render_content($props, $layout, $color_scheme, $id)
|
||||
{
|
||||
$content = $props['content'] ?? '';
|
||||
// Apply WordPress content filters (shortcodes, autop, etc.)
|
||||
$content = apply_filters('the_content', $content);
|
||||
|
||||
return "<section id=\"{$id}\" class=\"wn-section wn-content wn-scheme--{$color_scheme}\">{$content}</section>";
|
||||
}
|
||||
|
||||
/**
|
||||
* Render Image + Text section
|
||||
*/
|
||||
public static function render_image_text($props, $layout, $color_scheme, $id)
|
||||
{
|
||||
$title = esc_html($props['title'] ?? '');
|
||||
$text = wp_kses_post($props['text'] ?? '');
|
||||
$image = esc_url($props['image'] ?? '');
|
||||
|
||||
$html = "<section id=\"{$id}\" class=\"wn-section wn-image-text wn-image-text--{$layout} wn-scheme--{$color_scheme}\">";
|
||||
|
||||
if ($image) {
|
||||
$html .= "<div class=\"wn-image-text__image\"><img src=\"{$image}\" alt=\"{$title}\" /></div>";
|
||||
}
|
||||
|
||||
$html .= '<div class="wn-image-text__content">';
|
||||
if ($title) {
|
||||
$html .= "<h2 class=\"wn-image-text__title\">{$title}</h2>";
|
||||
}
|
||||
if ($text) {
|
||||
$html .= "<div class=\"wn-image-text__text\">{$text}</div>";
|
||||
}
|
||||
$html .= '</div>';
|
||||
$html .= '</section>';
|
||||
|
||||
return $html;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render Feature Grid section
|
||||
*/
|
||||
public static function render_feature_grid($props, $layout, $color_scheme, $id)
|
||||
{
|
||||
$heading = esc_html($props['heading'] ?? '');
|
||||
$items = $props['items'] ?? [];
|
||||
|
||||
$html = "<section id=\"{$id}\" class=\"wn-section wn-feature-grid wn-feature-grid--{$layout} wn-scheme--{$color_scheme}\">";
|
||||
|
||||
if ($heading) {
|
||||
$html .= "<h2 class=\"wn-feature-grid__heading\">{$heading}</h2>";
|
||||
}
|
||||
|
||||
$html .= '<div class="wn-feature-grid__items">';
|
||||
foreach ($items as $item) {
|
||||
$item_title = esc_html($item['title'] ?? '');
|
||||
$item_desc = esc_html($item['description'] ?? '');
|
||||
$item_icon = esc_html($item['icon'] ?? '');
|
||||
|
||||
$html .= '<div class="wn-feature-grid__item">';
|
||||
if ($item_icon) {
|
||||
$html .= "<span class=\"wn-feature-grid__icon\">{$item_icon}</span>";
|
||||
}
|
||||
if ($item_title) {
|
||||
$html .= "<h3 class=\"wn-feature-grid__item-title\">{$item_title}</h3>";
|
||||
}
|
||||
if ($item_desc) {
|
||||
$html .= "<p class=\"wn-feature-grid__item-desc\">{$item_desc}</p>";
|
||||
}
|
||||
$html .= '</div>';
|
||||
}
|
||||
$html .= '</div>';
|
||||
$html .= '</section>';
|
||||
|
||||
return $html;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render CTA Banner section
|
||||
*/
|
||||
public static function render_cta_banner($props, $layout, $color_scheme, $id)
|
||||
{
|
||||
$title = esc_html($props['title'] ?? '');
|
||||
$text = esc_html($props['text'] ?? '');
|
||||
$button_text = esc_html($props['button_text'] ?? '');
|
||||
$button_url = esc_url($props['button_url'] ?? '');
|
||||
|
||||
$html = "<section id=\"{$id}\" class=\"wn-section wn-cta-banner wn-cta-banner--{$layout} wn-scheme--{$color_scheme}\">";
|
||||
$html .= '<div class="wn-cta-banner__content">';
|
||||
|
||||
if ($title) {
|
||||
$html .= "<h2 class=\"wn-cta-banner__title\">{$title}</h2>";
|
||||
}
|
||||
if ($text) {
|
||||
$html .= "<p class=\"wn-cta-banner__text\">{$text}</p>";
|
||||
}
|
||||
if ($button_text && $button_url) {
|
||||
$html .= "<a href=\"{$button_url}\" class=\"wn-cta-banner__button\">{$button_text}</a>";
|
||||
}
|
||||
|
||||
$html .= '</div>';
|
||||
$html .= '</section>';
|
||||
|
||||
return $html;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render Contact Form section
|
||||
*/
|
||||
public static function render_contact_form($props, $layout, $color_scheme, $id)
|
||||
{
|
||||
$title = esc_html($props['title'] ?? '');
|
||||
$webhook_url = esc_url($props['webhook_url'] ?? '');
|
||||
$redirect_url = esc_url($props['redirect_url'] ?? '');
|
||||
$fields = $props['fields'] ?? ['name', 'email', 'message'];
|
||||
|
||||
$html = "<section id=\"{$id}\" class=\"wn-section wn-contact-form wn-scheme--{$color_scheme}\">";
|
||||
|
||||
if ($title) {
|
||||
$html .= "<h2 class=\"wn-contact-form__title\">{$title}</h2>";
|
||||
}
|
||||
|
||||
// Form is rendered but won't work for bots (they just see the structure)
|
||||
$html .= '<form class="wn-contact-form__form" method="post">';
|
||||
|
||||
foreach ($fields as $field) {
|
||||
$field_label = ucfirst(str_replace('_', ' ', $field));
|
||||
$html .= '<div class="wn-contact-form__field">';
|
||||
$html .= "<label>{$field_label}</label>";
|
||||
if ($field === 'message') {
|
||||
$html .= "<textarea name=\"{$field}\" placeholder=\"{$field_label}\"></textarea>";
|
||||
} else {
|
||||
$html .= "<input type=\"text\" name=\"{$field}\" placeholder=\"{$field_label}\" />";
|
||||
}
|
||||
$html .= '</div>';
|
||||
}
|
||||
|
||||
$html .= '<button type="submit">Submit</button>';
|
||||
$html .= '</form>';
|
||||
$html .= '</section>';
|
||||
|
||||
return $html;
|
||||
}
|
||||
|
||||
/**
|
||||
* Generic section fallback
|
||||
*/
|
||||
public static function render_generic($props, $type, $id)
|
||||
{
|
||||
$content = '';
|
||||
foreach ($props as $key => $value) {
|
||||
if (is_string($value)) {
|
||||
$content .= "<div class=\"wn-{$type}__{$key}\">" . wp_kses_post($value) . "</div>";
|
||||
}
|
||||
}
|
||||
|
||||
return "<section id=\"{$id}\" class=\"wn-section wn-{$type}\">{$content}</section>";
|
||||
}
|
||||
}
|
||||
213
includes/Frontend/PlaceholderRenderer.php
Normal file
213
includes/Frontend/PlaceholderRenderer.php
Normal file
@@ -0,0 +1,213 @@
|
||||
<?php
|
||||
namespace WooNooW\Frontend;
|
||||
|
||||
/**
|
||||
* Placeholder Renderer
|
||||
* Resolves dynamic placeholders to actual post/CPT data
|
||||
*/
|
||||
class PlaceholderRenderer
|
||||
{
|
||||
/**
|
||||
* Get value for a dynamic placeholder source
|
||||
*
|
||||
* @param string $source Placeholder source (e.g., 'post_title', 'post_content')
|
||||
* @param array $post_data Post data array
|
||||
* @return mixed Resolved value
|
||||
*/
|
||||
public static function get_value($source, $post_data)
|
||||
{
|
||||
if (empty($source) || empty($post_data)) {
|
||||
return '';
|
||||
}
|
||||
|
||||
// Standard post fields
|
||||
switch ($source) {
|
||||
case 'post_title':
|
||||
case 'title':
|
||||
return $post_data['title'] ?? $post_data['post_title'] ?? '';
|
||||
|
||||
case 'post_content':
|
||||
case 'content':
|
||||
return $post_data['content'] ?? $post_data['post_content'] ?? '';
|
||||
|
||||
case 'post_excerpt':
|
||||
case 'excerpt':
|
||||
return $post_data['excerpt'] ?? $post_data['post_excerpt'] ?? '';
|
||||
|
||||
case 'post_featured_image':
|
||||
case 'featured_image':
|
||||
return $post_data['featured_image'] ??
|
||||
$post_data['thumbnail'] ??
|
||||
$post_data['_thumbnail_url'] ?? '';
|
||||
|
||||
case 'post_author':
|
||||
case 'author':
|
||||
return $post_data['author'] ?? $post_data['post_author'] ?? '';
|
||||
|
||||
case 'post_date':
|
||||
case 'date':
|
||||
return $post_data['date'] ?? $post_data['post_date'] ?? '';
|
||||
|
||||
case 'post_categories':
|
||||
case 'categories':
|
||||
return $post_data['categories'] ?? [];
|
||||
|
||||
case 'post_tags':
|
||||
case 'tags':
|
||||
return $post_data['tags'] ?? [];
|
||||
|
||||
case 'post_url':
|
||||
case 'url':
|
||||
case 'permalink':
|
||||
return $post_data['url'] ?? $post_data['permalink'] ?? '';
|
||||
}
|
||||
|
||||
// Check for custom meta fields (format: {cpt}_field_{name})
|
||||
if (strpos($source, '_field_') !== false) {
|
||||
$parts = explode('_field_', $source);
|
||||
$field_name = end($parts);
|
||||
|
||||
// Try to get from meta array
|
||||
if (isset($post_data['meta'][$field_name])) {
|
||||
return $post_data['meta'][$field_name];
|
||||
}
|
||||
|
||||
// Try direct field access
|
||||
if (isset($post_data[$field_name])) {
|
||||
return $post_data[$field_name];
|
||||
}
|
||||
}
|
||||
|
||||
// Check for direct key match
|
||||
if (isset($post_data[$source])) {
|
||||
return $post_data[$source];
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
|
||||
/**
|
||||
* Build post data array from WP_Post object
|
||||
*
|
||||
* @param \WP_Post|int $post Post object or ID
|
||||
* @return array Post data array
|
||||
*/
|
||||
public static function build_post_data($post)
|
||||
{
|
||||
if (is_numeric($post)) {
|
||||
$post = get_post($post);
|
||||
}
|
||||
|
||||
if (!$post || !($post instanceof \WP_Post)) {
|
||||
return [];
|
||||
}
|
||||
|
||||
$data = [
|
||||
'id' => $post->ID,
|
||||
'title' => $post->post_title,
|
||||
'content' => apply_filters('the_content', $post->post_content),
|
||||
'excerpt' => $post->post_excerpt ?: wp_trim_words($post->post_content, 30),
|
||||
'date' => get_the_date('', $post),
|
||||
'date_iso' => get_the_date('c', $post),
|
||||
'url' => get_permalink($post),
|
||||
'slug' => $post->post_name,
|
||||
'type' => $post->post_type,
|
||||
];
|
||||
|
||||
// Author
|
||||
$author_id = $post->post_author;
|
||||
$data['author'] = get_the_author_meta('display_name', $author_id);
|
||||
$data['author_url'] = get_author_posts_url($author_id);
|
||||
|
||||
// Featured image
|
||||
$thumbnail_id = get_post_thumbnail_id($post);
|
||||
if ($thumbnail_id) {
|
||||
$data['featured_image'] = get_the_post_thumbnail_url($post, 'large');
|
||||
$data['featured_image_id'] = $thumbnail_id;
|
||||
}
|
||||
|
||||
// Taxonomies
|
||||
$taxonomies = get_object_taxonomies($post->post_type);
|
||||
foreach ($taxonomies as $taxonomy) {
|
||||
$terms = get_the_terms($post, $taxonomy);
|
||||
if ($terms && !is_wp_error($terms)) {
|
||||
$data[$taxonomy] = array_map(function($term) {
|
||||
return [
|
||||
'id' => $term->term_id,
|
||||
'name' => $term->name,
|
||||
'slug' => $term->slug,
|
||||
'url' => get_term_link($term),
|
||||
];
|
||||
}, $terms);
|
||||
}
|
||||
}
|
||||
|
||||
// Shortcuts for common taxonomies
|
||||
if (isset($data['category'])) {
|
||||
$data['categories'] = $data['category'];
|
||||
}
|
||||
if (isset($data['post_tag'])) {
|
||||
$data['tags'] = $data['post_tag'];
|
||||
}
|
||||
|
||||
// Custom meta fields
|
||||
$meta = get_post_meta($post->ID);
|
||||
if ($meta) {
|
||||
$data['meta'] = [];
|
||||
foreach ($meta as $key => $values) {
|
||||
// Skip internal meta keys
|
||||
if (strpos($key, '_') === 0) {
|
||||
continue;
|
||||
}
|
||||
$data['meta'][$key] = count($values) === 1 ? $values[0] : $values;
|
||||
}
|
||||
}
|
||||
|
||||
return $data;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get related posts
|
||||
*
|
||||
* @param int $post_id Current post ID
|
||||
* @param int $count Number of related posts
|
||||
* @param string $post_type Post type
|
||||
* @return array Related posts data
|
||||
*/
|
||||
public static function get_related_posts($post_id, $count = 3, $post_type = 'post')
|
||||
{
|
||||
// Get categories of current post
|
||||
$categories = get_the_category($post_id);
|
||||
$category_ids = wp_list_pluck($categories, 'term_id');
|
||||
|
||||
$args = [
|
||||
'post_type' => $post_type,
|
||||
'posts_per_page' => $count,
|
||||
'post__not_in' => [$post_id],
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC',
|
||||
];
|
||||
|
||||
if (!empty($category_ids)) {
|
||||
$args['category__in'] = $category_ids;
|
||||
}
|
||||
|
||||
$query = new \WP_Query($args);
|
||||
$related = [];
|
||||
|
||||
foreach ($query->posts as $post) {
|
||||
$related[] = [
|
||||
'id' => $post->ID,
|
||||
'title' => $post->post_title,
|
||||
'excerpt' => $post->post_excerpt ?: wp_trim_words($post->post_content, 20),
|
||||
'url' => get_permalink($post),
|
||||
'featured_image' => get_the_post_thumbnail_url($post, 'medium'),
|
||||
'date' => get_the_date('', $post),
|
||||
];
|
||||
}
|
||||
|
||||
wp_reset_postdata();
|
||||
|
||||
return $related;
|
||||
}
|
||||
}
|
||||
@@ -648,4 +648,100 @@ class TemplateOverride
|
||||
|
||||
return $template;
|
||||
}
|
||||
|
||||
/**
|
||||
* Detect if current request is from a bot/crawler
|
||||
* Used to serve SSR content for SEO instead of SPA redirect
|
||||
*
|
||||
* @return bool True if request is from a known bot
|
||||
*/
|
||||
public static function is_bot()
|
||||
{
|
||||
// Get User-Agent
|
||||
$user_agent = $_SERVER['HTTP_USER_AGENT'] ?? '';
|
||||
if (empty($user_agent)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// Convert to lowercase for case-insensitive matching
|
||||
$user_agent = strtolower($user_agent);
|
||||
|
||||
// Known bot patterns
|
||||
$bot_patterns = [
|
||||
// Search engine crawlers
|
||||
'googlebot',
|
||||
'bingbot',
|
||||
'slurp', // Yahoo
|
||||
'duckduckbot',
|
||||
'baiduspider',
|
||||
'yandexbot',
|
||||
'sogou',
|
||||
'exabot',
|
||||
|
||||
// Generic patterns
|
||||
'crawler',
|
||||
'spider',
|
||||
'robot',
|
||||
'scraper',
|
||||
|
||||
// Social media bots (for link previews)
|
||||
'facebookexternalhit',
|
||||
'twitterbot',
|
||||
'linkedinbot',
|
||||
'whatsapp',
|
||||
'slackbot',
|
||||
'telegrambot',
|
||||
'discordbot',
|
||||
|
||||
// Other known bots
|
||||
'applebot',
|
||||
'semrushbot',
|
||||
'ahrefsbot',
|
||||
'mj12bot',
|
||||
'dotbot',
|
||||
'petalbot',
|
||||
'bytespider',
|
||||
|
||||
// Prerender services
|
||||
'prerender',
|
||||
'headlesschrome',
|
||||
];
|
||||
|
||||
// Check if User-Agent contains any bot pattern
|
||||
foreach ($bot_patterns as $pattern) {
|
||||
if (strpos($user_agent, $pattern) !== false) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Serve SSR content for bots
|
||||
* Renders page structure as static HTML for search engine indexing
|
||||
*
|
||||
* @param int $page_id Page ID to render
|
||||
* @param string $type 'page' or 'template'
|
||||
* @param array|null $post_data Post data for template rendering (CPT items)
|
||||
*/
|
||||
public static function serve_ssr_content($page_id, $type = 'page', $post_data = null)
|
||||
{
|
||||
// Get page structure
|
||||
if ($type === 'page') {
|
||||
$structure = get_post_meta($page_id, '_wn_page_structure', true);
|
||||
} else {
|
||||
// CPT template
|
||||
$structure = get_option("wn_template_{$type}", null);
|
||||
}
|
||||
|
||||
if (empty($structure) || empty($structure['sections'])) {
|
||||
return false; // No structure, let normal WP handle it
|
||||
}
|
||||
|
||||
// Will be implemented in PageSSR class
|
||||
// For now, return false to let normal WP handle
|
||||
// TODO: Implement PageSSR::render($structure, $post_data)
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
781
woonoow-page-editor-brief.md
Normal file
781
woonoow-page-editor-brief.md
Normal file
@@ -0,0 +1,781 @@
|
||||
# WooNooW Page Editor Strategy - Final Decision Brief (v3)
|
||||
|
||||
## Overview
|
||||
Extend WooNooW SPA to support structural pages and CPT templates with:
|
||||
- **Unified Page Editor** for pages (page CPT) and CPT templates (post, portfolio, custom)
|
||||
- **Native WordPress `page` CPT** for structural pages (SEO compatible)
|
||||
- **Dynamic placeholders** for CPT templates (blog posts, portfolio items, etc.)
|
||||
- **Dual rendering strategy** for bots vs humans (SSR + SPA redirect)
|
||||
- **Zero page builder plugin dependencies**
|
||||
- **Integrated admin UI** with collapsible sidebar
|
||||
|
||||
---
|
||||
|
||||
## Core Architecture
|
||||
|
||||
### Data Storage
|
||||
|
||||
#### Structural Pages (page CPT)
|
||||
- **Location**: WordPress `wp_posts` table (post_type='page')
|
||||
- **Structure Storage**: `wp_postmeta`, key: `_wn_page_structure`
|
||||
- **Type**: Static content only (no placeholders)
|
||||
- **Example**: Homepage, About, Contact, Terms, Privacy
|
||||
|
||||
#### CPT Templates
|
||||
- **Location**: WordPress `wp_options` table
|
||||
- **Storage Keys**: `wn_template_{cpt_name}`
|
||||
- `wn_template_post` (for blog posts)
|
||||
- `wn_template_portfolio` (for portfolio items)
|
||||
- `wn_template_custom_cpt` (for custom CPTs)
|
||||
- **Type**: Dynamic content with placeholders
|
||||
- **Applies To**: All items of that CPT (one template per CPT)
|
||||
|
||||
### Page Structure Storage Format
|
||||
|
||||
```json
|
||||
{
|
||||
"type": "page|template",
|
||||
"sections": [
|
||||
{
|
||||
"id": "section-1",
|
||||
"type": "hero",
|
||||
"layoutVariant": "hero-left-image",
|
||||
"colorScheme": "primary",
|
||||
"props": {
|
||||
"title": {
|
||||
"type": "static",
|
||||
"value": "Welcome"
|
||||
},
|
||||
"subtitle": {
|
||||
"type": "static",
|
||||
"value": "Join us"
|
||||
},
|
||||
"image": {
|
||||
"type": "static",
|
||||
"value": "/uploads/hero.jpg"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "section-2",
|
||||
"type": "content",
|
||||
"props": {
|
||||
"content": {
|
||||
"type": "dynamic",
|
||||
"source": "post_content"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "section-3",
|
||||
"type": "feature-grid",
|
||||
"layoutVariant": "grid-3-columns",
|
||||
"props": {
|
||||
"heading": {
|
||||
"type": "static",
|
||||
"value": "Why Choose Us"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
### Field Types: Static vs Dynamic
|
||||
|
||||
**Static Fields** (Structural Pages):
|
||||
```json
|
||||
{
|
||||
"type": "static",
|
||||
"value": "Hardcoded text or value"
|
||||
}
|
||||
```
|
||||
|
||||
**Dynamic Fields** (CPT Templates):
|
||||
```json
|
||||
{
|
||||
"type": "dynamic",
|
||||
"source": "post_title|post_content|post_excerpt|post_featured_image|related_posts|..."
|
||||
}
|
||||
```
|
||||
|
||||
#### Available Dynamic Sources (per CPT)
|
||||
|
||||
**For `post` CPT:**
|
||||
- `post_title` - Post title
|
||||
- `post_excerpt` - Post excerpt
|
||||
- `post_content` - Post body content
|
||||
- `post_featured_image` - Featured image URL
|
||||
- `post_author` - Author name
|
||||
- `post_date` - Publication date
|
||||
- `post_categories` - Category list
|
||||
- `post_tags` - Tag list
|
||||
- `related_posts` - Query for related posts (with count parameter)
|
||||
|
||||
**For Custom CPTs:**
|
||||
- `{cpt_name}_title` - CPT item title
|
||||
- `{cpt_name}_featured_image` - Featured image
|
||||
- `{cpt_name}_field_{field_name}` - Custom meta fields
|
||||
- Custom sources defined per CPT
|
||||
|
||||
---
|
||||
|
||||
## Unified Page Editor Concept
|
||||
|
||||
### Single Editor, Two Modes
|
||||
|
||||
**Mode 1: Structural Pages (Static)**
|
||||
- Edit individual pages (page CPT)
|
||||
- All content is static/hardcoded
|
||||
- Examples: Home, About, Contact, Terms, Privacy
|
||||
- SEO managed by Yoast/Rank Math
|
||||
|
||||
**Mode 2: CPT Templates (Dynamic)**
|
||||
- Design template for entire CPT
|
||||
- Content has dynamic placeholders
|
||||
- One template applies to all items of that CPT
|
||||
- Examples: Blog Post template, Portfolio template, News template
|
||||
|
||||
### Create New Page Flow
|
||||
|
||||
When user clicks `[+ Create Page]`:
|
||||
|
||||
```
|
||||
Modal Dialog:
|
||||
┌──────────────────────────────────┐
|
||||
│ Create New Page │
|
||||
├──────────────────────────────────┤
|
||||
│ │
|
||||
│ What are you creating? │
|
||||
│ │
|
||||
│ ○ Structural Page │
|
||||
│ Static content (page CPT) │
|
||||
│ Examples: About, Contact │
|
||||
│ Permalink: /page-slug │
|
||||
│ │
|
||||
│ ○ Blog Post Template │
|
||||
│ Dynamic template for posts │
|
||||
│ Applies to: /blog/* │
|
||||
│ Includes placeholders │
|
||||
│ │
|
||||
│ ○ Portfolio Template │
|
||||
│ Dynamic template for portfolio │
|
||||
│ Applies to: /portfolio/* │
|
||||
│ Includes placeholders │
|
||||
│ │
|
||||
│ ○ Other CPT Template │
|
||||
│ [Select CPT ▼] │
|
||||
│ Applies to: /cpt-base/* │
|
||||
│ │
|
||||
│ [Cancel] [Next] │
|
||||
└──────────────────────────────────┘
|
||||
```
|
||||
|
||||
### Editor Left Panel: Pages List (Unified)
|
||||
|
||||
```
|
||||
Pages Sidebar
|
||||
|
||||
📄 STRUCTURAL PAGES
|
||||
├─ ✓ Homepage (page)
|
||||
├─ ○ About (page)
|
||||
├─ ○ Contact (page)
|
||||
└─ ○ Terms (page)
|
||||
|
||||
📋 TEMPLATES (Dynamic)
|
||||
├─ ○ Blog Post (post)
|
||||
│ └─ Applies to: /blog/*
|
||||
├─ ○ Portfolio (portfolio)
|
||||
│ └─ Applies to: /portfolio/*
|
||||
├─ ○ News (custom_cpt)
|
||||
│ └─ Applies to: /news/*
|
||||
└─ ○ Custom CPT (custom_name)
|
||||
└─ Applies to: /custom-base/*
|
||||
|
||||
Visual indicators:
|
||||
- 📄 = Structural page (static)
|
||||
- 📋 = Template (dynamic)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Rendering Strategy: Dual Path
|
||||
|
||||
### Path 1: Bot Detection → Server-Side Rendering (SSR)
|
||||
|
||||
**When**: Bot user agent detected
|
||||
**Action**: Serve pre-rendered HTML (no redirect)
|
||||
**Content**: All sections rendered as static HTML strings
|
||||
**Placeholders**: Replaced with actual post data at render time
|
||||
**Result**: ✅ Full content indexed by search engines
|
||||
|
||||
```
|
||||
Bot visits /blog/my-article
|
||||
↓
|
||||
is_bot() === true
|
||||
↓
|
||||
Get post data + load post template
|
||||
↓
|
||||
Replace placeholders (post_title, post_content, etc.)
|
||||
↓
|
||||
Render sections to static HTML
|
||||
↓
|
||||
Output: <html><h1>Article Title</h1><p>Post content...</p></html>
|
||||
↓
|
||||
✓ Bot crawls full content
|
||||
✓ All text indexed
|
||||
✓ All links followable
|
||||
✓ SEO perfect
|
||||
```
|
||||
|
||||
### Path 2: Human Detection → SPA Redirect
|
||||
|
||||
**When**: Human user agent detected
|
||||
**Action**: HTTP 302 redirect to SPA single-page app
|
||||
**Destination**: Matches WordPress permalink structure
|
||||
- `/about` → `/store/about`
|
||||
- `/blog/slug` → `/store/blog/slug`
|
||||
- `/portfolio/slug` → `/store/portfolio/slug`
|
||||
**Result**: ✅ Beautiful interactive React UI
|
||||
|
||||
```
|
||||
Human visits /blog/my-article
|
||||
↓
|
||||
is_bot() === false
|
||||
↓
|
||||
HTTP 302 → /store/blog/my-article
|
||||
↓
|
||||
SPA loads at /store/blog/my-article
|
||||
↓
|
||||
React detects path base (/blog) → loads post template
|
||||
↓
|
||||
React fetches post data for "my-article"
|
||||
↓
|
||||
React replaces placeholders with post data
|
||||
↓
|
||||
Renders sections with React components
|
||||
↓
|
||||
✓ Interactive UI
|
||||
✓ No page reload
|
||||
✓ Great UX
|
||||
```
|
||||
|
||||
### Bot Detection Logic
|
||||
|
||||
Detect bots by User-Agent string:
|
||||
```php
|
||||
$bot_patterns = [
|
||||
'googlebot', 'bingbot', 'slurp', 'duckduckbot',
|
||||
'baiduspider', 'yandexbot', 'crawler', 'robot',
|
||||
'spider', 'facebookexternalhit', 'twitterbot',
|
||||
'linkedinbot', 'whatsapp', 'slackbot', 'applebot'
|
||||
];
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## SPA Architecture (Enhanced)
|
||||
|
||||
### SPA Remains Centralized
|
||||
- **Single page location**: WordPress page (configurable, e.g., `/store/`)
|
||||
- **Single React router**: Handles all SPA routes
|
||||
- **Routes**:
|
||||
- `/` - Homepage (products)
|
||||
- `/shop` - Shop listing
|
||||
- `/product/:slug` - Product detail
|
||||
- `/cart` - Shopping cart
|
||||
- `/checkout` - Checkout
|
||||
- `/my-account/*` - User account
|
||||
- **NEW Dynamic Routes**:
|
||||
- `/:slug` - Structural page (About, Contact, etc.)
|
||||
- `/:pathBase/:slug` - CPT item (blog post, portfolio, etc.)
|
||||
|
||||
### Dynamic Route Matching
|
||||
|
||||
```tsx
|
||||
// React Router detects what to render
|
||||
const router = createBrowserRouter([
|
||||
// Existing routes (higher priority)
|
||||
{ path: '/', element: <Shop /> },
|
||||
{ path: '/shop', element: <Shop /> },
|
||||
{ path: '/product/:slug', element: <Product /> },
|
||||
|
||||
// NEW: Dynamic routes (lower priority)
|
||||
{ path: '/:pathBase/:slug', element: <DynamicPageRenderer /> },
|
||||
{ path: '/:slug', element: <DynamicPageRenderer /> },
|
||||
]);
|
||||
|
||||
// DynamicPageRenderer logic
|
||||
function DynamicPageRenderer() {
|
||||
const { pathBase, slug } = useParams();
|
||||
const [pageData, setPageData] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
// Determine what template to use
|
||||
if (!pathBase) {
|
||||
// /:slug → Structural page (About, Contact, etc.)
|
||||
fetchPage(slug);
|
||||
} else {
|
||||
// /:pathBase/:slug → CPT item
|
||||
detectCPTFromPath(pathBase); // /blog → post, /portfolio → portfolio
|
||||
fetchCPTTemplate(cptType);
|
||||
fetchPostData(slug);
|
||||
}
|
||||
}, [pathBase, slug]);
|
||||
|
||||
return <PageRenderer pageData={pageData} />;
|
||||
}
|
||||
```
|
||||
|
||||
### No Multiple "SPA Islands"
|
||||
- Pages route through same SPA instance
|
||||
- Same styling, same theme variables, same JavaScript context
|
||||
|
||||
---
|
||||
|
||||
## Page Editor UI Layout (3-Column Design)
|
||||
|
||||
### Visual Layout
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────┐
|
||||
│ [☰] WooNooW Appearance > Pages > [Blog Post Template] │
|
||||
├─────────────────────────────────────────────────────────────┤
|
||||
│ │
|
||||
│ ┌────────────┬──────────────────┬──────────────────────┐ │
|
||||
│ │ Pages │ │ │ │
|
||||
│ │ Sidebar │ Editor Panel │ Settings + Preview │ │
|
||||
│ │ │ │ │ │
|
||||
│ │ 📄 Home │ SECTIONS │ Page Settings │ │
|
||||
│ │ ○ About │ ────────────────│ ├─ Type: Template │ │
|
||||
│ │ ○ Contact │ 1. Hero Section │ ├─ CPT: post │ │
|
||||
│ │ │ [Image ◆] │ └─ Permalink: /blog │ │
|
||||
│ │ 📋 Posts │ 2. Content │ │ │
|
||||
│ │ ○ Portfolio│ [Post Body ◆]│ Section Settings │ │
|
||||
│ │ ○ News │ 3. Related Posts│ ├─ Layout: Grid 3 │ │
|
||||
│ │ │ [Query ◆] │ ├─ Count: [3___] │ │
|
||||
│ │ [+ Create] │ 4. CTA Banner │ └─ [Delete] │ │
|
||||
│ │ │ │ │ │
|
||||
│ │ │ [+ Add Section] │ Preview │ │
|
||||
│ │ │ │ [Desktop] [Mobile] │ │
|
||||
│ │ │ Legend: │ ┌──────────────────┐│ │
|
||||
│ │ │ [◆] = Dynamic │ │ Live SPA Preview ││ │
|
||||
│ │ │ placeholder │ │ (Real-time) ││ │
|
||||
│ │ │ │ └──────────────────┘│ │
|
||||
│ │ │ │ │ │
|
||||
│ └────────────┴──────────────────┴──────────────────────┘ │
|
||||
│ │
|
||||
│ [Discard Changes] [Save Changes] [Preview] │
|
||||
│ │
|
||||
└─────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
### Settings Panel Behavior
|
||||
|
||||
**For Structural Pages (No Section Selected):**
|
||||
```
|
||||
Page Settings
|
||||
├─ Type: Page (Structural)
|
||||
├─ Title: About Us
|
||||
├─ Slug: about
|
||||
└─ SEO: Manage in Yoast [→]
|
||||
```
|
||||
|
||||
**For Templates (No Section Selected):**
|
||||
```
|
||||
Template Settings
|
||||
├─ Type: Template (Dynamic)
|
||||
├─ CPT: Post
|
||||
├─ Applies to: /blog/*
|
||||
└─ Edit CPT permalink: [→]
|
||||
```
|
||||
|
||||
**For Sections with Dynamic Fields:**
|
||||
```
|
||||
Section Settings: Hero
|
||||
|
||||
Layout Variant
|
||||
[Hero Left Image ▼]
|
||||
|
||||
Title Field
|
||||
○ Static: [____________]
|
||||
◉ Dynamic: [Post Title ◆]
|
||||
|
||||
Image Field
|
||||
○ Static: [Choose Image]
|
||||
◉ Dynamic: [Featured Image ◆]
|
||||
|
||||
[Delete Section]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Admin SPA Integration
|
||||
|
||||
### Navigation Location
|
||||
- **Menu**: Appearance (existing)
|
||||
- **Submenu**: Pages (NEW)
|
||||
- **Path**: `/admin/appearance/pages`
|
||||
|
||||
### Sidebar Behavior
|
||||
|
||||
**Default (Expanded):**
|
||||
- Admin sidebar shows full menu with labels
|
||||
- Page editor takes remaining width (3-column layout)
|
||||
|
||||
**Collapsed:**
|
||||
- Admin sidebar shows icons only (~60px width)
|
||||
- Page editor expands to use more width
|
||||
- Tooltips show on hover
|
||||
|
||||
**Layout dimensions:**
|
||||
|
||||
| State | Sidebar | Content Area | Pages List | Editor | Settings+Preview |
|
||||
|-------|---------|--------------|-----------|--------|------------------|
|
||||
| Expanded | 240px | ~1160px | 120px | 650px | 390px |
|
||||
| Collapsed | 60px | ~1340px | 120px | 750px | 470px |
|
||||
|
||||
### No Full-Screen Takeover
|
||||
- ✅ Part of admin SPA normal content flow
|
||||
- ✅ User maintains context (can quickly jump to other admin sections)
|
||||
- ✅ Sidebar collapse is user-controlled, not forced
|
||||
- ✅ Can navigate back via breadcrumb or admin menu
|
||||
|
||||
### Escape Routes
|
||||
1. Click WooNooW logo → Dashboard
|
||||
2. Click any menu item in sidebar → Navigate to that section
|
||||
3. Press ESC key → Back (with unsaved changes warning)
|
||||
4. Click browser back button → Back (with unsaved changes warning)
|
||||
5. Click breadcrumb "Appearance" → Back to Appearance settings
|
||||
|
||||
---
|
||||
|
||||
## SEO Preservation
|
||||
|
||||
### Yoast/Rank Math Integration
|
||||
- ✅ Meta title, meta description managed by Yoast/Rank Math
|
||||
- ✅ Canonical URLs managed by WordPress
|
||||
- ✅ Open Graph tags managed by SEO plugins
|
||||
- ✅ Structured data can be added to page template
|
||||
- ✅ No changes needed to existing SEO workflow
|
||||
|
||||
### For CPT Items (Posts, Portfolio, etc.)
|
||||
- Yoast/Rank Math still manages SEO for individual CPT items
|
||||
- Templates don't interfere with SEO workflow
|
||||
- Bot sees pre-rendered content with all placeholders filled
|
||||
|
||||
### What Bots See
|
||||
|
||||
**Example: Blog Post with Template**
|
||||
```html
|
||||
<h1>Article Title</h1>
|
||||
<img src="/uploads/featured.jpg" alt="Article featured image" />
|
||||
<article>
|
||||
<p>Article body content goes here...</p>
|
||||
</article>
|
||||
<section class="related-posts">
|
||||
<h2>Related Articles</h2>
|
||||
<div class="grid">
|
||||
<a href="/blog/related-1">Related Post 1</a>
|
||||
<a href="/blog/related-2">Related Post 2</a>
|
||||
</div>
|
||||
</section>
|
||||
```
|
||||
|
||||
- ✅ All text crawlable
|
||||
- ✅ All links followable
|
||||
- ✅ Structure preserved
|
||||
- ✅ Meta tags present
|
||||
- ✅ Images indexed
|
||||
|
||||
---
|
||||
|
||||
## API Endpoints
|
||||
|
||||
### Get All Pages & Templates
|
||||
```
|
||||
GET /wp-json/woonoow/v1/pages
|
||||
```
|
||||
|
||||
**Response:**
|
||||
```json
|
||||
[
|
||||
{
|
||||
"id": 42,
|
||||
"type": "page",
|
||||
"slug": "home",
|
||||
"title": "Homepage",
|
||||
"icon": "page"
|
||||
},
|
||||
{
|
||||
"type": "template",
|
||||
"cpt": "post",
|
||||
"title": "Blog Post Template",
|
||||
"icon": "template",
|
||||
"permalink_base": "/blog/"
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
### Get Page or Template Structure
|
||||
```
|
||||
GET /wp-json/woonoow/v1/pages/about
|
||||
GET /wp-json/woonoow/v1/templates/post
|
||||
```
|
||||
|
||||
**Response:**
|
||||
```json
|
||||
{
|
||||
"type": "page|template",
|
||||
"id": 42,
|
||||
"slug": "about",
|
||||
"title": "About Us",
|
||||
"url": "https://mystore.com/about",
|
||||
"seo": {
|
||||
"meta_title": "About Us | My Store",
|
||||
"meta_description": "Learn about our company...",
|
||||
"canonical": "https://mystore.com/about",
|
||||
"og_title": "About Us",
|
||||
"og_image": "https://mystore.com/og-image.jpg"
|
||||
},
|
||||
"structure": {
|
||||
"sections": [...]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Get Single Post with Template Applied
|
||||
```
|
||||
GET /wp-json/woonoow/v1/posts/{post_id}/with-template
|
||||
```
|
||||
|
||||
**Response:**
|
||||
```json
|
||||
{
|
||||
"post": {
|
||||
"id": 123,
|
||||
"title": "Article Title",
|
||||
"content": "Article body...",
|
||||
"featured_image": "/uploads/image.jpg",
|
||||
"author": "John Doe",
|
||||
"date": "2026-01-11"
|
||||
},
|
||||
"template": {
|
||||
"sections": [...]
|
||||
},
|
||||
"rendered": {
|
||||
"sections": [
|
||||
{
|
||||
"type": "hero",
|
||||
"props": {
|
||||
"title": "Article Title", // Placeholder filled
|
||||
"image": "/uploads/image.jpg" // Placeholder filled
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Save Page or Template Structure
|
||||
```
|
||||
POST /wp-json/woonoow/v1/pages/about
|
||||
POST /wp-json/woonoow/v1/templates/post
|
||||
```
|
||||
|
||||
**Request body:**
|
||||
```json
|
||||
{
|
||||
"sections": [...]
|
||||
}
|
||||
```
|
||||
|
||||
**Response:**
|
||||
```json
|
||||
{
|
||||
"success": true,
|
||||
"page": { ... }
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Implementation Phases
|
||||
|
||||
### Phase 1: Core Infrastructure (Priority)
|
||||
- [ ] Add bot detection logic to `TemplateOverride.php`
|
||||
- [ ] Build `PageSSR` class to render sections as HTML
|
||||
- [ ] Build `PlaceholderRenderer` class to replace dynamic placeholders
|
||||
- [ ] Create REST API endpoints:
|
||||
- `GET /wp-json/woonoow/v1/pages` (list all)
|
||||
- `GET /wp-json/woonoow/v1/pages/{slug}` (get page)
|
||||
- `GET /wp-json/woonoow/v1/templates/{cpt}` (get template)
|
||||
- `GET /wp-json/woonoow/v1/posts/{id}/with-template` (get post with template)
|
||||
- `POST /wp-json/woonoow/v1/pages/{slug}` (save page)
|
||||
- `POST /wp-json/woonoow/v1/templates/{cpt}` (save template)
|
||||
- [ ] Update template_redirect hook:
|
||||
- Detect if structural page or CPT item
|
||||
- Load appropriate template
|
||||
- Replace placeholders (for CPT items)
|
||||
- Serve SSR for bots (exit without redirect)
|
||||
- Redirect humans to SPA with matching permalink structure
|
||||
- [ ] Create React `DynamicPageRenderer` component
|
||||
- [ ] Test bot crawling vs human browsing
|
||||
|
||||
### Phase 2: Admin SPA Integration
|
||||
- [ ] Add "Pages" submenu to Appearance menu
|
||||
- [ ] Create `/admin/appearance/pages` route
|
||||
- [ ] Build `PageEditor` component with 3-column layout
|
||||
- [ ] Implement sidebar collapse/expand functionality
|
||||
- [ ] Add breadcrumb navigation
|
||||
- [ ] Implement create page modal (structural vs template selection)
|
||||
- [ ] Test navigation flow
|
||||
|
||||
### Phase 3: WooNooW Page Editor (UI)
|
||||
- [ ] Build custom admin page editor UI (React)
|
||||
- [ ] Section list with drag-to-reorder
|
||||
- [ ] Section selector popup when clicking "+ Add Section"
|
||||
- [ ] Layout variant dropdown per section
|
||||
- [ ] Color scheme selector per section
|
||||
- [ ] Form fields for section content:
|
||||
- Static field: text input
|
||||
- Dynamic field: dropdown with available sources
|
||||
- [ ] Live SPA preview iframe (real-time updates)
|
||||
- [ ] Desktop/Mobile preview toggle
|
||||
- [ ] Save/Publish button → stores to postmeta or wp_options
|
||||
- [ ] Visual indicator for dynamic placeholders ([◆])
|
||||
|
||||
### Phase 4: Section Library
|
||||
- [ ] Define section types and their props schema
|
||||
- [ ] Hero section renderer (SSR + React)
|
||||
- [ ] Content section renderer (for post body)
|
||||
- [ ] Feature grid renderer (SSR + React)
|
||||
- [ ] Related items section (for related posts/CPT items)
|
||||
- [ ] CTA banner renderer (SSR + React)
|
||||
- [ ] Add more sections as needed
|
||||
|
||||
### Phase 5: Polish & Launch
|
||||
- [ ] Caching for SSR (cache rendered HTML for 1 hour)
|
||||
- [ ] Unsaved changes warning (ESC key, browser back, menu click)
|
||||
- [ ] Test SEO with Google Search Console
|
||||
- [ ] Test with bot simulators (curl with bot user agents)
|
||||
- [ ] Test dynamic placeholder rendering
|
||||
- [ ] Documentation for merchants
|
||||
- [ ] Documentation for developers (extending sections, custom placeholders)
|
||||
|
||||
---
|
||||
|
||||
## Database Schema
|
||||
|
||||
### Structural Pages (page CPT)
|
||||
```sql
|
||||
wp_posts:
|
||||
├─ id: 42
|
||||
├─ post_type: 'page'
|
||||
├─ post_name: 'about'
|
||||
├─ post_title: 'About Us'
|
||||
├─ post_status: 'publish'
|
||||
└─ post_modified: '2026-01-11 20:58:00'
|
||||
|
||||
wp_postmeta:
|
||||
├─ post_id: 42, meta_key: '_wn_page_structure'
|
||||
│ value: {"type": "page", "sections": [...]}
|
||||
├─ post_id: 42, meta_key: '_yoast_wpseo_title'
|
||||
│ value: "About Us | My Store"
|
||||
├─ post_id: 42, meta_key: '_yoast_wpseo_metadesc'
|
||||
│ value: "Learn about our company..."
|
||||
├─ post_id: 42, meta_key: '_yoast_wpseo_canonical'
|
||||
│ value: "https://mystore.com/about"
|
||||
└─ post_id: 42, meta_key: '_yoast_wpseo_opengraph-image'
|
||||
value: "https://mystore.com/og-image.jpg"
|
||||
```
|
||||
|
||||
### CPT Templates
|
||||
```sql
|
||||
wp_options:
|
||||
├─ option_name: 'wn_template_post'
|
||||
│ option_value: {"type": "template", "cpt": "post", "sections": [...]}
|
||||
├─ option_name: 'wn_template_portfolio'
|
||||
│ option_value: {"type": "template", "cpt": "portfolio", "sections": [...]}
|
||||
└─ option_name: 'wn_template_custom_cpt'
|
||||
option_value: {"type": "template", "cpt": "custom_cpt", "sections": [...]}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Target Users & Experience
|
||||
|
||||
### Tech-Savvy Users (Developers/Agencies)
|
||||
**Use Case**: Building custom stores with WooNooW
|
||||
**Tools**: WooNooW CSS variables, class documentation, section schema
|
||||
**Value**: Framework for rapid SPA development, design system enforcement
|
||||
|
||||
### Non-Tech Merchants
|
||||
**Use Case**: Quick store setup with predefined pages and templates
|
||||
**Tools**: WooNooW Page Editor (constrained choices, no freestyle design)
|
||||
**Value**: Professional pages in minutes, consistent styling across all CPTs
|
||||
|
||||
### Both
|
||||
**Result**: Consistent visual identity across structural pages + dynamic CPT items
|
||||
|
||||
---
|
||||
|
||||
## Decision Summary
|
||||
|
||||
| Aspect | Decision |
|
||||
|--------|----------|
|
||||
| **Editor Type** | Single unified editor for pages + CPT templates |
|
||||
| **Structural Pages** | Native `page` CPT, stored in postmeta |
|
||||
| **CPT Templates** | Stored in wp_options (one per CPT) |
|
||||
| **Field Types** | Static (hardcoded) or Dynamic (with placeholders) |
|
||||
| **Available Placeholders** | post_title, post_content, featured_image, author, date, related_posts, etc. |
|
||||
| **Page Builder Integration** | None (custom WooNooW editor only) |
|
||||
| **Admin Location** | Appearance > Pages (single submenu) |
|
||||
| **Editor Context** | Part of admin SPA (not full-screen) |
|
||||
| **Sidebar Behavior** | Collapsible (expanded or icon-only) |
|
||||
| **Create Flow** | Modal asks: Structural page or CPT template? |
|
||||
| **SPA Routing** | Matches WordPress permalink structure |
|
||||
| **Permalink Matching** | `/blog/slug` → `/store/blog/slug` |
|
||||
| **SEO** | Yoast/Rank Math for pages, templates don't interfere |
|
||||
| **Bot Handling** | No redirect, serve pre-rendered HTML with placeholders filled |
|
||||
| **Human Handling** | HTTP 302 redirect to SPA with matching permalink structure |
|
||||
| **SPA Location** | Single centralized page (e.g., `/store/`) |
|
||||
| **Performance** | Cache SSR HTML (1 hour TTL) |
|
||||
| **UI Pattern** | 3-column layout (pages list, editor, settings+preview) |
|
||||
| **Template Types** | Hero, Content, Feature Grid, Related Items, CTA Banner |
|
||||
|
||||
---
|
||||
|
||||
## What's NOT Changing
|
||||
|
||||
✅ Existing shop/product/cart/checkout functionality
|
||||
✅ Existing SPA architecture (single page, centralized)
|
||||
✅ Existing template override logic (extended, not replaced)
|
||||
✅ Existing API patterns (new endpoints follow conventions)
|
||||
✅ Existing CSS variable system (reused for all sections)
|
||||
✅ SEO plugin compatibility (Yoast, Rank Math continue to work)
|
||||
✅ Admin menu structure (Pages added to existing Appearance menu)
|
||||
✅ Admin sidebar (enhanced with collapse functionality, not replaced)
|
||||
|
||||
---
|
||||
|
||||
## Key Architectural Benefits
|
||||
|
||||
✅ **One editor, two modes** - Merchants don't learn separate systems
|
||||
✅ **Clean separation** - Static pages vs dynamic templates clear
|
||||
✅ **URL consistency** - SPA routes match WordPress permalinks
|
||||
✅ **SEO perfect** - Bots see full content, humans get SPA experience
|
||||
✅ **Scalable** - Works for current CPTs and future custom CPTs
|
||||
✅ **Flexible placeholders** - Can add any post field or custom meta
|
||||
✅ **No page builder lock-in** - Custom sections, not Gutenberg/Elementor
|
||||
✅ **Maintains design consistency** - Predefined sections, no freestyle design
|
||||
|
||||
---
|
||||
|
||||
## Next Discussion Topics
|
||||
- [ ] Section library detailed specs (Hero, Content, Features, Related, CTA)
|
||||
- [ ] Placeholder source definitions and extensibility
|
||||
- [ ] Section schema validation
|
||||
- [ ] Caching strategy details (Redis vs file-based vs transient)
|
||||
- [ ] Migration path for existing pages/posts
|
||||
- [ ] Developer documentation (extending sections, custom placeholders)
|
||||
- [ ] Component structure and file organization (React + PHP)
|
||||
Reference in New Issue
Block a user