文章目录
-
-
- 柔性广告素材智能生成插件是一款专为网络传媒行业设计的WordPress扩展工具,它能够根据不同的广告位尺寸、目标受众和内容主题,自动生成适配的广告素材。通过智能算法,插件可以动态调整广告的文字、图片和布局,大幅提高广告投放效率和转化率。
- 在开始开发之前,请确保您的开发环境满足以下要求: WordPress 5.0+ 版本 PHP 7.4+ 版本 MySQL 5.6+ 或 MariaDB 10.1+ 基本的HTML、CSS、JavaScript和PHP知识 <?php /** * 插件主文件 - flexible-ad-generator.php * * @package Flexible_Ad_Generator * @version 1.0.0 */ /* Plugin Name: 柔性广告素材智能生成插件 Plugin URI: https://yourwebsite.com/flexible-ad-generator Description: 智能生成适配不同广告位的柔性广告素材 Version: 1.0.0 Author: 您的名字 Author URI: https://yourwebsite.com License: GPL v2 or later Text Domain: flexible-ad-generator */ // 防止直接访问 if (!defined('ABSPATH')) { exit; } // 定义插件常量 define('FAG_VERSION', '1.0.0'); define('FAG_PLUGIN_DIR', plugin_dir_path(__FILE__)); define('FAG_PLUGIN_URL', plugin_dir_url(__FILE__));
-
- flexible-ad-generator/ ├── flexible-ad-generator.php # 主插件文件 ├── includes/ # 核心功能文件 │ ├── class-ad-generator.php # 广告生成器类 │ ├── class-ad-templates.php # 广告模板类 │ └── class-ai-processor.php # AI处理类 ├── admin/ # 后台管理文件 │ ├── css/ # 后台样式 │ ├── js/ # 后台脚本 │ └── admin-pages.php # 管理页面 ├── public/ # 前端文件 │ ├── css/ # 前端样式 │ ├── js/ # 前端脚本 │ └── shortcodes.php # 短代码处理 ├── templates/ # 模板文件 │ ├── banner-ad.php # 横幅广告模板 │ ├── square-ad.php # 方形广告模板 │ └── vertical-ad.php # 垂直广告模板 └── assets/ # 静态资源 ├── images/ # 默认图片 └── fonts/ # 字体文件
- <?php // includes/class-ad-generator.php /** * 广告生成器主类 */ class Flexible_Ad_Generator { private static $instance = null; private $templates; private $ai_processor; /** * 获取单例实例 */ public static function get_instance() { if (null === self::$instance) { self::$instance = new self(); } return self::$instance; } /** * 构造函数 */ private function __construct() { $this->load_dependencies(); $this->init_hooks(); } /** * 加载依赖文件 */ private function load_dependencies() { require_once FAG_PLUGIN_DIR . 'includes/class-ad-templates.php'; require_once FAG_PLUGIN_DIR . 'includes/class-ai-processor.php'; $this->templates = new Ad_Templates(); $this->ai_processor = new AI_Processor(); } /** * 初始化WordPress钩子 */ private function init_hooks() { // 激活/停用插件时的操作 register_activation_hook(__FILE__, array($this, 'activate')); register_deactivation_hook(__FILE__, array($this, 'deactivate')); // 初始化 add_action('init', array($this, 'init')); // 后台菜单 add_action('admin_menu', array($this, 'add_admin_menu')); // 注册短代码 add_shortcode('flexible_ad', array($this, 'render_ad_shortcode')); } /** * 插件激活时的操作 */ public function activate() { // 创建必要的数据库表 $this->create_database_tables(); // 设置默认选项 $this->set_default_options(); // 刷新重写规则 flush_rewrite_rules(); } /** * 创建数据库表 */ private function create_database_tables() { global $wpdb; $charset_collate = $wpdb->get_charset_collate(); $table_name = $wpdb->prefix . 'flexible_ads'; $sql = "CREATE TABLE IF NOT EXISTS $table_name ( id mediumint(9) NOT NULL AUTO_INCREMENT, title varchar(255) NOT NULL, ad_type varchar(50) NOT NULL, dimensions varchar(50) NOT NULL, content text NOT NULL, styles text, ai_settings text, impressions int(11) DEFAULT 0, clicks int(11) DEFAULT 0, created_at datetime DEFAULT CURRENT_TIMESTAMP, updated_at datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, PRIMARY KEY (id) ) $charset_collate;"; require_once(ABSPATH . 'wp-admin/includes/upgrade.php'); dbDelta($sql); } }
-
- <?php // includes/class-ai-processor.php /** * AI内容处理类 */ class AI_Processor { /** * 根据关键词生成广告文案 * * @param string $keywords 关键词 * @param string $tone 语气风格 * @param int $max_length 最大长度 * @return string 生成的文案 */ public function generate_ad_copy($keywords, $tone = 'professional', $max_length = 200) { // 这里可以集成第三方AI API,如OpenAI、百度AI等 // 以下为模拟实现 $tone_modifiers = array( 'professional' => array('高效', '专业', '可靠', '优质'), 'casual' => array('轻松', '简单', '有趣', '便捷'), 'urgent' => array('立即', '限时', '独家', '抢购') ); $modifiers = isset($tone_modifiers[$tone]) ? $tone_modifiers[$tone] : $tone_modifiers['professional']; $modifier = $modifiers[array_rand($modifiers)]; $action_verbs = array('发现', '体验', '获取', '享受', '探索', '开启'); $action_verb = $action_verbs[array_rand($action_verbs)]; $benefits = array('节省时间', '提高效率', '提升品质', '优化体验', '创造价值'); $benefit = $benefits[array_rand($benefits)]; // 构建广告文案 $copy = "{$modifier}{$keywords},{$action_verb}全新{$benefit}体验。"; // 如果文案太短,添加更多内容 if (strlen($copy) < $max_length * 0.5) { $additional = array( "立即行动,享受特别优惠!", "限时特惠,机会不容错过!", "专业团队,为您提供卓越服务。" ); $copy .= " " . $additional[array_rand($additional)]; } return mb_substr($copy, 0, $max_length); } /** * 智能选择配色方案 * * @param string $industry 行业类型 * @param string $mood 情绪氛围 * @return array 配色方案 */ public function generate_color_scheme($industry, $mood = 'neutral') { $schemes = array( 'technology' => array( 'primary' => '#2563eb', 'secondary' => '#1e40af', 'accent' => '#3b82f6', 'text' => '#1f2937', 'background' => '#f8fafc' ), 'fashion' => array( 'primary' => '#ec4899', 'secondary' => '#be185d', 'accent' => '#f472b6', 'text' => '#4c0519', 'background' => '#fdf2f8' ), 'food' => array( 'primary' => '#f59e0b', 'secondary' => '#d97706', 'accent' => '#fbbf24', 'text' => '#78350f', 'background' => '#fffbeb' ) ); // 根据情绪调整亮度 $base_scheme = isset($schemes[$industry]) ? $schemes[$industry] : $schemes['technology']; if ($mood === 'bright') { // 提高亮度 $base_scheme['primary'] = $this->adjust_brightness($base_scheme['primary'], 30); $base_scheme['background'] = '#ffffff'; } elseif ($mood === 'dark') { // 暗色模式 $base_scheme['primary'] = $this->adjust_brightness($base_scheme['primary'], -20); $base_scheme['background'] = '#1f2937'; $base_scheme['text'] = '#f9fafb'; } return $base_scheme; } /** * 调整颜色亮度 */ private function adjust_brightness($hex, $percent) { // 颜色亮度调整逻辑 // 这里简化实现,实际应用中需要完整的颜色处理函数 return $hex; } }
- <?php // includes/class-ad-templates.php /** * 广告模板管理类 */ class Ad_Templates { private $templates = array(); public function __construct() { $this->load_templates(); } /** * 加载所有模板 */ private function load_templates() { $this->templates = array( 'banner' => array( 'name' => '横幅广告', 'dimensions' => array( '728x90' => array('width' => 728, 'height' => 90), '970x250' => array('width' => 970, 'height' => 250), '320x100' => array('width' => 320, 'height' => 100) ), 'template_file' => 'banner-ad.php' ), 'square' => array( 'name' => '方形广告', 'dimensions' => array( '300x250' => array('width' => 300, 'height' => 250), '250x250' => array('width' => 250, 'height' => 250), '200x200' => array('width' => 200, 'height' => 200) ), 'template_file' => 'square-ad.php' ), 'vertical' => array( 'name' => '垂直广告', 'dimensions' => array( '300x600' => array('width' => 300, 'height' => 600), '160x600' => array('width' => 160, 'height' => 600) ), 'template_file' => 'vertical-ad.php' ) ); } /** * 渲染广告模板 * * @param string $type 广告类型 * @param array $data 广告数据 * @return string 渲染后的HTML */ public function render($type, $data) { if (!isset($this->templates[$type])) { return '<p>广告模板不存在</p>'; } $template_file = FAG_PLUGIN_DIR . 'templates/' . $this->templates[$type]['template_file']; if (!file_exists($template_file)) { return '<p>模板文件不存在</p>'; } // 提取变量 extract($data); // 开始输出缓冲 ob_start(); // 包含模板文件 include($template_file); // 获取缓冲内容 $output = ob_get_clean(); return $output; } /** * 获取所有可用模板 */ public function get_all_templates() { return $this->templates; } }
-
- <?php // public/shortcodes.php /** * 广告短代码渲染 * * @param array $atts 短代码属性 * @param string $content 短代码内容 * @return string 广告HTML */ function fag_render_ad_shortcode($atts, $content = null) { // 默认属性 $atts = shortcode_atts(array( 'type' => 'banner', 'size' => '728x90', 'title' => '智能广告', 'text' => '', 'image' => '', 'link' => '#', 'bg_color' => '', 'text_color' => '', 'button_text' => '了解更多', 'animation' => 'fade' ), $atts, 'flexible_ad'); // 获取广告生成器实例 $ad_generator = Flexible_Ad_Generator::get_instance(); // 如果没有提供文案,使用AI生成 if (empty($atts['text'])) { $ai_processor = new AI_Processor(); $keywords = !empty($content) ? $content : '优质服务'; $atts['text'] = $ai_processor->generate_ad_copy($keywords); } // 如果没有提供颜色,使用AI生成配色方案 if (empty($atts['bg_color']) || empty($atts['text_color'])) { $ai_processor = new AI_Processor(); $color_scheme = $ai_processor->generate_color_scheme('technology'); $atts['bg_color'] = $color_scheme['background']; $atts['text_color'] = $color_scheme['text']; } // 构建广告数据 $ad_data = array( 'title' => $atts['title'], 'text' => $atts['text'], 'image' => $atts['image'], 'link' => $atts['link'], 'bg_color' => $atts['bg_color'], 'text_color' => $atts['text_color'], 'button_text' => $atts['button_text'], 'animation' => $atts['animation'], 'dimensions' => $atts['size'] ); // 获取模板类实例 $templates = new Ad_Templates(); // 渲染广告 $ad_html = $templates->render($atts['type'], $ad_data); // 添加跟踪代码 $ad_id = uniqid('ad_'); $ad_html = '<div id="' . $ad_id . '" class="flexible-ad-container" data-ad-id="' . $ad_id . '">' . $ad_html . '</div>'; // 添加JavaScript跟踪 $ad_html .= '<script> document.addEventListener("DOMContentLoaded", function() { var adElement = document.getElementById("' . $ad_id . '"); if (adElement) { // 记录展示 var observer = new IntersectionObserver(function(entries) { entries.forEach(function(entry) { if (entry.isIntersecting) { // 发送展示统计(实际应用中应使用AJAX) console.log("广告展示: ' . $ad_id . '"); observer.unobserve(entry.target); } }); }, { threshold: 0.5 }); observer.observe(adElement); // 点击跟踪 adElement.addEventListener("click", function(e) { if (e.target.tagName === "A" || e.target.closest("a")) { console.log("广告点击: ' . $ad_id . '"); } }); } }); </script>'; return $ad_html; } // 注册短代码 add_shortcode('flexible_ad', 'fag_render_ad_shortcode');
- <?php /* templates/banner-ad.php */ /** * 横幅广告模板 */ // 解析尺寸 list($width, $height) = explode('x', $dimensions); ?> <div class="flexible-ad flexible-ad-banner" style="width: <?php echo $width; ?>px; height: <?php echo $height; ?>px; background-color: <?php echo $bg_color; ?>; color: <?php echo $text_color; ?>; position: relative; overflow: hidden; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); transition: transform 0.3s ease; margin: 10px auto;"> <?php if (!empty($image)): ?> <div class="ad-image" style="position: absolute; right: 20px; top: 50%; transform: translateY(-50%);"> <img src="<?php echo $image; ?>" alt="<?php echo esc_attr($title); ?>" echo $height - 20; ?>px; max-width: 150px; border-radius: 4px;"> </div> <?php endif; ?> <div class="ad-content" style="padding: 15px; max-width: <?php echo empty($image) ? '100%' : '70%'; ?>;"> <h3 class="ad-title" style="margin: 0 0 8px 0; font-size: 18px; font-weight: bold;"> <?php echo esc_html($title); ?> </h3> <p class="ad-text" style="margin: 0 0 12px 0; font-size: 14px; line-height: 1.4;"> <?php echo esc_html($text); ?> </p> <a href="<?php echo esc_url($link); ?>" class="ad-button" target="_blank" rel="noopener noreferrer" style="display: inline-block; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 8px 16px; border-radius: 4px; text-decoration: none; font-weight: bold; font-size: 14px; transition: all 0.3s ease;"> <?php echo esc_html($button_text); ?> </a> </div> <div class="ad-badge" style="position: absolute; top: 8px; right: 8px; background: rgba(0,0,0,0.1); color: <?php echo $text_color; ?>; padding: 2px 6px; border-radius: 3px; font-size: 10px;"> 广告 </div> </div> <style>.flexible-ad-banner:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0,0,0,0.15); } .flexible-ad-banner .ad-button:hover { transform: translateY(-1px); box-shadow: 0 4px 8px rgba(102, 126, 234, 0.4); }</style> ## 五、后台管理界面开发 ### 5.1 管理菜单和页面 <?php// admin/admin-pages.php /** 添加管理菜单 */ function fag_add_admin_menu() { add_menu_page( '柔性广告生成器', '广告生成器', 'manage_options', 'flexible-ad-generator', 'fag_render_admin_dashboard', 'dashicons-megaphone', 30 ); add_submenu_page( 'flexible-ad-generator', '创建新广告', '创建广告', 'manage_options', 'fag-create-ad', 'fag_render_create_ad_page' ); add_submenu_page( 'flexible-ad-generator', '广告库', '广告库', 'manage_options', 'fag-ad-library', 'fag_render_ad_library' ); add_submenu_page( 'flexible-ad-generator', 'AI设置', 'AI设置', 'manage_options', 'fag-ai-settings', 'fag_render_ai_settings' ); add_submenu_page( 'flexible-ad-generator', '统计数据', '统计数据', 'manage_options', 'fag-analytics', 'fag_render_analytics' ); }add_action('admin_menu', 'fag_add_admin_menu'); /** 渲染主仪表板 */ function fag_render_admin_dashboard() { ?> <div class="wrap fag-dashboard"> <h1><?php echo esc_html__('柔性广告素材智能生成器', 'flexible-ad-generator'); ?></h1> <div class="fag-stats-container" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin: 20px 0;"> <div class="fag-stat-card" style="background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);"> <h3>总广告数</h3> <p class="stat-number" style="font-size: 36px; font-weight: bold; color: #4CAF50;"><?php echo fag_get_total_ads_count(); ?></p> </div> <div class="fag-stat-card" style="background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);"> <h3>今日展示</h3> <p class="stat-number" style="font-size: 36px; font-weight: bold; color: #2196F3;"><?php echo fag_get_today_impressions(); ?></p> </div> <div class="fag-stat-card" style="background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);"> <h3>点击率</h3> <p class="stat-number" style="font-size: 36px; font-weight: bold; color: #FF9800;"><?php echo fag_get_ctr() . '%'; ?></p> </div> </div> <div class="fag-quick-actions" style="margin: 30px 0;"> <h2>快速操作</h2> <div style="display: flex; gap: 10px; margin-top: 15px;"> <a href="<?php echo admin_url('admin.php?page=fag-create-ad'); ?>" class="button button-primary" style="padding: 12px 24px;"> 创建新广告 </a> <a href="<?php echo admin_url('admin.php?page=fag-ad-library'); ?>" class="button" style="padding: 12px 24px;"> 查看广告库 </a> <a href="<?php echo admin_url('admin.php?page=fag-analytics'); ?>" class="button" style="padding: 12px 24px;"> 查看统计数据 </a> </div> </div> <div class="fag-recent-ads" style="background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);"> <h2>最近创建的广告</h2> <?php fag_render_recent_ads_table(); ?> </div> </div> <?php } /** 渲染创建广告页面 */ function fag_render_create_ad_page() { // 获取模板选项 $templates = new Ad_Templates(); $all_templates = $templates->get_all_templates(); // 处理表单提交 if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['fag_create_ad'])) { fag_handle_create_ad($_POST); } ?> <div class="wrap"> <h1>创建新广告</h1> <form method="POST" action="" id="fag-create-ad-form"> <?php wp_nonce_field('fag_create_ad', 'fag_nonce'); ?> <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 20px;"> <!-- 左侧:基本设置 --> <div> <h2>基本设置</h2> <table class="form-table"> <tr> <th scope="row"><label for="ad_title">广告标题</label></th> <td> <input type="text" id="ad_title" name="ad_title" class="regular-text" value="" required> <p class="description">广告的主要标题</p> </td> </tr> <tr> <th scope="row"><label for="ad_type">广告类型</label></th> <td> <select id="ad_type" name="ad_type" class="regular-text" onchange="fagUpdateDimensions()"> <?php foreach ($all_templates as $key => $template): ?> <option value="<?php echo esc_attr($key); ?>"> <?php echo esc_html($template['name']); ?> </option> <?php endforeach; ?> </select> </td> </tr> <tr> <th scope="row"><label for="ad_dimensions">广告尺寸</label></th> <td> <select id="ad_dimensions" name="ad_dimensions" class="regular-text"> <!-- 通过JavaScript动态填充 --> </select> </td> </tr> <tr> <th scope="row"><label for="target_url">目标链接</label></th> <td> <input type="url" id="target_url" name="target_url" class="regular-text" value="" required> </td> </tr> </table> <h2>AI智能生成</h2> <table class="form-table"> <tr> <th scope="row"><label for="ai_keywords">关键词</label></th> <td> <input type="text" id="ai_keywords" name="ai_keywords" class="regular-text" placeholder="例如:科技产品、优惠促销"> <button type="button" class="button" onclick="fagGenerateContent()"> 生成文案 </button> </td> </tr> <tr> <th scope="row"><label for="tone_style">语气风格</label></th> <td> <select id="tone_style" name="tone_style" class="regular-text"> <option value="professional">专业正式</option> <option value="casual">轻松随意</option> <option value="urgent">紧急促销</option> <option value="friendly">友好亲切</option> </select> </td> </tr> <tr> <th scope="row"><label for="color_scheme">配色方案</label></th> <td> <select id="color_scheme" name="color_scheme" class="regular-text"> <option value="auto">自动选择</option> <option value="technology">科技蓝</option> <option value="fashion">时尚粉</option> <option value="food">食品橙</option> <option value="finance">金融绿</option> </select> <button type="button" class="button" onclick="fagGenerateColors()"> 生成配色 </button> </td> </tr> </table> </div> <!-- 右侧:内容编辑和预览 --> <div> <h2>内容编辑</h2> <table class="form-table"> <tr> <th scope="row"><label for="ad_content">广告文案</label></th> <td> <textarea id="ad_content" name="ad_content" rows="4" class="large-text"></textarea> <p class="description">广告的详细描述文案</p> </td> </tr> <tr> <th scope="row"><label for="button_text">按钮文字</label></th> <td> <input type="text" id="button_text" name="button_text" class="regular-text" value="了解更多"> </td> </tr> <tr> <th scope="row"><label for="custom_image">自定义图片</label></th> <td> <input type="text" id="custom_image" name="custom_image" class="regular-text" placeholder="图片URL"> <button type="button" class="button" onclick="fagUploadImage()"> 上传图片 </button> </td> </tr> </table> <h2>实时预览</h2> <div id="ad-preview" style="border: 1px solid #ddd; padding: 20px; border-radius: 8px; min-height: 300px; background: #f9f9f9;"> <p style="text-align: center; color: #999;">选择广告类型和尺寸后,将显示预览</p> </div> <div style="margin-top: 20px; text-align: right;"> <button type="button" class="button" onclick="fagUpdatePreview()"> 更新预览 </button> <input type="submit" name="fag_create_ad" class="button button-primary" value="保存广告"> </div> </div> </div> </form> </div> <script> // 初始化尺寸选项 function fagUpdateDimensions() { const adType = document.getElementById('ad_type').value; const dimensionsSelect = document.getElementById('ad_dimensions'); // 清空现有选项 dimensionsSelect.innerHTML = ''; // 定义各类型的尺寸 const dimensions = { 'banner': ['728x90', '970x250', '320x100'], 'square': ['300x250', '250x250', '200x200'], 'vertical': ['300x600', '160x600'] }; if (dimensions[adType]) { dimensions[adType].forEach(size => { const option = document.createElement('option'); option.value = size; option.textContent = size; dimensionsSelect.appendChild(option); }); } // 更新预览 fagUpdatePreview(); } // 生成AI内容 function fagGenerateContent() { const keywords = document.getElementById('ai_keywords').value; const tone = document.getElementById('tone_style').value; if (!keywords) { alert('请输入关键词'); return; } // 显示加载状态 const contentField = document.getElementById('ad_content'); contentField.value = 'AI正在生成文案...'; // 模拟AI生成(实际应使用AJAX调用服务器端) setTimeout(() => { const aiResponses = { professional: `基于${keywords}的专业解决方案,提升您的业务效率。我们的专业团队为您提供卓越服务,确保最佳效果。`, casual: `发现${keywords}的乐趣!轻松上手,简单操作,立即体验不一样的感受。`, urgent: `限时优惠!${keywords}特别促销,机会难得,立即行动!`, friendly: `您好!我们为您准备了${keywords}的特别服务,希望能给您带来愉快的体验。` }; contentField.value = aiResponses[tone] || aiResponses.professional; fagUpdatePreview(); }, 1000); } // 更新预览 function fagUpdatePreview() { const previewDiv = document.getElementById('ad-preview'); const adType = document.getElementById('ad_type').value; const dimensions = document.getElementById('ad_dimensions').value; // 这里应该通过AJAX获取服务器端生成的预览 // 简化版:显示基本信息 previewDiv.innerHTML = ` <div style="text-align: center; padding: 20px;"> <h3>广告预览</h3> <p><strong>类型:</strong>${adType}</p> <p><strong>尺寸:</strong>${dimensions}</p> <p><strong>标题:</strong>${document.getElementById('ad_title').value || '未设置'}</p> <p><strong>文案:</strong>${document.getElementById('ad_content').value || '未设置'}</p> <div style="margin-top: 20px; padding: 10px; background: #e0e0e0; border-radius: 4px;"> 实际广告将根据设置动态生成 </div> </div> `; } // 初始化 document.addEventListener('DOMContentLoaded', function() { fagUpdateDimensions(); }); </script> <?php } /** 处理创建广告表单提交 */ function fag_handle_create_ad($data) { // 验证nonce if (!wp_verify_nonce($data['fag_nonce'], 'fag_create_ad')) { wp_die('安全验证失败'); } global $wpdb; $table_name = $wpdb->prefix . 'flexible_ads'; // 准备数据 $ad_data = array( 'title' => sanitize_text_field($data['ad_title']), 'ad_type' => sanitize_text_field($data['ad_type']), 'dimensions' => sanitize_text_field($data['ad_dimensions']), 'content' => wp_kses_post($data['ad_content']), 'target_url' => esc_url_raw($data['target_url']), 'button_text' => sanitize_text_field($data['button_text']), 'custom_image' => esc_url_raw($data['custom_image']), 'ai_keywords' => sanitize_text_field($data['ai_keywords']), 'tone_style' => sanitize_text_field($data['tone_style']), 'color_scheme' => sanitize_text_field($data['color_scheme']) ); // 保存到数据库 $result = $wpdb->insert( $table_name, $ad_data ); if ($result) { echo '<div class="notice notice-success"><p>广告创建成功!</p></div>'; // 生成短代码 $ad_id = $wpdb->insert_id; $shortcode = '[flexible_ad id="
-
柔性广告素材智能生成插件是一款专为网络传媒行业设计的WordPress扩展工具,它能够根据不同的广告位尺寸、目标受众和内容主题,自动生成适配的广告素材。通过智能算法,插件可以动态调整广告的文字、图片和布局,大幅提高广告投放效率和转化率。
在开始开发之前,请确保您的开发环境满足以下要求:
- WordPress 5.0+ 版本
- PHP 7.4+ 版本
- MySQL 5.6+ 或 MariaDB 10.1+
- 基本的HTML、CSS、JavaScript和PHP知识
<?php
/**
* 插件主文件 - flexible-ad-generator.php
*
* @package Flexible_Ad_Generator
* @version 1.0.0
*/
/*
Plugin Name: 柔性广告素材智能生成插件
Plugin URI: https://yourwebsite.com/flexible-ad-generator
Description: 智能生成适配不同广告位的柔性广告素材
Version: 1.0.0
Author: 您的名字
Author URI: https://yourwebsite.com
License: GPL v2 or later
Text Domain: flexible-ad-generator
*/
// 防止直接访问
if (!defined('ABSPATH')) {
exit;
}
// 定义插件常量
define('FAG_VERSION', '1.0.0');
define('FAG_PLUGIN_DIR', plugin_dir_path(__FILE__));
define('FAG_PLUGIN_URL', plugin_dir_url(__FILE__));
flexible-ad-generator/
├── flexible-ad-generator.php # 主插件文件
├── includes/ # 核心功能文件
│ ├── class-ad-generator.php # 广告生成器类
│ ├── class-ad-templates.php # 广告模板类
│ └── class-ai-processor.php # AI处理类
├── admin/ # 后台管理文件
│ ├── css/ # 后台样式
│ ├── js/ # 后台脚本
│ └── admin-pages.php # 管理页面
├── public/ # 前端文件
│ ├── css/ # 前端样式
│ ├── js/ # 前端脚本
│ └── shortcodes.php # 短代码处理
├── templates/ # 模板文件
│ ├── banner-ad.php # 横幅广告模板
│ ├── square-ad.php # 方形广告模板
│ └── vertical-ad.php # 垂直广告模板
└── assets/ # 静态资源
├── images/ # 默认图片
└── fonts/ # 字体文件
flexible-ad-generator/
├── flexible-ad-generator.php # 主插件文件
├── includes/ # 核心功能文件
│ ├── class-ad-generator.php # 广告生成器类
│ ├── class-ad-templates.php # 广告模板类
│ └── class-ai-processor.php # AI处理类
├── admin/ # 后台管理文件
│ ├── css/ # 后台样式
│ ├── js/ # 后台脚本
│ └── admin-pages.php # 管理页面
├── public/ # 前端文件
│ ├── css/ # 前端样式
│ ├── js/ # 前端脚本
│ └── shortcodes.php # 短代码处理
├── templates/ # 模板文件
│ ├── banner-ad.php # 横幅广告模板
│ ├── square-ad.php # 方形广告模板
│ └── vertical-ad.php # 垂直广告模板
└── assets/ # 静态资源
├── images/ # 默认图片
└── fonts/ # 字体文件
<?php
// includes/class-ad-generator.php
/**
* 广告生成器主类
*/
class Flexible_Ad_Generator {
private static $instance = null;
private $templates;
private $ai_processor;
/**
* 获取单例实例
*/
public static function get_instance() {
if (null === self::$instance) {
self::$instance = new self();
}
return self::$instance;
}
/**
* 构造函数
*/
private function __construct() {
$this->load_dependencies();
$this->init_hooks();
}
/**
* 加载依赖文件
*/
private function load_dependencies() {
require_once FAG_PLUGIN_DIR . 'includes/class-ad-templates.php';
require_once FAG_PLUGIN_DIR . 'includes/class-ai-processor.php';
$this->templates = new Ad_Templates();
$this->ai_processor = new AI_Processor();
}
/**
* 初始化WordPress钩子
*/
private function init_hooks() {
// 激活/停用插件时的操作
register_activation_hook(__FILE__, array($this, 'activate'));
register_deactivation_hook(__FILE__, array($this, 'deactivate'));
// 初始化
add_action('init', array($this, 'init'));
// 后台菜单
add_action('admin_menu', array($this, 'add_admin_menu'));
// 注册短代码
add_shortcode('flexible_ad', array($this, 'render_ad_shortcode'));
}
/**
* 插件激活时的操作
*/
public function activate() {
// 创建必要的数据库表
$this->create_database_tables();
// 设置默认选项
$this->set_default_options();
// 刷新重写规则
flush_rewrite_rules();
}
/**
* 创建数据库表
*/
private function create_database_tables() {
global $wpdb;
$charset_collate = $wpdb->get_charset_collate();
$table_name = $wpdb->prefix . 'flexible_ads';
$sql = "CREATE TABLE IF NOT EXISTS $table_name (
id mediumint(9) NOT NULL AUTO_INCREMENT,
title varchar(255) NOT NULL,
ad_type varchar(50) NOT NULL,
dimensions varchar(50) NOT NULL,
content text NOT NULL,
styles text,
ai_settings text,
impressions int(11) DEFAULT 0,
clicks int(11) DEFAULT 0,
created_at datetime DEFAULT CURRENT_TIMESTAMP,
updated_at datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
PRIMARY KEY (id)
) $charset_collate;";
require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
dbDelta($sql);
}
}
<?php
// includes/class-ad-generator.php
/**
* 广告生成器主类
*/
class Flexible_Ad_Generator {
private static $instance = null;
private $templates;
private $ai_processor;
/**
* 获取单例实例
*/
public static function get_instance() {
if (null === self::$instance) {
self::$instance = new self();
}
return self::$instance;
}
/**
* 构造函数
*/
private function __construct() {
$this->load_dependencies();
$this->init_hooks();
}
/**
* 加载依赖文件
*/
private function load_dependencies() {
require_once FAG_PLUGIN_DIR . 'includes/class-ad-templates.php';
require_once FAG_PLUGIN_DIR . 'includes/class-ai-processor.php';
$this->templates = new Ad_Templates();
$this->ai_processor = new AI_Processor();
}
/**
* 初始化WordPress钩子
*/
private function init_hooks() {
// 激活/停用插件时的操作
register_activation_hook(__FILE__, array($this, 'activate'));
register_deactivation_hook(__FILE__, array($this, 'deactivate'));
// 初始化
add_action('init', array($this, 'init'));
// 后台菜单
add_action('admin_menu', array($this, 'add_admin_menu'));
// 注册短代码
add_shortcode('flexible_ad', array($this, 'render_ad_shortcode'));
}
/**
* 插件激活时的操作
*/
public function activate() {
// 创建必要的数据库表
$this->create_database_tables();
// 设置默认选项
$this->set_default_options();
// 刷新重写规则
flush_rewrite_rules();
}
/**
* 创建数据库表
*/
private function create_database_tables() {
global $wpdb;
$charset_collate = $wpdb->get_charset_collate();
$table_name = $wpdb->prefix . 'flexible_ads';
$sql = "CREATE TABLE IF NOT EXISTS $table_name (
id mediumint(9) NOT NULL AUTO_INCREMENT,
title varchar(255) NOT NULL,
ad_type varchar(50) NOT NULL,
dimensions varchar(50) NOT NULL,
content text NOT NULL,
styles text,
ai_settings text,
impressions int(11) DEFAULT 0,
clicks int(11) DEFAULT 0,
created_at datetime DEFAULT CURRENT_TIMESTAMP,
updated_at datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
PRIMARY KEY (id)
) $charset_collate;";
require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
dbDelta($sql);
}
}
<?php
// includes/class-ai-processor.php
/**
* AI内容处理类
*/
class AI_Processor {
/**
* 根据关键词生成广告文案
*
* @param string $keywords 关键词
* @param string $tone 语气风格
* @param int $max_length 最大长度
* @return string 生成的文案
*/
public function generate_ad_copy($keywords, $tone = 'professional', $max_length = 200) {
// 这里可以集成第三方AI API,如OpenAI、百度AI等
// 以下为模拟实现
$tone_modifiers = array(
'professional' => array('高效', '专业', '可靠', '优质'),
'casual' => array('轻松', '简单', '有趣', '便捷'),
'urgent' => array('立即', '限时', '独家', '抢购')
);
$modifiers = isset($tone_modifiers[$tone]) ? $tone_modifiers[$tone] : $tone_modifiers['professional'];
$modifier = $modifiers[array_rand($modifiers)];
$action_verbs = array('发现', '体验', '获取', '享受', '探索', '开启');
$action_verb = $action_verbs[array_rand($action_verbs)];
$benefits = array('节省时间', '提高效率', '提升品质', '优化体验', '创造价值');
$benefit = $benefits[array_rand($benefits)];
// 构建广告文案
$copy = "{$modifier}{$keywords},{$action_verb}全新{$benefit}体验。";
// 如果文案太短,添加更多内容
if (strlen($copy) < $max_length * 0.5) {
$additional = array(
"立即行动,享受特别优惠!",
"限时特惠,机会不容错过!",
"专业团队,为您提供卓越服务。"
);
$copy .= " " . $additional[array_rand($additional)];
}
return mb_substr($copy, 0, $max_length);
}
/**
* 智能选择配色方案
*
* @param string $industry 行业类型
* @param string $mood 情绪氛围
* @return array 配色方案
*/
public function generate_color_scheme($industry, $mood = 'neutral') {
$schemes = array(
'technology' => array(
'primary' => '#2563eb',
'secondary' => '#1e40af',
'accent' => '#3b82f6',
'text' => '#1f2937',
'background' => '#f8fafc'
),
'fashion' => array(
'primary' => '#ec4899',
'secondary' => '#be185d',
'accent' => '#f472b6',
'text' => '#4c0519',
'background' => '#fdf2f8'
),
'food' => array(
'primary' => '#f59e0b',
'secondary' => '#d97706',
'accent' => '#fbbf24',
'text' => '#78350f',
'background' => '#fffbeb'
)
);
// 根据情绪调整亮度
$base_scheme = isset($schemes[$industry]) ? $schemes[$industry] : $schemes['technology'];
if ($mood === 'bright') {
// 提高亮度
$base_scheme['primary'] = $this->adjust_brightness($base_scheme['primary'], 30);
$base_scheme['background'] = '#ffffff';
} elseif ($mood === 'dark') {
// 暗色模式
$base_scheme['primary'] = $this->adjust_brightness($base_scheme['primary'], -20);
$base_scheme['background'] = '#1f2937';
$base_scheme['text'] = '#f9fafb';
}
return $base_scheme;
}
/**
* 调整颜色亮度
*/
private function adjust_brightness($hex, $percent) {
// 颜色亮度调整逻辑
// 这里简化实现,实际应用中需要完整的颜色处理函数
return $hex;
}
}
<?php
// includes/class-ai-processor.php
/**
* AI内容处理类
*/
class AI_Processor {
/**
* 根据关键词生成广告文案
*
* @param string $keywords 关键词
* @param string $tone 语气风格
* @param int $max_length 最大长度
* @return string 生成的文案
*/
public function generate_ad_copy($keywords, $tone = 'professional', $max_length = 200) {
// 这里可以集成第三方AI API,如OpenAI、百度AI等
// 以下为模拟实现
$tone_modifiers = array(
'professional' => array('高效', '专业', '可靠', '优质'),
'casual' => array('轻松', '简单', '有趣', '便捷'),
'urgent' => array('立即', '限时', '独家', '抢购')
);
$modifiers = isset($tone_modifiers[$tone]) ? $tone_modifiers[$tone] : $tone_modifiers['professional'];
$modifier = $modifiers[array_rand($modifiers)];
$action_verbs = array('发现', '体验', '获取', '享受', '探索', '开启');
$action_verb = $action_verbs[array_rand($action_verbs)];
$benefits = array('节省时间', '提高效率', '提升品质', '优化体验', '创造价值');
$benefit = $benefits[array_rand($benefits)];
// 构建广告文案
$copy = "{$modifier}{$keywords},{$action_verb}全新{$benefit}体验。";
// 如果文案太短,添加更多内容
if (strlen($copy) < $max_length * 0.5) {
$additional = array(
"立即行动,享受特别优惠!",
"限时特惠,机会不容错过!",
"专业团队,为您提供卓越服务。"
);
$copy .= " " . $additional[array_rand($additional)];
}
return mb_substr($copy, 0, $max_length);
}
/**
* 智能选择配色方案
*
* @param string $industry 行业类型
* @param string $mood 情绪氛围
* @return array 配色方案
*/
public function generate_color_scheme($industry, $mood = 'neutral') {
$schemes = array(
'technology' => array(
'primary' => '#2563eb',
'secondary' => '#1e40af',
'accent' => '#3b82f6',
'text' => '#1f2937',
'background' => '#f8fafc'
),
'fashion' => array(
'primary' => '#ec4899',
'secondary' => '#be185d',
'accent' => '#f472b6',
'text' => '#4c0519',
'background' => '#fdf2f8'
),
'food' => array(
'primary' => '#f59e0b',
'secondary' => '#d97706',
'accent' => '#fbbf24',
'text' => '#78350f',
'background' => '#fffbeb'
)
);
// 根据情绪调整亮度
$base_scheme = isset($schemes[$industry]) ? $schemes[$industry] : $schemes['technology'];
if ($mood === 'bright') {
// 提高亮度
$base_scheme['primary'] = $this->adjust_brightness($base_scheme['primary'], 30);
$base_scheme['background'] = '#ffffff';
} elseif ($mood === 'dark') {
// 暗色模式
$base_scheme['primary'] = $this->adjust_brightness($base_scheme['primary'], -20);
$base_scheme['background'] = '#1f2937';
$base_scheme['text'] = '#f9fafb';
}
return $base_scheme;
}
/**
* 调整颜色亮度
*/
private function adjust_brightness($hex, $percent) {
// 颜色亮度调整逻辑
// 这里简化实现,实际应用中需要完整的颜色处理函数
return $hex;
}
}
<?php
// includes/class-ad-templates.php
/**
* 广告模板管理类
*/
class Ad_Templates {
private $templates = array();
public function __construct() {
$this->load_templates();
}
/**
* 加载所有模板
*/
private function load_templates() {
$this->templates = array(
'banner' => array(
'name' => '横幅广告',
'dimensions' => array(
'728x90' => array('width' => 728, 'height' => 90),
'970x250' => array('width' => 970, 'height' => 250),
'320x100' => array('width' => 320, 'height' => 100)
),
'template_file' => 'banner-ad.php'
),
'square' => array(
'name' => '方形广告',
'dimensions' => array(
'300x250' => array('width' => 300, 'height' => 250),
'250x250' => array('width' => 250, 'height' => 250),
'200x200' => array('width' => 200, 'height' => 200)
),
'template_file' => 'square-ad.php'
),
'vertical' => array(
'name' => '垂直广告',
'dimensions' => array(
'300x600' => array('width' => 300, 'height' => 600),
'160x600' => array('width' => 160, 'height' => 600)
),
'template_file' => 'vertical-ad.php'
)
);
}
/**
* 渲染广告模板
*
* @param string $type 广告类型
* @param array $data 广告数据
* @return string 渲染后的HTML
*/
public function render($type, $data) {
if (!isset($this->templates[$type])) {
return '<p>广告模板不存在</p>';
}
$template_file = FAG_PLUGIN_DIR . 'templates/' . $this->templates[$type]['template_file'];
if (!file_exists($template_file)) {
return '<p>模板文件不存在</p>';
}
// 提取变量
extract($data);
// 开始输出缓冲
ob_start();
// 包含模板文件
include($template_file);
// 获取缓冲内容
$output = ob_get_clean();
return $output;
}
/**
* 获取所有可用模板
*/
public function get_all_templates() {
return $this->templates;
}
}
<?php
// includes/class-ad-templates.php
/**
* 广告模板管理类
*/
class Ad_Templates {
private $templates = array();
public function __construct() {
$this->load_templates();
}
/**
* 加载所有模板
*/
private function load_templates() {
$this->templates = array(
'banner' => array(
'name' => '横幅广告',
'dimensions' => array(
'728x90' => array('width' => 728, 'height' => 90),
'970x250' => array('width' => 970, 'height' => 250),
'320x100' => array('width' => 320, 'height' => 100)
),
'template_file' => 'banner-ad.php'
),
'square' => array(
'name' => '方形广告',
'dimensions' => array(
'300x250' => array('width' => 300, 'height' => 250),
'250x250' => array('width' => 250, 'height' => 250),
'200x200' => array('width' => 200, 'height' => 200)
),
'template_file' => 'square-ad.php'
),
'vertical' => array(
'name' => '垂直广告',
'dimensions' => array(
'300x600' => array('width' => 300, 'height' => 600),
'160x600' => array('width' => 160, 'height' => 600)
),
'template_file' => 'vertical-ad.php'
)
);
}
/**
* 渲染广告模板
*
* @param string $type 广告类型
* @param array $data 广告数据
* @return string 渲染后的HTML
*/
public function render($type, $data) {
if (!isset($this->templates[$type])) {
return '<p>广告模板不存在</p>';
}
$template_file = FAG_PLUGIN_DIR . 'templates/' . $this->templates[$type]['template_file'];
if (!file_exists($template_file)) {
return '<p>模板文件不存在</p>';
}
// 提取变量
extract($data);
// 开始输出缓冲
ob_start();
// 包含模板文件
include($template_file);
// 获取缓冲内容
$output = ob_get_clean();
return $output;
}
/**
* 获取所有可用模板
*/
public function get_all_templates() {
return $this->templates;
}
}
<?php
// public/shortcodes.php
/**
* 广告短代码渲染
*
* @param array $atts 短代码属性
* @param string $content 短代码内容
* @return string 广告HTML
*/
function fag_render_ad_shortcode($atts, $content = null) {
// 默认属性
$atts = shortcode_atts(array(
'type' => 'banner',
'size' => '728x90',
'title' => '智能广告',
'text' => '',
'image' => '',
'link' => '#',
'bg_color' => '',
'text_color' => '',
'button_text' => '了解更多',
'animation' => 'fade'
), $atts, 'flexible_ad');
// 获取广告生成器实例
$ad_generator = Flexible_Ad_Generator::get_instance();
// 如果没有提供文案,使用AI生成
if (empty($atts['text'])) {
$ai_processor = new AI_Processor();
$keywords = !empty($content) ? $content : '优质服务';
$atts['text'] = $ai_processor->generate_ad_copy($keywords);
}
// 如果没有提供颜色,使用AI生成配色方案
if (empty($atts['bg_color']) || empty($atts['text_color'])) {
$ai_processor = new AI_Processor();
$color_scheme = $ai_processor->generate_color_scheme('technology');
$atts['bg_color'] = $color_scheme['background'];
$atts['text_color'] = $color_scheme['text'];
}
// 构建广告数据
$ad_data = array(
'title' => $atts['title'],
'text' => $atts['text'],
'image' => $atts['image'],
'link' => $atts['link'],
'bg_color' => $atts['bg_color'],
'text_color' => $atts['text_color'],
'button_text' => $atts['button_text'],
'animation' => $atts['animation'],
'dimensions' => $atts['size']
);
// 获取模板类实例
$templates = new Ad_Templates();
// 渲染广告
$ad_html = $templates->render($atts['type'], $ad_data);
// 添加跟踪代码
$ad_id = uniqid('ad_');
$ad_html = '<div id="' . $ad_id . '" class="flexible-ad-container" data-ad-id="' . $ad_id . '">' . $ad_html . '</div>';
// 添加JavaScript跟踪
$ad_html .= '<script>
document.addEventListener("DOMContentLoaded", function() {
var adElement = document.getElementById("' . $ad_id . '");
if (adElement) {
// 记录展示
var observer = new IntersectionObserver(function(entries) {
entries.forEach(function(entry) {
if (entry.isIntersecting) {
// 发送展示统计(实际应用中应使用AJAX)
console.log("广告展示: ' . $ad_id . '");
observer.unobserve(entry.target);
}
});
}, { threshold: 0.5 });
observer.observe(adElement);
// 点击跟踪
adElement.addEventListener("click", function(e) {
if (e.target.tagName === "A" || e.target.closest("a")) {
console.log("广告点击: ' . $ad_id . '");
}
});
}
});
</script>';
return $ad_html;
}
// 注册短代码
add_shortcode('flexible_ad', 'fag_render_ad_shortcode');
<?php
// public/shortcodes.php
/**
* 广告短代码渲染
*
* @param array $atts 短代码属性
* @param string $content 短代码内容
* @return string 广告HTML
*/
function fag_render_ad_shortcode($atts, $content = null) {
// 默认属性
$atts = shortcode_atts(array(
'type' => 'banner',
'size' => '728x90',
'title' => '智能广告',
'text' => '',
'image' => '',
'link' => '#',
'bg_color' => '',
'text_color' => '',
'button_text' => '了解更多',
'animation' => 'fade'
), $atts, 'flexible_ad');
// 获取广告生成器实例
$ad_generator = Flexible_Ad_Generator::get_instance();
// 如果没有提供文案,使用AI生成
if (empty($atts['text'])) {
$ai_processor = new AI_Processor();
$keywords = !empty($content) ? $content : '优质服务';
$atts['text'] = $ai_processor->generate_ad_copy($keywords);
}
// 如果没有提供颜色,使用AI生成配色方案
if (empty($atts['bg_color']) || empty($atts['text_color'])) {
$ai_processor = new AI_Processor();
$color_scheme = $ai_processor->generate_color_scheme('technology');
$atts['bg_color'] = $color_scheme['background'];
$atts['text_color'] = $color_scheme['text'];
}
// 构建广告数据
$ad_data = array(
'title' => $atts['title'],
'text' => $atts['text'],
'image' => $atts['image'],
'link' => $atts['link'],
'bg_color' => $atts['bg_color'],
'text_color' => $atts['text_color'],
'button_text' => $atts['button_text'],
'animation' => $atts['animation'],
'dimensions' => $atts['size']
);
// 获取模板类实例
$templates = new Ad_Templates();
// 渲染广告
$ad_html = $templates->render($atts['type'], $ad_data);
// 添加跟踪代码
$ad_id = uniqid('ad_');
$ad_html = '<div id="' . $ad_id . '" class="flexible-ad-container" data-ad-id="' . $ad_id . '">' . $ad_html . '</div>';
// 添加JavaScript跟踪
$ad_html .= '<script>
document.addEventListener("DOMContentLoaded", function() {
var adElement = document.getElementById("' . $ad_id . '");
if (adElement) {
// 记录展示
var observer = new IntersectionObserver(function(entries) {
entries.forEach(function(entry) {
if (entry.isIntersecting) {
// 发送展示统计(实际应用中应使用AJAX)
console.log("广告展示: ' . $ad_id . '");
observer.unobserve(entry.target);
}
});
}, { threshold: 0.5 });
observer.observe(adElement);
// 点击跟踪
adElement.addEventListener("click", function(e) {
if (e.target.tagName === "A" || e.target.closest("a")) {
console.log("广告点击: ' . $ad_id . '");
}
});
}
});
</script>';
return $ad_html;
}
// 注册短代码
add_shortcode('flexible_ad', 'fag_render_ad_shortcode');
<?php
/* templates/banner-ad.php */
/**
* 横幅广告模板
*/
// 解析尺寸
list($width, $height) = explode('x', $dimensions);
?>
<div class="flexible-ad flexible-ad-banner"
style="width: <?php echo $width; ?>px; height: <?php echo $height; ?>px;
background-color: <?php echo $bg_color; ?>;
color: <?php echo $text_color; ?>;
position: relative;
overflow: hidden;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
transition: transform 0.3s ease;
margin: 10px auto;">
<?php if (!empty($image)): ?>
<div class="ad-image" style="position: absolute; right: 20px; top: 50%; transform: translateY(-50%);">
<img src="<?php echo $image; ?>" alt="<?php echo esc_attr($title); ?>"
<?php
/* templates/banner-ad.php */
/**
* 横幅广告模板
*/
// 解析尺寸
list($width, $height) = explode('x', $dimensions);
?>
<div class="flexible-ad flexible-ad-banner"
style="width: <?php echo $width; ?>px; height: <?php echo $height; ?>px;
background-color: <?php echo $bg_color; ?>;
color: <?php echo $text_color; ?>;
position: relative;
overflow: hidden;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
transition: transform 0.3s ease;
margin: 10px auto;">
<?php if (!empty($image)): ?>
<div class="ad-image" style="position: absolute; right: 20px; top: 50%; transform: translateY(-50%);">
<img src="<?php echo $image; ?>" alt="<?php echo esc_attr($title); ?>"
echo $height - 20; ?>px; max-width: 150px; border-radius: 4px;">
</div>
<?php endif; ?>
<div class="ad-content" style="padding: 15px; max-width: <?php echo empty($image) ? '100%' : '70%'; ?>;">
<h3 class="ad-title" style="margin: 0 0 8px 0; font-size: 18px; font-weight: bold;">
<?php echo esc_html($title); ?>
</h3>
<p class="ad-text" style="margin: 0 0 12px 0; font-size: 14px; line-height: 1.4;">
<?php echo esc_html($text); ?>
</p>
<a href="<?php echo esc_url($link); ?>"
class="ad-button"
target="_blank"
rel="noopener noreferrer"
style="display: inline-block;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 8px 16px;
border-radius: 4px;
text-decoration: none;
font-weight: bold;
font-size: 14px;
transition: all 0.3s ease;">
<?php echo esc_html($button_text); ?>
</a>
</div>
<div class="ad-badge" style="position: absolute; top: 8px; right: 8px;
background: rgba(0,0,0,0.1); color: <?php echo $text_color; ?>;
padding: 2px 6px; border-radius: 3px; font-size: 10px;">
广告
</div>
</div>
<style>
.flexible-ad-banner:hover {
transform: translateY(-2px);
box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}
.flexible-ad-banner .ad-button:hover {
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(102, 126, 234, 0.4);
}
</style>
## 五、后台管理界面开发
### 5.1 管理菜单和页面
<?php
// admin/admin-pages.php
/**
- 添加管理菜单
*/
function fag_add_admin_menu() {
add_menu_page(
'柔性广告生成器',
'广告生成器',
'manage_options',
'flexible-ad-generator',
'fag_render_admin_dashboard',
'dashicons-megaphone',
30
);
add_submenu_page(
'flexible-ad-generator',
'创建新广告',
'创建广告',
'manage_options',
'fag-create-ad',
'fag_render_create_ad_page'
);
add_submenu_page(
'flexible-ad-generator',
'广告库',
'广告库',
'manage_options',
'fag-ad-library',
'fag_render_ad_library'
);
add_submenu_page(
'flexible-ad-generator',
'AI设置',
'AI设置',
'manage_options',
'fag-ai-settings',
'fag_render_ai_settings'
);
add_submenu_page(
'flexible-ad-generator',
'统计数据',
'统计数据',
'manage_options',
'fag-analytics',
'fag_render_analytics'
);
}
add_action('admin_menu', 'fag_add_admin_menu');
/**
- 渲染主仪表板
*/
function fag_render_admin_dashboard() {
?>
<div class="wrap fag-dashboard">
<h1><?php echo esc_html__('柔性广告素材智能生成器', 'flexible-ad-generator'); ?></h1>
<div class="fag-stats-container" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin: 20px 0;">
<div class="fag-stat-card" style="background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
<h3>总广告数</h3>
<p class="stat-number" style="font-size: 36px; font-weight: bold; color: #4CAF50;"><?php echo fag_get_total_ads_count(); ?></p>
</div>
<div class="fag-stat-card" style="background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
<h3>今日展示</h3>
<p class="stat-number" style="font-size: 36px; font-weight: bold; color: #2196F3;"><?php echo fag_get_today_impressions(); ?></p>
</div>
<div class="fag-stat-card" style="background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
<h3>点击率</h3>
<p class="stat-number" style="font-size: 36px; font-weight: bold; color: #FF9800;"><?php echo fag_get_ctr() . '%'; ?></p>
</div>
</div>
<div class="fag-quick-actions" style="margin: 30px 0;">
<h2>快速操作</h2>
<div style="display: flex; gap: 10px; margin-top: 15px;">
<a href="<?php echo admin_url('admin.php?page=fag-create-ad'); ?>" class="button button-primary" style="padding: 12px 24px;">
创建新广告
</a>
<a href="<?php echo admin_url('admin.php?page=fag-ad-library'); ?>" class="button" style="padding: 12px 24px;">
查看广告库
</a>
<a href="<?php echo admin_url('admin.php?page=fag-analytics'); ?>" class="button" style="padding: 12px 24px;">
查看统计数据
</a>
</div>
</div>
<div class="fag-recent-ads" style="background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
<h2>最近创建的广告</h2>
<?php fag_render_recent_ads_table(); ?>
</div>
</div>
<?php
}
/**
- 渲染创建广告页面
*/
function fag_render_create_ad_page() {
// 获取模板选项
$templates = new Ad_Templates();
$all_templates = $templates->get_all_templates();
// 处理表单提交
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['fag_create_ad'])) {
fag_handle_create_ad($_POST);
}
?>
<div class="wrap">
<h1>创建新广告</h1>
<form method="POST" action="" id="fag-create-ad-form">
<?php wp_nonce_field('fag_create_ad', 'fag_nonce'); ?>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 20px;">
<!-- 左侧:基本设置 -->
<div>
<h2>基本设置</h2>
<table class="form-table">
<tr>
<th scope="row"><label for="ad_title">广告标题</label></th>
<td>
<input type="text" id="ad_title" name="ad_title" class="regular-text"
value="" required>
<p class="description">广告的主要标题</p>
</td>
</tr>
<tr>
<th scope="row"><label for="ad_type">广告类型</label></th>
<td>
<select id="ad_type" name="ad_type" class="regular-text" onchange="fagUpdateDimensions()">
<?php foreach ($all_templates as $key => $template): ?>
<option value="<?php echo esc_attr($key); ?>">
<?php echo esc_html($template['name']); ?>
</option>
<?php endforeach; ?>
</select>
</td>
</tr>
<tr>
<th scope="row"><label for="ad_dimensions">广告尺寸</label></th>
<td>
<select id="ad_dimensions" name="ad_dimensions" class="regular-text">
<!-- 通过JavaScript动态填充 -->
</select>
</td>
</tr>
<tr>
<th scope="row"><label for="target_url">目标链接</label></th>
<td>
<input type="url" id="target_url" name="target_url" class="regular-text"
value="" required>
</td>
</tr>
</table>
<h2>AI智能生成</h2>
<table class="form-table">
<tr>
<th scope="row"><label for="ai_keywords">关键词</label></th>
<td>
<input type="text" id="ai_keywords" name="ai_keywords" class="regular-text"
placeholder="例如:科技产品、优惠促销">
<button type="button" class="button" onclick="fagGenerateContent()">
生成文案
</button>
</td>
</tr>
<tr>
<th scope="row"><label for="tone_style">语气风格</label></th>
<td>
<select id="tone_style" name="tone_style" class="regular-text">
<option value="professional">专业正式</option>
<option value="casual">轻松随意</option>
<option value="urgent">紧急促销</option>
<option value="friendly">友好亲切</option>
</select>
</td>
</tr>
<tr>
<th scope="row"><label for="color_scheme">配色方案</label></th>
<td>
<select id="color_scheme" name="color_scheme" class="regular-text">
<option value="auto">自动选择</option>
<option value="technology">科技蓝</option>
<option value="fashion">时尚粉</option>
<option value="food">食品橙</option>
<option value="finance">金融绿</option>
</select>
<button type="button" class="button" onclick="fagGenerateColors()">
生成配色
</button>
</td>
</tr>
</table>
</div>
<!-- 右侧:内容编辑和预览 -->
<div>
<h2>内容编辑</h2>
<table class="form-table">
<tr>
<th scope="row"><label for="ad_content">广告文案</label></th>
<td>
<textarea id="ad_content" name="ad_content" rows="4" class="large-text"></textarea>
<p class="description">广告的详细描述文案</p>
</td>
</tr>
<tr>
<th scope="row"><label for="button_text">按钮文字</label></th>
<td>
<input type="text" id="button_text" name="button_text" class="regular-text"
value="了解更多">
</td>
</tr>
<tr>
<th scope="row"><label for="custom_image">自定义图片</label></th>
<td>
<input type="text" id="custom_image" name="custom_image" class="regular-text"
placeholder="图片URL">
<button type="button" class="button" onclick="fagUploadImage()">
上传图片
</button>
</td>
</tr>
</table>
<h2>实时预览</h2>
<div id="ad-preview" style="border: 1px solid #ddd; padding: 20px; border-radius: 8px; min-height: 300px; background: #f9f9f9;">
<p style="text-align: center; color: #999;">选择广告类型和尺寸后,将显示预览</p>
</div>
<div style="margin-top: 20px; text-align: right;">
<button type="button" class="button" onclick="fagUpdatePreview()">
更新预览
</button>
<input type="submit" name="fag_create_ad" class="button button-primary" value="保存广告">
</div>
</div>
</div>
</form>
</div>
<script>
// 初始化尺寸选项
function fagUpdateDimensions() {
const adType = document.getElementById('ad_type').value;
const dimensionsSelect = document.getElementById('ad_dimensions');
// 清空现有选项
dimensionsSelect.innerHTML = '';
// 定义各类型的尺寸
const dimensions = {
'banner': ['728x90', '970x250', '320x100'],
'square': ['300x250', '250x250', '200x200'],
'vertical': ['300x600', '160x600']
};
if (dimensions[adType]) {
dimensions[adType].forEach(size => {
const option = document.createElement('option');
option.value = size;
option.textContent = size;
dimensionsSelect.appendChild(option);
});
}
// 更新预览
fagUpdatePreview();
}
// 生成AI内容
function fagGenerateContent() {
const keywords = document.getElementById('ai_keywords').value;
const tone = document.getElementById('tone_style').value;
if (!keywords) {
alert('请输入关键词');
return;
}
// 显示加载状态
const contentField = document.getElementById('ad_content');
contentField.value = 'AI正在生成文案...';
// 模拟AI生成(实际应使用AJAX调用服务器端)
setTimeout(() => {
const aiResponses = {
professional: `基于${keywords}的专业解决方案,提升您的业务效率。我们的专业团队为您提供卓越服务,确保最佳效果。`,
casual: `发现${keywords}的乐趣!轻松上手,简单操作,立即体验不一样的感受。`,
urgent: `限时优惠!${keywords}特别促销,机会难得,立即行动!`,
friendly: `您好!我们为您准备了${keywords}的特别服务,希望能给您带来愉快的体验。`
};
contentField.value = aiResponses[tone] || aiResponses.professional;
fagUpdatePreview();
}, 1000);
}
// 更新预览
function fagUpdatePreview() {
const previewDiv = document.getElementById('ad-preview');
const adType = document.getElementById('ad_type').value;
const dimensions = document.getElementById('ad_dimensions').value;
// 这里应该通过AJAX获取服务器端生成的预览
// 简化版:显示基本信息
previewDiv.innerHTML = `
<div style="text-align: center; padding: 20px;">
<h3>广告预览</h3>
<p><strong>类型:</strong>${adType}</p>
<p><strong>尺寸:</strong>${dimensions}</p>
<p><strong>标题:</strong>${document.getElementById('ad_title').value || '未设置'}</p>
<p><strong>文案:</strong>${document.getElementById('ad_content').value || '未设置'}</p>
<div style="margin-top: 20px; padding: 10px; background: #e0e0e0; border-radius: 4px;">
实际广告将根据设置动态生成
</div>
</div>
`;
}
// 初始化
document.addEventListener('DOMContentLoaded', function() {
fagUpdateDimensions();
});
</script>
<?php
}
/**
- 处理创建广告表单提交
*/
function fag_handle_create_ad($data) {
// 验证nonce
if (!wp_verify_nonce($data['fag_nonce'], 'fag_create_ad')) {
wp_die('安全验证失败');
}
global $wpdb;
$table_name = $wpdb->prefix . 'flexible_ads';
// 准备数据
$ad_data = array(
'title' => sanitize_text_field($data['ad_title']),
'ad_type' => sanitize_text_field($data['ad_type']),
'dimensions' => sanitize_text_field($data['ad_dimensions']),
'content' => wp_kses_post($data['ad_content']),
'target_url' => esc_url_raw($data['target_url']),
'button_text' => sanitize_text_field($data['button_text']),
'custom_image' => esc_url_raw($data['custom_image']),
'ai_keywords' => sanitize_text_field($data['ai_keywords']),
'tone_style' => sanitize_text_field($data['tone_style']),
'color_scheme' => sanitize_text_field($data['color_scheme'])
);
// 保存到数据库
$result = $wpdb->insert(
$table_name,
$ad_data
);
if ($result) {
echo '<div class="notice notice-success"><p>广告创建成功!</p></div>';
// 生成短代码
$ad_id = $wpdb->insert_id;
$shortcode = '[flexible_ad id="


