شكل البداية/المتعلقة بالمعرفة/ووردبريس/تفاصيل المحتوى

من الصفر: دليل خطوة بخطوة لتطوير موضوع WordPress مخصص.

قراءة 3 دقائق
2026-03-13
2026-06-06
2,258
أنا أحصل على عمولة عند التسوق عبر الروابط أدناه، ولا يُضاف أي تكلفة عليك.

تطوير قالب ووردبريس مخصص هو أفضل طريقة لتحويل أفكارك إلى واقع على الإنترنت والسيطرة الكاملة على مظهر الموقع ووظائفه. على عكس القوالب الجاهزة، يتيح لك القالب المخصص البدء من الصفر وبناء موقع فريد يلبي احتياجاتك أو احتياجات عملائك بشكل دقيق. قد يبدو هذا العملية مربكًا في البداية، ولكن مع اتباع المعايير الرسمية لووردبريس والخطوات المحددة، يمكنك إكمالها بسهولة. سيقوم هذا المقال بتوجيهك خلال العملية بأكملها، من إنشاء الملفات الأساسية إلى تنفيذ الوظائف الأساسية للموقع.

الاستعدادات وإعداد البيئة.

قبل كتابة أول سطر من الكود، تحتاج إلى بيئة تطوير مناسبة وتخطيط واضح للمشروع.

إنشاء بيئة التطوير المحلية

أولاً، يجب عليك إنشاء بيئة خادم PHP على جهاز الكمبيوتر الخاص بك. يُنصح باستخدام حزم برمجية متكاملة مثل XAMPP أو MAMP أو Local by Flywheel، حيث تقوم هذه الأدوات بتثبيت Apache وMySQL وPHP بنقرة واحدة، مما يوفر عليك عناء التكوينات المعقدة. على سبيل المثال، بعد تثبيت XAMPP، تكون ملفات موقعك الإلكتروني عادةً موجودة في المجلد الرئيسي للبرنامج.htdocsداخل المجلد. هنا، يمكنك إنشاء مجلد جديد، على سبيل المثال…my-custom-themeسيصبح هذا المجلد المجلد الرئيسي (الجذري) لموضوعك.

القراءة الموصى بها تعلم تطوير موضوعات ووردبريس من الصفر: دليل أساسي لإنشاء مواقع ويب مخصصة.。

تخطيط هيكل مشروع الموضوع (Theme Project Structure Planning)

يحتوي موضوع ووردبريس القياسي على ملفين أساسيين على الأقل:style.cssوindex.phpلكن قبل بدء المشروع، يُنصح بتخطيط هيكل مجلدات واضح وقابل للتوسعة. قد يكون هيكل الموضوع الحديث النموذجي كما يلي:

خادم ووردبريس من شركة UltaHost
ضمان استرداد المال خلال 30 يومًا، عرض نطاق ترددي وقواعد بيانات غير محدودين، حماية مجانية ضد هجمات DDoS، خصم 50% عند الشراء لمدة 3 سنوات (السعة المتاحة: 501–4 تيرابايت).
شعار شركة UltaHost صفحة الوصول 
my-custom-theme/
├── style.css          // 主样式表，包含主题信息头
├── index.php          // 主模板文件
├── functions.php      // 主题功能与函数文件
├── header.php         // 头部模板
├── footer.php         // 底部模板
├── sidebar.php        // 侧边栏模板
├── page.php           // 页面模板
├── single.php         // 文章页模板
├── archive.php        // 文章归档页模板
├── 404.php            // 404错误页模板
├── search.php         // 搜索结果页模板
├── assets/            // 静态资源目录
│   ├── css/           // 样式文件
│   ├── js/            // 脚本文件
│   └── images/        // 图片资源
└── templates/         // 可选的模板部件目录

امتلاك هيكل جيد يساعد في تنظيم الكود وصيانته.

إنشاء ملف الموضوعات الأساسية

