RANKFINDER

Download Sticky Contact Banner Pro v2.0

🚀 Sticky Contact Banner Pro

Version 2.0.0

Smart Scroll | Top Padding 30px | Session Memory

📦 วิธีที่ 1: Download ไฟล์ ZIP สำเร็จรูป

คลิกปุ่มด้านล่างเพื่อดาวน์โหลด (ใช้ได้กับ Browser ที่รองรับ)

📝 วิธีที่ 2: Copy Code แล้วสร้างไฟล์เอง (แนะนำ)

วิธีนี้รับประกันว่าจะได้ไฟล์แน่นอน

สร้างโฟลเดอร์

สร้างโฟลเดอร์ชื่อ sticky-contact-banner-pro บนเครื่องคุณ

สร้างไฟล์ PHP

สร้างไฟล์ sticky-contact-banner-pro.php แล้ว copy โค้ดด้านล่างไปใส่

Zip โฟลเดอร์

คลิกขวาที่โฟลเดอร์ > Compress/Zip เพื่อสร้างไฟล์ .zip

Upload ใน WordPress

นำไฟล์ .zip ไป upload ใน WordPress > Plugins > Add New > Upload

<?php
/**
 * Plugin Name: Sticky Contact Banner Pro
 * Plugin URI: https://your-website.com/
 * Description: Smart sticky banner with scroll detection and 30px top padding
 * Version: 2.0.0
 * Author: Your Name
 * License: GPL v2 or later
 * Text Domain: sticky-contact-banner-pro
 */

// Prevent direct access
if (!defined('ABSPATH')) {
    exit;
}

// Define constants
define('SCBP_PLUGIN_URL', plugin_dir_url(__FILE__));
define('SCBP_PLUGIN_PATH', plugin_dir_path(__FILE__));

class StickyContactBannerPro {
    
    private $options;
    
    public function __construct() {
        add_action('init', array($this, 'init'));
        add_action('admin_menu', array($this, 'add_admin_menu'));
        add_action('admin_init', array($this, 'register_settings'));
        add_action('wp_footer', array($this, 'display_banner'));
        add_action('wp_head', array($this, 'add_custom_css'));
    }
    
    public function init() {
        $this->options = get_option('scbp_settings', $this->get_default_options());
    }
    
    private function get_default_options() {
        return array(
            'enabled' => '1',
            'text' => 'คลิกตรงนี้ ไลน์สอบถามสินค้าได้เลย',
            'line_id' => '@Tumtook',
            'bg_color' => '#00c300',
            'text_color' => '#ffffff',
            'button_bg' => '#ff0000',
            'button_text_color' => '#ffffff',
            'button_text' => 'ฟ.สั่ง Email',
            'button_link' => '#',
            'catalog_text' => 'กลุ่มงานรถ Email เพื่อขึ้น Catalog',
            'catalog_link' => '#',
            'position' => 'top',
            'scroll_trigger' => '300',
            'mobile_height' => '60',
            'desktop_height' => '80',
            'z_index' => '9999',
            'always_show' => '0'
        );
    }
    
    public function add_custom_css() {
        if ($this->options['enabled'] !== '1') return;
        
        // Add padding to body when banner is at top
        if ($this->options['position'] === 'top' && $this->options['always_show'] === '1') {
            $desktop_padding = intval($this->options['desktop_height']) + 30;
            $mobile_padding = intval($this->options['mobile_height']) + 30;
            ?>
            <style>
                body { padding-top: <?php echo $desktop_padding; ?>px !important; }
                @media (max-width: 768px) {
                    body { padding-top: <?php echo $mobile_padding; ?>px !important; }
                }
            </style>
            <?php
        }
    }
    
    public function add_admin_menu() {
        add_menu_page(
            'Sticky Banner Pro',
            'Sticky Banner Pro',
            'manage_options',
            'sticky-contact-banner-pro',
            array($this, 'admin_page'),
            'dashicons-megaphone',
            100
        );
    }
    
    public function register_settings() {
        register_setting('scbp_settings_group', 'scbp_settings', array($this, 'sanitize_settings'));
    }
    
    public function sanitize_settings($input) {
        $sanitized = array();
        $sanitized['enabled'] = isset($input['enabled']) ? '1' : '0';
        $sanitized['text'] = sanitize_text_field($input['text']);
        $sanitized['line_id'] = sanitize_text_field($input['line_id']);
        $sanitized['bg_color'] = sanitize_hex_color($input['bg_color']);
        $sanitized['text_color'] = sanitize_hex_color($input['text_color']);
        $sanitized['button_bg'] = sanitize_hex_color($input['button_bg']);
        $sanitized['button_text_color'] = sanitize_hex_color($input['button_text_color']);
        $sanitized['button_text'] = sanitize_text_field($input['button_text']);
        $sanitized['button_link'] = esc_url_raw($input['button_link']);
        $sanitized['catalog_text'] = sanitize_text_field($input['catalog_text']);
        $sanitized['catalog_link'] = esc_url_raw($input['catalog_link']);
        $sanitized['position'] = in_array($input['position'], array('top', 'bottom')) ? $input['position'] : 'top';
        $sanitized['scroll_trigger'] = absint($input['scroll_trigger']);
        $sanitized['mobile_height'] = absint($input['mobile_height']);
        $sanitized['desktop_height'] = absint($input['desktop_height']);
        $sanitized['z_index'] = absint($input['z_index']);
        $sanitized['always_show'] = isset($input['always_show']) ? '1' : '0';
        return $sanitized;
    }
    
