• February 10, 2026

    สร้าง “Theme Framework” พื้นฐานที่เบาที่สุด (เรียกได้ว่าเป็นธีมลูกครึ่ง Minimal + Magazine) ให้คุณได้ โดยใช้โครงสร้างที่สะอาดที่สุด และใส่ระบบที่คุณต้องการ (ดึงรูปอัตโนมัติ + นับยอดวิว) ลงไปในตัวเลย

    เนื่องจากผมเป็น AI ผมไม่สามารถส่งไฟล์ .zip ให้ดาวน์โหลดโดยตรงได้ แต่ผมจะ “วางโครงสร้างโค้ด” ที่สำคัญที่สุด 3 ไฟล์ที่คุณต้องใช้ในการสร้างธีมนี้ครับ


    1. ไฟล์ functions.php (หัวใจของธีม)

    ไฟล์นี้จะรวมระบบ Auto Image ที่เราทำสำเร็จแล้ว และ ระบบนับยอดวิว แบบไม่ใช้ปลั๊กอินครับ

    PHP

    <?php
    // 1. รองรับฟีเจอร์พื้นฐาน
    function insurance_minimal_setup() {
        add_theme_support( 'title-tag' );
        add_theme_support( 'post-thumbnails' );
        add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list', 'gallery', 'caption' ) );
    }
    add_action( 'after_setup_theme', 'insurance_minimal_setup' );
    
    // 2. ระบบดึงภาพอัตโนมัติ + Default Image (ตัวที่คุณชอบ)
    function get_insurance_image($post_id) {
        global $wpdb;
        $content = $wpdb->get_var( $wpdb->prepare( "SELECT post_content FROM $wpdb->posts WHERE ID = %d", $post_id ) );
        if ( preg_match('/<img.+?src=[\'"]([^\'"]+)[\'"].*?>/i', $content, $matches) ) {
            return $matches[1];
        }
        return 'https://insurancethai.net/defualt.png'; 
    }
    
    // 3. ระบบนับยอดวิว (Post Views) แบบเบาหวิว
    function set_post_views($postID) {
        $count_key = 'post_views_count';
        $count = get_post_meta($postID, $count_key, true);
        if($count==''){
            $count = 0;
            delete_post_meta($postID, $count_key);
            add_post_meta($postID, $count_key, '0');
        }else{
            $count++;
            update_post_meta($postID, $count_key, $count);
        }
    }
    
    function get_post_views($postID){
        $count_key = 'post_views_count';
        $count = get_post_meta($postID, $count_key, true);
        if($count==''){
            delete_post_meta($postID, $count_key);
            add_post_meta($postID, $count_key, '0');
            return "0 Views";
        }
        return $count.' Views';
    }
    

    2. ไฟล์ index.php (โครงสร้างหน้าแรกแบบ Magazine)

    ไฟล์นี้จะเน้นความเร็ว โหลดเฉพาะสิ่งที่จำเป็น

    PHP

    <?php get_header(); ?>
    
    <main class="site-main">
        <div class="container">
            <div class="post-grid">
                <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
                    <article class="card">
                        <div class="card-image">
                            <a href="<?php the_permalink(); ?>">
                                <?php 
                                $img = get_insurance_image(get_the_ID());
                                echo '<img src="'.esc_url($img).'" alt="'.get_the_title().'">';
                                ?>
                            </a>
                        </div>
                        <div class="card-content">
                            <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                            <span class="views-count"><i class="fa fa-eye"></i> <?php echo get_post_views(get_the_ID()); ?></span>
                        </div>
                    </article>
                <?php endwhile; endif; ?>
            </div>
        </div>
    </main>
    
    <?php get_footer(); ?>
    

    3. ไฟล์ style.css (ดีไซน์เบาหวิว)

    เน้นใช้ CSS Grid เพื่อความทันสมัยและไม่ต้องโหลด Library ภายนอก

    CSS

    /*
    Theme Name: InsuranceThai Minimal
    Author: Gemini AI
    Version: 1.0
    */
    
    body { font-family: 'Tahoma', sans-serif; line-height: 1.6; color: #333; margin: 0; }
    .container { max-width: 1100px; margin: auto; padding: 20px; }
    
    /* Magazine Grid */
    .post-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        gap: 20px;
    }
    
    .card { border: 1px solid #eee; border-radius: 8px; overflow: hidden; transition: 0.3s; }
    .card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
    
    .card-image img { width: 100%; height: 200px; object-fit: cover; }
    .card-content { padding: 15px; }
    .card-content h2 { font-size: 1.2rem; margin: 0 0 10px; }
    .views-count { font-size: 0.8rem; color: #888; }
    

    ขั้นตอนการใช้งาน:

    1. เข้าไปที่โฟลเดอร์ wp-content/themes/
    2. สร้างโฟลเดอร์ใหม่ชื่อ insurance-minimal
    3. สร้างไฟล์ตามชื่อข้างบนแล้วเอา Code ไปวาง
    4. ที่สำคัญที่สุด: ในหน้า single.php อย่าลืมใส่คำสั่ง set_post_views(get_the_ID()); ไว้ที่บรรทัดบนสุด เพื่อให้มันนับยอดวิวทุกครั้งที่มีคนอ่านครับ


เวอไนน์ไอคอร์ส

ประหยัดเวลากว่า 100 เท่า!






เวอไนน์เว็บไซต์⚡️
สร้างเว็บไซต์ ดูแลเว็บไซต์

Categories