هذه هي الأسس الأساسية لبناء أي قالب (theme)؛ فرؤوس الملفات (file headers) تخبر ووردبريس (WordPress) بأن هذا القالب صالح للاستخدام.

تعريف قائمة أنماط الموضوع (Theme Style Sheet)

style.cssهذا هو “بطاقة الهوية” للقالب (الموضوع)، وكتلة التعليقات في الجزء العلوي (رأس معلومات القالب) ضرورية للغاية. يعتمد ووردبريس على هذه المعلومات لتحديد القالب وعرضه في الخلفية. قم بإنشاؤها.style.cssقم بفتح الملف وأدخل المحتوى التالي:

/*
Theme Name: 我的自定义主题
Theme URI: https://example.com/my-custom-theme
Author: 你的名字
Author URI: https://yourwebsite.com
Description: 这是一个为了学习从零开始开发而创建的自定义WordPress主题。
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-custom-theme
*/

من بينها،Text Domainيُستخدم هذا المعرف لأغراض التدويل (i18n)، وهو المعرف الفريد لموضوعك، وعادةً ما يكون مطابقًا لاسم مجلد الموضوع نفسه. بعد هذا الكتلة التعليقية، يمكنك البدء في كتابة أنماط CSS الخاصة

القراءة الموصى بها دليل تطوير موضوعات ووردبريس: دليل عملي كامل من المبتدئين إلى الخبراء.。

إنشاء ملف قالب أساسي

index.phpهذا هو القالب الافتراضي للعودة إلى الصفحة الأصلية في جميع الصفحات. إنه الأساسي، ولكن يمكننا البدء من هيكل HTML بسيط. أولاً، قم بإنشاء…header.phpالملف يُستخدم لتخزين رأس المستند (الجزء الأول من المستند).<!DOCTYPE html>إلى الفتح<body>(الجزء المتعلق بالتسميات/العلامات) وfooter.phpيُستخدم لتخزين العلامات الترميزية المغلقة ومحتوى القائمة السفلية (الfooter).

header.phpمثال على ذلك:

<!DOCTYPE html>
<html no numeric noise key 1006>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
</head>
<body no numeric noise key 1003>
    <header>
        <h1><a href="/ar/</?php echo esc_url( home_url( '/' ) ); ?>"></a></h1>
        <p></p>
    </header>

لقد لاحظت أنه تم استخدام…wp_head()الخطافات (Hooks) ضرورية لإضافة السكريبتات والأنماط إلى جوهر WordPress والإضافات (Plugins) والقوالب (Themes).

استضافة.كوم استضافة مشتركة
أداء عالٍ مع وحدات المعالجة المركزية AMD EPYC، ووحدات تخزين NVMe SSD وLiteSpeed، ودعم داخلي متخصص على مدار الساعة طوال أيام الأسبوع، وتدابير أمنية متقدمة بما في ذلك SSL، وقوة الغاشمة، والحماية من البرامج الضارة والحماية من DDoS، وتوفير ما يصل إلى 731 تيرابايت 4 تيرابايت
شعار الاستضافة.كوم صفحة الوصول

footer.phpمثال على ذلك:

    <footer>
        <p>©  . All rights reserved.</p>
    </footer>
    
</body>
</html>

تم استخدام… هنا.wp_footer()خطاف.

الآن، الخاص بك…index.phpيمكن أن يصبح الأمر بسيطًا للغاية:

القراءة الموصى بها دليل شامل لتطوير مواقع ووردبريس: بناء مواقع متخصصة من الصفر。

<main>
    
            <article>
                <h2></h2>
                <div></div>
            </article>
        
        <p><?php _e( 'Sorry, no posts matched your criteria.', 'my-custom-theme' ); ?></p>
    
</main>

؟ &gt;

يستخدم هذا القالب الدورة الأساسية في ووردبريس (The Loop) لعرض قائمة المقالات.

