| @@ -22,10 +22,8 @@ | ||
| 22 | 22 | $pro_tool_use = apply_filters('mxchat_content_pro_feature', false, 'tool_use'); |
| 23 | 23 | $pro_image_management = apply_filters('mxchat_content_pro_feature', false, 'image_management'); |
| 24 | 24 | $pro_meta_management = apply_filters('mxchat_content_pro_feature', false, 'meta_management'); |
| 25 | 25 | $pro_gsc_integration = apply_filters('mxchat_content_pro_feature', false, 'gsc_integration'); |
| 26 | - $pro_content_calendar = apply_filters('mxchat_content_pro_feature', false, 'content_calendar'); | |
| 27 | - $pro_template_generator = apply_filters('mxchat_content_pro_feature', false, 'template_generator'); | |
| 28 | 26 | ?> |
| 29 | 27 | <div class="mxch-admin-wrapper"> |
| 30 | 28 | <!-- Mobile Header --> |
| 31 | 29 | <header class="mxch-mobile-header"> |
| @@ -69,16 +67,8 @@ | ||
| 69 | 67 | <button class="mxch-mobile-nav-link" data-target="content-seo"> |
| 70 | 68 | <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20V10"/><path d="M18 20V4"/><path d="M6 20v-4"/></svg> |
| 71 | 69 | <span><?php esc_html_e('SEO', 'mxchat'); ?></span> |
| 72 | 70 | </button> |
| 73 | - <button class="mxch-mobile-nav-link" data-target="content-calendar"> | |
| 74 | - <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg> | |
| 75 | - <span><?php esc_html_e('Calendar', 'mxchat'); ?></span> | |
| 76 | - </button> | |
| 77 | - <button class="mxch-mobile-nav-link" data-target="content-templates"> | |
| 78 | - <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18"/><path d="M9 21V9"/></svg> | |
| 79 | - <span><?php esc_html_e('Templates', 'mxchat'); ?></span> | |
| 80 | - </button> | |
| 81 | 71 | </div> |
| 82 | 72 | </nav> |
| 83 | 73 | </div> |
| 84 | 74 | |
| @@ -132,26 +122,8 @@ | ||
| 132 | 122 | </span> |
| 133 | 123 | <span class="mxch-nav-link-text"><?php esc_html_e('SEO', 'mxchat'); ?></span> |
| 134 | 124 | </button> |
| 135 | 125 | </div> |
| 136 | - | |
| 137 | - <div class="mxch-nav-item" data-section="content-calendar"> | |
| 138 | - <button class="mxch-nav-link" data-target="content-calendar"> | |
| 139 | - <span class="mxch-nav-link-icon"> | |
| 140 | - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg> | |
| 141 | - </span> | |
| 142 | - <span class="mxch-nav-link-text"><?php esc_html_e('Calendar', 'mxchat'); ?></span> | |
| 143 | - </button> | |
| 144 | - </div> | |
| 145 | - | |
| 146 | - <div class="mxch-nav-item" data-section="content-templates"> | |
| 147 | - <button class="mxch-nav-link" data-target="content-templates"> | |
| 148 | - <span class="mxch-nav-link-icon"> | |
| 149 | - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18"/><path d="M9 21V9"/></svg> | |
| 150 | - </span> | |
| 151 | - <span class="mxch-nav-link-text"><?php esc_html_e('Templates', 'mxchat'); ?></span> | |
| 152 | - </button> | |
| 153 | - </div> | |
| 154 | 126 | </div> |
| 155 | 127 | </nav> |
| 156 | 128 | </aside> |
| 157 | 129 | |
| @@ -232,12 +204,8 @@ | ||
| 232 | 204 | </div> |
| 233 | 205 | </div> |
| 234 | 206 | <div class="mxch-cg-form"> |
| 235 | 207 | <textarea id="mxch-cg-prompt" class="mxch-cg-prompt" rows="3" placeholder="<?php esc_attr_e('Describe the content you want to generate...', 'mxchat'); ?>"></textarea> |
| 236 | - <button type="button" id="mxch-cg-edit-prompt-btn" class="mxch-cg-edit-prompt-btn"> | |
| 237 | - <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg> | |
| 238 | - <?php esc_html_e('Edit Default Prompt', 'mxchat'); ?> | |
| 239 | - </button> | |
| 240 | 208 | <div class="mxch-cg-options"> |
| 241 | 209 | <div class="mxch-cg-option"> |
| 242 | 210 | <label class="mxch-cg-option-label" for="mxch-cg-type"><?php esc_html_e('Type', 'mxchat'); ?></label> |
| 243 | 211 | <select id="mxch-cg-type" class="mxch-cg-select"> |
| @@ -272,15 +240,8 @@ | ||
| 272 | 240 | <option value="show"><?php esc_html_e('Show', 'mxchat'); ?></option> |
| 273 | 241 | <option value="hide" selected><?php esc_html_e('Hide (title in content)', 'mxchat'); ?></option> |
| 274 | 242 | </select> |
| 275 | 243 | </div> |
| 276 | - <div class="mxch-cg-option"> | |
| 277 | - <label class="mxch-cg-option-label" for="mxch-cg-template-mode"><?php esc_html_e('Template Mode', 'mxchat'); ?></label> | |
| 278 | - <select id="mxch-cg-template-mode" class="mxch-cg-select"> | |
| 279 | - <option value="off" selected><?php esc_html_e('Off', 'mxchat'); ?></option> | |
| 280 | - <option value="on"><?php esc_html_e('On (Spintax)', 'mxchat'); ?></option> | |
| 281 | - </select> | |
| 282 | - </div> | |
| 283 | 244 | </div> |
| 284 | 245 | <button type="button" id="mxch-cg-generate-btn" class="mxch-cg-generate-btn mxch-cg-generate-btn-full"> |
| 285 | 246 | <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/></svg> |
| 286 | 247 | <span><?php esc_html_e('Generate Content', 'mxchat'); ?></span> |
| @@ -294,29 +255,8 @@ | ||
| 294 | 255 | <p class="mxch-cg-progress-text"><?php esc_html_e('Starting...', 'mxchat'); ?></p> |
| 295 | 256 | </div> |
| 296 | 257 | </div> |
| 297 | 258 | </div> |
| 298 | - <!-- Edit Default Prompt Modal --> | |
| 299 | - <div id="mxch-cg-prompt-modal" class="mxch-cg-prompt-modal" style="display:none;"> | |
| 300 | - <div class="mxch-cg-prompt-modal-overlay"></div> | |
| 301 | - <div class="mxch-cg-prompt-modal-content"> | |
| 302 | - <div class="mxch-cg-prompt-modal-header"> | |
| 303 | - <h3><?php esc_html_e('Edit Default System Prompt', 'mxchat'); ?></h3> | |
| 304 | - <button type="button" id="mxch-cg-prompt-modal-close" class="mxch-cg-prompt-modal-close">×</button> | |
| 305 | - </div> | |
| 306 | - <div class="mxch-cg-prompt-modal-body"> | |
| 307 | - <p class="mxch-cg-prompt-modal-desc"><?php esc_html_e('This is the system prompt sent to the AI when generating content. Edit it to customize how your content is generated.', 'mxchat'); ?></p> | |
| 308 | - <textarea id="mxch-cg-system-prompt-editor" class="mxch-cg-system-prompt-editor" rows="20"></textarea> | |
| 309 | - </div> | |
| 310 | - <div class="mxch-cg-prompt-modal-footer"> | |
| 311 | - <button type="button" id="mxch-cg-prompt-reset" class="button"><?php esc_html_e('Reset to Default', 'mxchat'); ?></button> | |
| 312 | - <div class="mxch-cg-prompt-modal-footer-right"> | |
| 313 | - <button type="button" id="mxch-cg-prompt-cancel" class="button"><?php esc_html_e('Cancel', 'mxchat'); ?></button> | |
| 314 | - <button type="button" id="mxch-cg-prompt-save" class="button button-primary"><?php esc_html_e('Save Changes', 'mxchat'); ?></button> | |
| 315 | - </div> | |
| 316 | - </div> | |
| 317 | - </div> | |
| 318 | - </div> | |
| 319 | 259 | <!-- Loading indicator (shown during async generation) --> |
| 320 | 260 | <div id="mxch-cg-loading-indicator" class="mxch-cg-loading-indicator" style="display:none;"> |
| 321 | 261 | <div class="mxch-cg-loading-spinner"> |
| 322 | 262 | <div class="mxch-cg-loading-spinner-ring"></div> |
| @@ -515,9 +455,8 @@ | ||
| 515 | 455 | <?php |
| 516 | 456 | $content_model = $options['content_model'] ?? ($options['model'] ?? 'gpt-5.1-chat-latest'); |
| 517 | 457 | $models = array( |
| 518 | 458 | 'OpenAI' => array( |
| 519 | - 'gpt-5.4' => 'GPT-5.4', | |
| 520 | 459 | 'gpt-5.2' => 'GPT-5.2', |
| 521 | 460 | 'gpt-5.1-chat-latest' => 'GPT-5.1', |
| 522 | 461 | 'gpt-5' => 'GPT-5', |
| 523 | 462 | ), |
| @@ -806,222 +745,8 @@ | ||
| 806 | 745 | </div> |
| 807 | 746 | </div> |
| 808 | 747 | </div> |
| 809 | 748 | </div> |
| 810 | - </div> | |
| 811 | - | |
| 812 | - <!-- ======================================== | |
| 813 | - CALENDAR | |
| 814 | - ======================================== --> | |
| 815 | - <div id="content-calendar" class="mxch-section"> | |
| 816 | - <?php if ($pro_content_calendar) : ?> | |
| 817 | - <!-- Add-on is active — container for calendar JS to populate --> | |
| 818 | - <div class="mxcal-container" id="mxcal-container"></div> | |
| 819 | - <?php else : ?> | |
| 820 | - <!-- Add-on not installed — show blurred demo calendar --> | |
| 821 | - <style> | |
| 822 | - .mxcal-demo-wrap { position: relative; } | |
| 823 | - .mxcal-demo-blur { filter: blur(3px); pointer-events: none; user-select: none; opacity: 0.7; } | |
| 824 | - .mxcal-demo-overlay { | |
| 825 | - position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); | |
| 826 | - z-index: 10; text-align: center; background: rgba(255,255,255,0.95); | |
| 827 | - border-radius: 16px; padding: 40px 48px; box-shadow: 0 8px 40px rgba(120,115,245,0.15); | |
| 828 | - border: 1px solid rgba(120,115,245,0.12); max-width: 460px; width: 90%; | |
| 829 | - } | |
| 830 | - .mxcal-demo-overlay h2 { | |
| 831 | - font-size: 22px; font-weight: 700; margin: 0 0 8px; color: #1A202C; | |
| 832 | - } | |
| 833 | - .mxcal-demo-overlay p { font-size: 14px; color: #718096; line-height: 1.6; margin: 0 0 20px; } | |
| 834 | - .mxcal-demo-overlay .mxcal-demo-badge { | |
| 835 | - display: inline-block; background: linear-gradient(135deg, #fa73e6, #7873f5); | |
| 836 | - color: #fff; font-size: 11px; font-weight: 700; padding: 4px 12px; | |
| 837 | - border-radius: 20px; margin-bottom: 16px; letter-spacing: 0.5px; | |
| 838 | - } | |
| 839 | - .mxcal-demo-overlay a.mxcal-demo-btn { | |
| 840 | - display: inline-block; background: linear-gradient(135deg, #fa73e6, #7873f5); | |
| 841 | - color: #fff; font-size: 14px; font-weight: 600; padding: 12px 28px; | |
| 842 | - border-radius: 10px; text-decoration: none; transition: all 0.2s; | |
| 843 | - box-shadow: 0 4px 14px rgba(120,115,245,0.25); | |
| 844 | - } | |
| 845 | - .mxcal-demo-overlay a.mxcal-demo-btn:hover { | |
| 846 | - box-shadow: 0 6px 20px rgba(120,115,245,0.35); transform: translateY(-1px); | |
| 847 | - } | |
| 848 | - .mxcal-demo-grid { | |
| 849 | - display: grid; grid-template-columns: repeat(7, 1fr); | |
| 850 | - border: 1px solid #E2E8F0; border-radius: 12px; overflow: hidden; background: #fff; | |
| 851 | - } | |
| 852 | - .mxcal-demo-hdr { | |
| 853 | - background: #F7FAFC; padding: 10px 6px; text-align: center; | |
| 854 | - font-size: 11px; font-weight: 600; color: #A0AEC0; text-transform: uppercase; | |
| 855 | - border-bottom: 1px solid #E2E8F0; | |
| 856 | - } | |
| 857 | - .mxcal-demo-day { | |
| 858 | - min-height: 90px; padding: 8px; border-right: 1px solid #F0F0F5; | |
| 859 | - border-bottom: 1px solid #F0F0F5; display: flex; flex-direction: column; gap: 4px; | |
| 860 | - } | |
| 861 | - .mxcal-demo-day:nth-child(7n) { border-right: none; } | |
| 862 | - .mxcal-demo-num { font-size: 12px; font-weight: 600; color: #A0AEC0; } | |
| 863 | - .mxcal-demo-kw { font-size: 10px; font-weight: 600; color: #2D3748; line-height: 1.2; } | |
| 864 | - .mxcal-demo-stats { display: flex; gap: 4px; margin-top: auto; } | |
| 865 | - .mxcal-demo-vol { font-size: 9px; background: #EDF2F7; padding: 1px 5px; border-radius: 3px; color: #718096; } | |
| 866 | - .mxcal-demo-kd { font-size: 9px; padding: 1px 5px; border-radius: 3px; font-weight: 700; } | |
| 867 | - .mxcal-demo-easy { background: rgba(16,185,129,0.1); color: #059669; } | |
| 868 | - .mxcal-demo-med { background: rgba(245,158,11,0.1); color: #d97706; } | |
| 869 | - .mxcal-demo-hard { background: rgba(239,68,68,0.1); color: #dc2626; } | |
| 870 | - .mxcal-demo-planned { border-left: 3px solid #CBD5E0; } | |
| 871 | - .mxcal-demo-done { border-left: 3px solid #10b981; } | |
| 872 | - .mxcal-demo-empty { background: #FAFAFA; } | |
| 873 | - .mxcal-demo-header { | |
| 874 | - display: flex; justify-content: space-between; align-items: center; | |
| 875 | - margin-bottom: 16px; flex-wrap: wrap; gap: 12px; | |
| 876 | - } | |
| 877 | - .mxcal-demo-header h3 { font-size: 18px; font-weight: 700; color: #1A202C; margin: 0; } | |
| 878 | - .mxcal-demo-month { | |
| 879 | - display: flex; align-items: center; gap: 16px; justify-content: center; margin-bottom: 14px; | |
| 880 | - } | |
| 881 | - .mxcal-demo-month span { font-size: 16px; font-weight: 700; color: #2D3748; } | |
| 882 | - .mxcal-demo-month-btn { | |
| 883 | - background: none; border: 1px solid #E2E8F0; border-radius: 6px; | |
| 884 | - padding: 4px 12px; font-size: 12px; color: #718096; | |
| 885 | - } | |
| 886 | - </style> | |
| 887 | - <div class="mxcal-demo-wrap"> | |
| 888 | - <div class="mxcal-demo-blur"> | |
| 889 | - <div class="mxcal-demo-header"> | |
| 890 | - <h3>Content Calendar</h3> | |
| 891 | - <div style="display:flex;gap:8px;"> | |
| 892 | - <span style="background:#EDF2F7;padding:4px 12px;border-radius:20px;font-size:12px;color:#4A5568;">mxchat.ai</span> | |
| 893 | - <span style="background:linear-gradient(135deg,#fa73e6,#7873f5);padding:4px 12px;border-radius:20px;font-size:11px;color:#fff;font-weight:600;">AI Chatbot Plugin</span> | |
| 894 | - </div> | |
| 895 | - </div> | |
| 896 | - <div class="mxcal-demo-month"> | |
| 897 | - <button class="mxcal-demo-month-btn">←</button> | |
| 898 | - <span><?php echo esc_html(wp_date('F Y')); ?></span> | |
| 899 | - <button class="mxcal-demo-month-btn">→</button> | |
| 900 | - </div> | |
| 901 | - <div class="mxcal-demo-grid"> | |
| 902 | - <?php | |
| 903 | - $days = array('Sun','Mon','Tue','Wed','Thu','Fri','Sat'); | |
| 904 | - foreach ($days as $d) echo '<div class="mxcal-demo-hdr">' . $d . '</div>'; | |
| 905 | - | |
| 906 | - $demo_posts = array( | |
| 907 | - array('kw' => 'wordpress chatbot plugin', 'vol' => '2,400', 'kd' => 'KD 28', 'cls' => 'easy', 'st' => 'done'), | |
| 908 | - array('kw' => 'ai customer support', 'vol' => '1,900', 'kd' => 'KD 35', 'cls' => 'med', 'st' => 'done'), | |
| 909 | - array('kw' => 'chatbot for ecommerce', 'vol' => '1,600', 'kd' => 'KD 22', 'cls' => 'easy', 'st' => 'done'), | |
| 910 | - array('kw' => 'gpt wordpress integration', 'vol' => '1,100', 'kd' => 'KD 41', 'cls' => 'med', 'st' => 'planned'), | |
| 911 | - array('kw' => 'live chat vs chatbot', 'vol' => '3,200', 'kd' => 'KD 18', 'cls' => 'easy', 'st' => 'planned'), | |
| 912 | - array('kw' => 'ai lead generation', 'vol' => '2,800', 'kd' => 'KD 52', 'cls' => 'med', 'st' => 'planned'), | |
| 913 | - array('kw' => 'reduce support tickets ai', 'vol' => '880', 'kd' => 'KD 15', 'cls' => 'easy', 'st' => 'planned'), | |
| 914 | - array('kw' => 'best chatbot plugins 2026', 'vol' => '4,100', 'kd' => 'KD 62', 'cls' => 'hard', 'st' => 'planned'), | |
| 915 | - array('kw' => 'woocommerce chatbot', 'vol' => '1,400', 'kd' => 'KD 30', 'cls' => 'med', 'st' => 'planned'), | |
| 916 | - array('kw' => 'automate faq wordpress', 'vol' => '720', 'kd' => 'KD 12', 'cls' => 'easy', 'st' => 'planned'), | |
| 917 | - array('kw' => 'claude vs chatgpt wordpress', 'vol' => '2,100', 'kd' => 'KD 38', 'cls' => 'med', 'st' => 'planned'), | |
| 918 | - array('kw' => 'ai content generation', 'vol' => '5,400', 'kd' => 'KD 68', 'cls' => 'hard', 'st' => 'planned'), | |
| 919 | - ); | |
| 920 | - | |
| 921 | - $first_day = (int) wp_date('w', strtotime('first day of this month')); | |
| 922 | - $days_in_month = (int) wp_date('t'); | |
| 923 | - $post_idx = 0; | |
| 924 | - | |
| 925 | - for ($i = 0; $i < $first_day; $i++) echo '<div class="mxcal-demo-day mxcal-demo-empty"></div>'; | |
| 926 | - | |
| 927 | - for ($d = 1; $d <= $days_in_month; $d++) { | |
| 928 | - if ($post_idx < count($demo_posts)) { | |
| 929 | - $p = $demo_posts[$post_idx]; | |
| 930 | - $st_cls = $p['st'] === 'done' ? 'mxcal-demo-done' : 'mxcal-demo-planned'; | |
| 931 | - echo '<div class="mxcal-demo-day ' . $st_cls . '">'; | |
| 932 | - echo '<span class="mxcal-demo-num">' . $d . '</span>'; | |
| 933 | - echo '<span class="mxcal-demo-kw">' . esc_html($p['kw']) . '</span>'; | |
| 934 | - echo '<div class="mxcal-demo-stats">'; | |
| 935 | - echo '<span class="mxcal-demo-vol">' . $p['vol'] . '</span>'; | |
| 936 | - echo '<span class="mxcal-demo-kd mxcal-demo-' . $p['cls'] . '">' . $p['kd'] . '</span>'; | |
| 937 | - echo '</div></div>'; | |
| 938 | - $post_idx++; | |
| 939 | - } else { | |
| 940 | - echo '<div class="mxcal-demo-day mxcal-demo-empty"><span class="mxcal-demo-num">' . $d . '</span></div>'; | |
| 941 | - } | |
| 942 | - } | |
| 943 | - | |
| 944 | - $total = $first_day + $days_in_month; | |
| 945 | - $remaining = $total % 7 === 0 ? 0 : 7 - ($total % 7); | |
| 946 | - for ($i = 0; $i < $remaining; $i++) echo '<div class="mxcal-demo-day mxcal-demo-empty"></div>'; | |
| 947 | - ?> | |
| 948 | - </div> | |
| 949 | - </div> | |
| 950 | - <div class="mxcal-demo-overlay"> | |
| 951 | - <span class="mxcal-demo-badge">PRO ADD-ON</span> | |
| 952 | - <h2>AI Content Calendar</h2> | |
| 953 | - <p>Import SEO data and let AI generate a 30-day blog plan with targeted keywords, difficulty scores, and automated post scheduling.</p> | |
| 954 | - <a href="https://mxchat.ai/advanced-content-editor/" target="_blank" class="mxcal-demo-btn">Get Advanced Content Editor</a> | |
| 955 | - </div> | |
| 956 | - </div> | |
| 957 | - <?php endif; ?> | |
| 958 | - </div> | |
| 959 | - | |
| 960 | - <!-- ======================================== | |
| 961 | - TEMPLATES | |
| 962 | - ======================================== --> | |
| 963 | - <div id="content-templates" class="mxch-section"> | |
| 964 | - <?php if ($pro_template_generator) : ?> | |
| 965 | - <div id="mxtpl-container"></div> | |
| 966 | - <?php else : ?> | |
| 967 | - <style> | |
| 968 | - .mxtpl-demo-wrap { position: relative; } | |
| 969 | - .mxtpl-demo-blur { filter: blur(3px); pointer-events: none; user-select: none; opacity: 0.7; padding: 24px; } | |
| 970 | - .mxtpl-demo-overlay { | |
| 971 | - position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); | |
| 972 | - z-index: 10; text-align: center; background: rgba(255,255,255,0.95); | |
| 973 | - border-radius: 16px; padding: 40px 48px; box-shadow: 0 8px 40px rgba(120,115,245,0.15); | |
| 974 | - border: 1px solid rgba(120,115,245,0.12); max-width: 460px; width: 90%; | |
| 975 | - } | |
| 976 | - .mxtpl-demo-overlay h2 { font-size: 22px; font-weight: 700; margin: 0 0 8px; color: #1A202C; } | |
| 977 | - .mxtpl-demo-overlay p { font-size: 14px; color: #718096; line-height: 1.6; margin: 0 0 20px; } | |
| 978 | - .mxtpl-demo-badge { display: inline-block; background: linear-gradient(135deg, #fa73e6, #7873f5); color: #fff; font-size: 11px; font-weight: 700; padding: 4px 12px; border-radius: 20px; margin-bottom: 16px; letter-spacing: 0.5px; } | |
| 979 | - .mxtpl-demo-btn { display: inline-block; background: linear-gradient(135deg, #fa73e6, #7873f5); color: #fff; font-size: 14px; font-weight: 600; padding: 12px 28px; border-radius: 10px; text-decoration: none; box-shadow: 0 4px 14px rgba(120,115,245,0.25); } | |
| 980 | - .mxtpl-demo-section { margin-bottom: 20px; } | |
| 981 | - .mxtpl-demo-label { font-size: 14px; font-weight: 700; color: #2D3748; margin-bottom: 8px; } | |
| 982 | - .mxtpl-demo-textarea { width: 100%; padding: 12px; border: 2px solid #E2E8F0; border-radius: 8px; font-size: 13px; color: #4A5568; background: #F7FAFC; resize: none; font-family: inherit; } | |
| 983 | - .mxtpl-demo-pills { display: flex; gap: 6px; margin-bottom: 12px; flex-wrap: wrap; } | |
| 984 | - .mxtpl-demo-pill { background: rgba(120,115,245,0.08); color: #7873f5; padding: 3px 10px; border-radius: 20px; font-size: 11px; font-weight: 600; font-family: monospace; } | |
| 985 | - .mxtpl-demo-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; } | |
| 986 | - .mxtpl-demo-field { display: flex; flex-direction: column; gap: 4px; } | |
| 987 | - .mxtpl-demo-field label { font-size: 12px; font-weight: 600; color: #718096; } | |
| 988 | - .mxtpl-demo-field select, .mxtpl-demo-field input { padding: 8px 10px; border: 2px solid #E2E8F0; border-radius: 6px; font-size: 13px; background: #F7FAFC; } | |
| 989 | - </style> | |
| 990 | - <div class="mxtpl-demo-wrap"> | |
| 991 | - <div class="mxtpl-demo-blur"> | |
| 992 | - <div class="mxtpl-demo-section"> | |
| 993 | - <div class="mxtpl-demo-label">1. Upload Data</div> | |
| 994 | - <button style="padding:8px 18px;border:1px solid #E2E8F0;border-radius:8px;background:#F7FAFC;color:#718096;font-size:13px;cursor:default;">Upload CSV</button> | |
| 995 | - <span style="font-size:12px;color:#10b981;margin-left:8px;">24 rows loaded</span> | |
| 996 | - </div> | |
| 997 | - <div class="mxtpl-demo-section"> | |
| 998 | - <div class="mxtpl-demo-label">2. Content Source</div> | |
| 999 | - <div class="mxtpl-demo-pills"> | |
| 1000 | - <span class="mxtpl-demo-pill">{city}</span> | |
| 1001 | - <span class="mxtpl-demo-pill">{state}</span> | |
| 1002 | - <span class="mxtpl-demo-pill">{service}</span> | |
| 1003 | - <span class="mxtpl-demo-pill">{phone}</span> | |
| 1004 | - </div> | |
| 1005 | - <textarea class="mxtpl-demo-textarea" rows="3" readonly>Write a {comprehensive|detailed|in-depth} service page about {service} in {city}, {state}. Highlight our expertise and include a call to action with {phone}.</textarea> | |
| 1006 | - </div> | |
| 1007 | - <div class="mxtpl-demo-section"> | |
| 1008 | - <div class="mxtpl-demo-label">3. Settings</div> | |
| 1009 | - <div class="mxtpl-demo-grid"> | |
| 1010 | - <div class="mxtpl-demo-field"><label>Content Type</label><select><option>Page</option></select></div> | |
| 1011 | - <div class="mxtpl-demo-field"><label>Status</label><select><option>Draft</option></select></div> | |
| 1012 | - <div class="mxtpl-demo-field"><label>Slug Template</label><input type="text" value="{service}-in-{city}" readonly /></div> | |
| 1013 | - </div> | |
| 1014 | - </div> | |
| 1015 | - </div> | |
| 1016 | - <div class="mxtpl-demo-overlay"> | |
| 1017 | - <span class="mxtpl-demo-badge">PRO ADD-ON</span> | |
| 1018 | - <h2>Spintax & Template Generator</h2> | |
| 1019 | - <p>Generate bulk pages from CSV data with spintax variations. Create hundreds of unique, AI-written city pages, service pages, and landing pages.</p> | |
| 1020 | - <a href="https://mxchat.ai/advanced-content-editor/" target="_blank" class="mxtpl-demo-btn">Get Advanced Content Editor</a> | |
| 1021 | - </div> | |
| 1022 | - </div> | |
| 1023 | - <?php endif; ?> | |
| 1024 | 749 | </div> |
| 1025 | 750 | |
| 1026 | 751 | </main> |
| 1027 | 752 | </div> |