    public function admin_page() {
        ?>
        <div class="wrap">
            <h1><?php echo esc_html(get_admin_page_title()); ?></h1>
            <form method="post" action="options.php">
                <?php
                settings_fields('scbp_settings_group');
                $options = $this->options;
                ?>
                <table class="form-table">
                    <tr>
                        <th scope="row">Enable Banner</th>
                        <td>
                            <input type="checkbox" name="scbp_settings[enabled]" value="1" <?php checked($options['enabled'], '1'); ?> />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Position</th>
                        <td>
                            <select name="scbp_settings[position]">
                                <option value="top" <?php selected($options['position'], 'top'); ?>>Top (30px padding)</option>
                                <option value="bottom" <?php selected($options['position'], 'bottom'); ?>>Bottom</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Always Show</th>
                        <td>
                            <input type="checkbox" name="scbp_settings[always_show]" value="1" <?php checked($options['always_show'], '1'); ?> />
                            <p class="description">ถ้าไม่เลือก Banner จะแสดงเมื่อ scroll</p>
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Scroll Trigger (px)</th>
                        <td>
                            <input type="number" name="scbp_settings[scroll_trigger]" value="<?php echo esc_attr($options['scroll_trigger']); ?>" />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Main Text</th>
                        <td>
                            <input type="text" name="scbp_settings[text]" value="<?php echo esc_attr($options['text']); ?>" class="regular-text" />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Line ID</th>
                        <td>
                            <input type="text" name="scbp_settings[line_id]" value="<?php echo esc_attr($options['line_id']); ?>" />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Background Color</th>
                        <td>
                            <input type="text" name="scbp_settings[bg_color]" value="<?php echo esc_attr($options['bg_color']); ?>" />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Text Color</th>
                        <td>
                            <input type="text" name="scbp_settings[text_color]" value="<?php echo esc_attr($options['text_color']); ?>" />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Button Background</th>
                        <td>
                            <input type="text" name="scbp_settings[button_bg]" value="<?php echo esc_attr($options['button_bg']); ?>" />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Button Text</th>
                        <td>
                            <input type="text" name="scbp_settings[button_text]" value="<?php echo esc_attr($options['button_text']); ?>" />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Desktop Height (px)</th>
                        <td>
                            <input type="number" name="scbp_settings[desktop_height]" value="<?php echo esc_attr($options['desktop_height']); ?>" />
                        </td>
                    </tr>
                    <tr>
                        <th scope="row">Mobile Height (px)</th>
                        <td>
                            <input type="number" name="scbp_settings[mobile_height]" value="<?php echo esc_attr($options['mobile_height']); ?>" />
                        </td>
                    </tr>
                </table>
                <?php submit_button(); ?>
            </form>
        </div>
        <?php
    }
    
    public function display_banner() {
        if ($this->options['enabled'] !== '1') return;
        
        $position = $this->options['position'] === 'top' ? 'top:30px' : 'bottom:0';
        $initial = $this->options['always_show'] === '1' ? '' : 'transform:translateY(' . ($this->options['position'] === 'top' ? '-120%' : '120%') . ');opacity:0';
        ?>
        <div id="scbp-banner" style="position:fixed;left:0;right:0;<?php echo $position; ?>;background:<?php echo esc_attr($this->options['bg_color']); ?>;color:<?php echo esc_attr($this->options['text_color']); ?>;z-index:<?php echo esc_attr($this->options['z_index']); ?>;height:<?php echo esc_attr($this->options['desktop_height']); ?>px;display:flex;align-items:center;transition:all 0.4s;<?php echo $initial; ?>" data-trigger="<?php echo esc_attr($this->options['scroll_trigger']); ?>" data-position="<?php echo esc_attr($this->options['position']); ?>">
            <div style="width:100%;max-width:1200px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center;">
                <a href="<?php echo esc_url($this->options['catalog_link']); ?>" style="background:rgba(255,255,255,0.2);color:<?php echo esc_attr($this->options['text_color']); ?>;padding:8px 16px;border-radius:20px;text-decoration:none;"><?php echo esc_html($this->options['catalog_text']); ?></a>
                <div style="flex:1;text-align:center;">
                    <span><?php echo esc_html($this->options['text']); ?></span>
                    <span style="font-size:24px;">👆</span>
                    <span>(Line ID <?php echo esc_html($this->options['line_id']); ?>)</span>
                </div>
                <a href="<?php echo esc_url($this->options['button_link']); ?>" style="background:<?php echo esc_attr($this->options['button_bg']); ?>;color:<?php echo esc_attr($this->options['button_text_color']); ?>;padding:10px 24px;border-radius:25px;text-decoration:none;"><?php echo esc_html($this->options['button_text']); ?></a>
            </div>
        </div>
        <style>
        @media(max-width:768px){
            #scbp-banner{height:<?php echo esc_attr($this->options['mobile_height']); ?>px!important}
            #scbp-banner a:first-child{display:none}
        }
        </style>
        <script>
        (function(){
            var b=document.getElementById('scbp-banner');
            if(!b)return;
            var t=parseInt(b.getAttribute('data-trigger'))||300;
            var p=b.getAttribute('data-position');
            var v=false;
            var a=<?php echo $this->options['always_show'] === '1' ? 'true' : 'false'; ?>;
            
            if(a){b.style.transform='translateY(0)';b.style.opacity='1';v=true;}
            
            function h(){
                if(a)return;
                var s=window.pageYOffset||document.documentElement.scrollTop;
                if(s>t&&!v){
                    b.style.transform='translateY(0)';
                    b.style.opacity='1';
                    v=true;
                }else if(s<=t&&v){
                    b.style.transform='translateY('+(p==='top'?'-120%':'120%')+')';
                    b.style.opacity='0';
                    v=false;
                }
            }
            
            if(!a){window.addEventListener('scroll',h);h();}
        })();
        </script>
        <?php
    }
}