إدخال الميزات والمحتوى الديناميكي

موضوع حقيقي لا يقتصر فقط على صفحات ثابتة؛ بل يحتاج إلى التفاعل مع نواة ووردبريس (WordPress core)، وتحميل الموارد اللازمة، وتنفيذ وظائف ديناميكية.

الاستضافة المشتركة InterServer
استضافة مشتركة $2.50 دولار أمريكي في الشهر، الشهر الأول $0.1 دولار أمريكي الرمز الترويجي tryinterserver، 461 نص برمجي للتطبيقات السحابية، تثبيت بنقرة واحدة.
انتر سيرفر LOGO صفحة الوصول

كتابة ملف لدالة الموضوع (Theme Function File)

functions.phpالموضوع الخاص بك هو “الدماغ”، ويُستخدم لإضافة الميزات المختلفة مثل القوائم، الشرائط الجانبية، تحميل الأنماط، والبرامج النصية (السكريبتات)، وغيرها. قم بإنشاء هذا الملف وابدأ في إضافة الميز

<?php
// 主题设置
function my_custom_theme_setup() {
    // 让WordPress管理文档标题
    add_theme_support( 'title-tag' );
    // 启用文章和评论的RSS feed链接
    add_theme_support( 'automatic-feed-links' );
    // 启用文章缩略图（特色图像）
    add_theme_support( 'post-thumbnails' );
    // 注册一个导航菜单
    register_nav_menus( array(
        'primary' => __( '主导航菜单', 'my-custom-theme' ),
    ) );
}
add_action( 'after_setup_theme', 'my_custom_theme_setup' );

// 注册小工具区域（侧边栏）
function my_custom_theme_widgets_init() {
    register_sidebar( array(
        'name'          =&gt; __( '主侧边栏', 'my-custom-theme' ),
        'id'            =&gt; 'sidebar-1',
        'description'   =&gt; __( '在此添加小工具。', 'my-custom-theme' ),
        'before_widget' =&gt; '<section id="%1$s" class="widget %2$s">',
        'after_widget'  =&gt; '</section>',
        'before_title'  =&gt; '<h2 class="widget-title">',
        'after_title'   =&gt; '</h2>',
    ) );
}
add_action( 'widgets_init', 'my_custom_theme_widgets_init' );

add_theme_support()الدالة مستخدمة لتفعيل ميزة المواضيع (themes).register_nav_menus()وregister_sidebar()يتم التسجيل لكل من قائمة التنقل ومنطقة الأدوات الصغيرة بشكل منفصل.

تحميل الأنماط والسكريبتات

الطريقة الصحيحة لتحميل الموارد هي رفع ملفات الأنماط (stylesheets) وملفات جافا سكريبت (JavaScript) من خلال…wp_enqueue_scriptsالخطوط المنتظرة في القائمة… في انتظار تنفيذها.functions.phpأضف إلى النص:

function my_custom_theme_scripts() {
    // 加载主样式表
    wp_enqueue_style( 'my-custom-theme-style', get_stylesheet_uri() );

// 加载自定义JavaScript文件
    wp_enqueue_script( 'my-custom-theme-navigation', get_template_directory_uri() . '/assets/js/navigation.js', array(), '1.0.0', true );

// 如果使用评论功能，加载评论回复脚本（仅当需要时）
    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
        wp_enqueue_script( 'comment-reply' );
    }
}
add_action( 'wp_enqueue_scripts', 'my_custom_theme_scripts' );

get_stylesheet_uri()الحصول عليهstyle.cssرابط الموقع (URL):get_template_directory_uri()الحصول على عنوان URL لمجلد المواضيع.

إنشاء هيكل مستويات للقوالب

يستخدم ووردبريس مستويات القوالب (templates) لتحديد الملف القالب الذي سيتم استخدامه لصفحة معينة. إن إنشاء ملفات قوالب متخصصة يمكن أن يجعل عرض المحتوى أكثر دقة ومرونة.

إنشاء قوالب لأنواع مختلفة من المحتوى

يجب عليك إنشاء قوالب متخصصة لأنواع مختلفة من الصفحات. على سبيل المثال:
* single.phpيُستخدم لعرض مقال واحد فقط.
* page.phpيُستخدم لعرض صفحة واحدة فقط.
* archive.phpيُستخدم لعرض التصنيفات، والتسميات، والمؤلفين، والتواريخ، وغيرها من محتويات صفحات الأرشيف.
* search.phpيُستخدم لعرض نتائج البحث.
* 404.phpيُستخدم لعرض صفحة “لم يتم العثور على شيء”.

أساسيsingle.phpقد يكون الأمر كما يلي:

<main>
    <?php while ( have_posts() ) : the_post(); ?>
        <article id="post-<?php the_ID(); ?>" no numeric noise key 1012>
            <header>
                <h1></h1>
                <div>
                    |
                </div>
            </header>
            
                <div>
                    <?php the_post_thumbnail(); ?>
                </div>
            
            <div>
                
            </div>
            <footer>
                &lt;?php the_tags( &#039;标签: &#039;, &#039;, &#039;, &#039;<br />' ); ?&gt;
            </footer>
        </article>
    
</main>

؟ &gt;

هذا القالب يستخدم… (The template uses…)the_post_thumbnail()لعرض الصور المميزة، بالإضافة إلى…comments_template()لتحميل منطقة التعليقات.

استخدام مكونات القوالب لتحقيق التعديدية (التجزئة) في البرمجة.

لزيادة إمكانية إعادة استخدام الكود بشكل أكبر، يمكن استخراج الأجزاء المتكررة في الصفحة، مثل معلومات المقالات وعناصر قوائم المقالات، وتحويلها إلى أجزاء قالب (Template Parts). على سبيل المثال، يمكن إنشاء…template-parts/content.phpالملف، ثم…index.phpأوarchive.phpيتم استخدام ذلك داخل حلقة (loop).get_template_part( 'template-parts/content' );قم بتنفيذ الدعوة المناسبة لاستخدام هذه الوظيفة؛ هذا سيساعد في الحفاظ على بساطة ملف قالبك الرئيسي.

الملخصات

من خلال الخطوات المذكورة أعلاه، لقد أكملت تطوير قالب ووردبريس مخصص بسيط ولكنه يحتوي على وظائف كاملة. تضمنت هذه العملية جميع الجوانب الرئيسية، بدءًا من إعداد البيئة المناسبة، مرورًا بإنشاء الملفات الأساسية، وإضافة ميزات ووردبريس، وصولاً إلى بناء هيكل القوالب. تذكر أن تطوير القوالب هو عملية تدريجية؛ يمكنك البدء بأبسط الميزات ثم إضافة ميزات أكثر تعقيدًا تدريجيًا، مثل أنواع المقالات المخصصة، خيارات تخصيص القالب، والتصميم الاستجابي، وما إلى ذلك. الأهم من ذلك كله هو اتباع معايير ووردبريس للكود وأفضل الممارسات، حتى تضمن أمان قالبك وكفاءته وسهولة صيانته. الآن، قم بنسخ مجلد القالب الخاص بك إلى المجلد الرئيسي لتثبيت ووردبريس.wp-content/themes/في الواجهة الخلفية، يمكنك العثور عليه تحت قسم “المظهر” (Appearance) ثم “الثيمات” (Themes) وتفعيله.

الأسئلة الشائعة الأسئلة المتداولة

ما هي المعرفة الأساسية بلغات البرمجة المطلوبة لتطوير قوالب ووردبريس (WordPress themes)؟

لتطوير مواقع ووردبريس (WordPress)، من الضروري إتقان لغات البرمجة التالية: HTML، CSS، و PHP. تُستخدم لغة HTML لبناء هيكل الصفحات، بينما تُستخدم لغة CSS لتصميم الأنماط الجمالية للصفحات. أما لغة PHP فهي لغة البرمجة على جانب الخادم في ووردبريس، وتُستخدم لمعالجة العمليات المنطقية واستعلامات قواعد البيانات وإنشاء المحتوى الديناميكي. بالإضافة إلى ذلك، فإن معرفة أساسيات لغة JavaScript مفيدة أيضًا لإضافة وظائف تفاعلية إلى الموقع.

لماذا يجب استخدام دوال `get_header()` و `get_footer()`؟

get_header()وget_footer()هذه علامات قوالب خاصة ببرنامج ووردبريس (WordPress)، وتُستخدم لتضمين محتويات أو عناصر معينة داخل الصفحات.header.phpوfooter.phpاستخدم هذه الدوال بدلاً من استخدامها مباشرةً.includeالجملة (Statement) هي جوهر آلية مستويات القوالب والمواضيع الفرعية في ووردبريس (WordPress). فهي تسمح للمواضيع الفرعية بتغيير محتوى الجزء العلوي (الهيدر) والجزء السفلي (الفوتر) من القالب الأصلي عن طريق إنشاء ملفات

كيف يمكنني جعل موقعي الإلكتروني يدعم عدة لغات (التدويل)؟

يجب عليك استخدام دوال الترجمة الدولية (i18n) في ووردبريس لتغليف جميع سلاسل النصوص التي يتم عرضها في القالب (الثيمة). الطريقة الرئيسية للقيام بذلك هي استخدام دالة `wpgettext()` أو دوالها المشتقة.__()、_e()وظائف مثل… وأيضًا في…style.cssقم بتعيين القيم الصحيحة في المكان المناسب.Text Domainثم، استخدم أداة مثل Poedit لإنشاء الملفات المطلوبة..potقم بترجمة ملف القوالب، ويمكن للمترجم استخدامه لإنشاء المحتوى باللغة المطلوبة (مثل…).zh_CN.poو.moأخيرًا،functions.phpإنه متاح في جميع أنحاء الصين.load_theme_textdomain()تحميل الترجمة للوظيفة.

بعد الانتهاء من تطوير الموضوع، كيف يمكن اختبار توافقه؟

من المهم جدًا إجراء اختبارات شاملة قبل نشر أو نشر الموضوع في البيئة الإنتاجية. أولاً، يجب إجراء اختبارات استجابة سريعة (responsive tests) على متصفحات مختلفة (Chrome، Firefox، Safari، Edge) وأجهزة متنوعة (أجهزة سطح المكتب، أجهزة اللوحي، الهواتف المحمولة). ثانيًا، يجب إجراء الاختبارات باستخدام إعدادات مختلفة لبيئة WordPress، مثل تفعيل/تعطيل الإضافات المختلفة، واستخدام أنواع مقالات وأدوات مختلفة. بالإضافة إلى ذلك، يمكن استخدام إضافة فحص المواضيع الرسمية لـ WordPress (Theme Check) لمسح موضوعك والتأكد من أنه يتبع أحدث معايير الكود وأفضل الممارسات في WordPress.

ما التالي، ما التالي؟

إذا كنت تقوم بإنشاء موقع ووردبريس أو تحسينه، فإننا ننصحك بمواصلة القراءة حول تحسين الأداء وتكوين المكونات الإضافية وتخصيص المظاهر.

القراءة الموسعة والمعرفة العملية

فيما يلي بعض الموضوعات ذات الصلة بموضوع هذه المقالة وهي مناسبة لمزيد من القراءة المتعمقة. وغالباً ما يكون من الأفضل إعطاء الأولوية للبدء بالمقال الأقرب إلى مشكلتك الحالية ثم التوسع تدريجياً إلى المواضيع المحيطة.

الوسوم