// Initialize plugin
new StickyContactBannerPro();

// Activation hook
register_activation_hook(__FILE__, function() {
    $defaults = array(
        'enabled' => '1',
        'text' => 'คลิกตรงนี้ ไลน์สอบถามสินค้าได้เลย',
        'line_id' => '@Tumtook',
        'bg_color' => '#00c300',
        'text_color' => '#ffffff',
        'button_bg' => '#ff0000',
        'button_text_color' => '#ffffff',
        'button_text' => 'ฟ.สั่ง Email',
        'button_link' => '#',
        'catalog_text' => 'กลุ่มงานรถ Email เพื่อขึ้น Catalog',
        'catalog_link' => '#',
        'position' => 'top',
        'scroll_trigger' => '300',
        'mobile_height' => '60',
        'desktop_height' => '80',
        'z_index' => '9999',
        'always_show' => '0'
    );
    
    if (!get_option('scbp_settings')) {
        add_option('scbp_settings', $defaults);
    }
});
🎯

Smart Scroll

แสดงเมื่อ scroll ลงมา

📏

30px Padding

ไม่ชิดขอบบน

📱

Responsive

รองรับทุกหน้าจอ

🔒

Secure

ปลอดภัย 100%

'1', 'text' => 'คลิกตรงนี้ ไลน์สอบถามสินค้าได้เลย', 'line_id' => '@Tumtook', 'bg_color' => '#00c300', 'text_color' => '#ffffff', 'button_bg' => '#ff0000', 'button_text_color' => '#ffffff', 'button_text' => 'ฟ.สั่ง Email', 'button_link' => '#', 'catalog_text' => 'กลุ่มงานรถ Email เพื่อขึ้น Catalog', 'catalog_link' => '#', 'position' => 'top', 'scroll_trigger' => '300', 'mobile_height' => '60', 'desktop_height' => '80', 'z_index' => '9999', 'always_show' => '0' ); if (!get_option('scbp_settings')) { add_option('scbp_settings', $defaults); } });`; try { // Create ZIP file const zip = new JSZip(); const folder = zip.folder("sticky-contact-banner-pro"); // Add PHP file folder.file("sticky-contact-banner-pro.php", phpCode); // Add readme.txt const readme = `=== Sticky Contact Banner Pro === Contributors: yourname Tags: sticky, banner, contact, responsive Requires at least: 5.0 Tested up to: 6.4 Stable tag: 2.0.0 License: GPLv2 or later Smart sticky banner with 30px top padding and scroll detection. == Installation == 1. Upload the plugin files to /wp-content/plugins/ 2. Activate the plugin 3. Configure in Sticky Banner Pro menu == Changelog == = 2.0.0 = * Initial release with smart features`; folder.file("readme.txt", readme); // Generate ZIP zip.generateAsync({type:"blob"}) .then(function(content) { // Create download link const url = URL.createObjectURL(content); const a = document.createElement('a'); a.href = url; a.download = "sticky-contact-banner-pro.zip"; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); // Show status document.getElementById('downloadStatus').style.display = 'block'; setTimeout(() => { document.getElementById('downloadStatus').style.display = 'none'; }, 5000); }); } catch(error) { alert('เกิดข้อผิดพลาด: ' + error.message + '\n\nกรุณาใช้วิธีที่ 2 (Copy Code) แทน'); } }

Contact us

สอบถาม / สังซื้อบริการ / จองคอร์สเรียน