المفاهيم الأساسية والأسس في تطوير مواقع ووردبريس (WordPress Themes)
قبل البدء في كتابة أي كود، من المهم جدًا فهم المفاهيم الأساسية لمواضيع ووردبريس (WordPress themes). موضوع ووردبريس في جوهره عبارة عن مجموعة من الملفات التي تحدد طريقة عرض الموقع من الناحية الأمامية، بدءًا من تخطيط الصفحات والألوان وحتى أنماط الخطوط. يتبع هذا الموضوع هيكل مجلدات معين، ويتفاعل مع النظام الأساسي لووردبريس لعرض المحتوى بشكل ديناميكي.
الجوهر الأساسي لهذا الموضوع هو ملفات القوالب (templates). هذه الملفات المبنية على لغة PHP تحدد طريقة عرض أنواع مختلفة من المحتويات. على سبيل المثال،index.phpهذا الملف هو القالب الرئيسي، ويتم استخدامه كخيار افتراضي عندما لا يجد ووردبريس قالبًا أكثر تحديدًا. عادةً ما يتم تنسيق الصفحة الرئيسية باستخدام هذا القالب.home.phpأوfront-page.phpالتحكم في كل مقال على حدة…single.phpالتحكم يتم عبر… بينما يتم إعداد الصفحة بواسطة…page.phpالتحكم.
مستند رئيسي آخر هوstyle.cssليس فقط أنه يحتوي على جميع أنماط القوالب الخاصة بالموضوع، بل يعمل أيضًا كـ “بطاقة هوية” لهذا الموضوع. يحتوي قسم التعليقات في بداية الملف على بيانات مهمة مثل اسم الموضوع، والمؤلف، والوصف، ورقم الإصدار، وغيرها من المعstyle.cssلن يتمكن ووردبريس من التعرف على قالبك (التيمبليت) الخاص. الهيكل الأساسي لقالب ووردبريس هو كالتالي:
القراءة الموصى بها دليل شامل لتطوير مواقع ووردبريس: من المبادئ الأساسية إلى الخبرة العملية。
/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme
Author: 开发者名称
Author URI: https://example.com
Description: 这是一个为学习而创建的WordPress主题。
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-first-theme
*/
إنشاء هيكل ملفات الموضوع الأول الخاص بك.
لإنشاء موضوع متكامل الوظائف وواضح التنظيم، من الضروري اتباع طرق معينة لتنظيم المجلدات والملفات. يمكن بدء بناء موضوع أساسي ولكنه كامل باستخدام عدد قليل من الملفات الرئيسية.
بالإضافة إلى ما ذكر أعلاه…index.phpوstyle.cssبالإضافة إلى ذلك، يحتوي موضوع قوي (متين) عادةً على الملفات الرئيسية التالية:
1. functions.phpهذا هو “الدماغ” الخاص بالموضوع (theme’s “brain”)، ويُستخدم لإضافة ميزات الموضوع نفسه، وقائمة التسجيل، والشريط الجانبي (منطقة الويدجتات – Widget area)، وتحميل السكريبتات والأنماط، وما إلى ذلك. ليس ملف قالب (template file)، ولكن يجب أن يت
2. header.phpالهيكل HTML الذي يحتوي على رأس وثائق الموقع الإلكتروني، وقائمة التنقل، وبداية الصفحة.
3. footer.phpيتضمن معلومات حقوق النشر في أسفل الصفحة، بالإضافة إلى السكريبتات وعلامات النهاية.
4. sidebar.phpهذا هو الهيكل HTML الذي يُستخدم لتعريف الشريط الجانبي (sidebar):
5. page.php و single.phpيُستخدم كل منهما لعرض الصفحات الثابتة والمقالات الفردية على التوالي.
عملية تطوير فعالة تتطلب إنشاء ملف قالب رئيسي.index.phpلتنفيذ استدعاء هذه الملفات، استخدم دوال القوالب المدمجة في ووردبريس:
<main id="main">
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
// 显示内容
the_title( '<h1>', '</h1>' );
the_content();
endwhile;
else :
echo '<p>没有找到内容。</p>';
endif;
?>
</main>
؟ >
فيfunctions.phpفي هذا السياق، يمكنك القيام بذلك من خلال…add_actionيمكن استخدام “الخطافات” (hooks) لتسجيل الميزات الجديدة، مثل إضافة دعم لعرض ملخصات المقالات (الصور الرئيسية).
<?php
// 为主题添加基本支持
function mytheme_setup() {
// 启用文章和页面上的“特色图像”功能
add_theme_support( 'post-thumbnails' );
// 添加对HTML5标记的支持
add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list', 'gallery', 'caption' ) );
// 注册一个主导航菜单
register_nav_menus( array(
'primary' => __( '主导航菜单', 'my-first-theme' ),
) );
}
add_action( 'after_setup_theme', 'mytheme_setup' );
استخدام مستويات القوالب وأنظمة التكرار
تُعد هيكلية قوالب ووردبريس (WordPress Template Hierarchy) نظامًا من القواعد التي تحدد ملف القالب المستخدم لطلبات الصفحات المحددة. فهم هذه العلاقة الهرمية أمر أساسي لتطوير الثيمات المتقدمة، حيث يتيح لك إنشاء تخطيطات مخصصة بشكل كبير لأجزاء مختلفة من الموقع.
القراءة الموصى بها تعلم تطوير مواقع ووردبريس من الصفر: إنشاء مواقع إلكترونية مخصصة لك。
عندما يزور المستخدم موقعك الإلكتروني، يقوم WordPress بالبحث عن ملفات القوالب المناسبة بناءً على نوع المحتوى الحالي (مثل مقالات المدونة، الصفحات، أرشيفات التصنيفات، إلخ). تتبع عملية البحث ترتيباً من التفصيلي إلى العام. على سبيل المثال، بالنسبة لصفحة ذات الرقم 5، سيقوم WordPress بالبحث تباعاً عن:
1. page-5.php (تم إنشاؤه خصيصًا لمعرف الصفحة هذا)
2. page-sample-page.php (استخدام اسم مستعار للصفحة)
3. page.php (قالب صفحة عام)
4. singular.php (قالب محتوى عام واحد)
5. index.php (العودة إلى الإعدادات الأصلية في النهاية)
الجزء الأساسي في عرض جميع المحتويات هو “حلقة ووردبريس” (WordPress Loop). وهي كتلة من كود PHP تُستخدم لتكرار عملية تصفح مجموعة النتائج الناتجة عن الاستعلام الحالي وعرض كل مقالة أو صفحة على حدة. تكون الهيكلية الأساسية لهذه الحلقة متشابهة إلى حد كبير في أي ملف قالب (template file).
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
// 当前文章/页面的内容在这里输出
the_title( '<h2 class="entry-title"><a href="/ar/' . esc_url( get_permalink() ) . '/">', '</a></h2>' );
the_excerpt(); // 或使用 the_content()
endwhile;
the_posts_navigation(); // 文章导航链接
else :
// 如果没有找到任何内容
_e( '抱歉,没有找到符合您要求的内容。', 'textdomain' );
endif;
?>
لتعزيز قابلية تقسيم القوالب إلى وحدات منفصلة وسهولة صيانتها، يشجع ووردبريس (WordPress) على استخدام…get_template_part()دالة… هذا يسمح لك بفصل الكود المستخدم للعرض العام (مثل ملخصات المقالات، بيانات المقالات الوصفية) عن بعضها وتخزينها في ملفات منفصلة لاستخدامها مرارًا وتكرارًا.
// 在 archive.php 或 index.php 中
while ( have_posts() ) : the_post();
get_template_part( 'template-parts/content', get_post_format() );
endwhile;
سيحاول هذا الكود تنفيذ عملية التحميل.template-parts/content-{post-format}.php(على سبيل المثالcontent-video.phpإذا لم يكن موجودًا، فقم بتحميله.template-parts/content.php。
ميزات متقدمة: محرر التخصيصات والحقول القابلة للتعديل
تركز تطوير مواضيع ووردبريس الحديثة ليس فقط على الجانب الجمالي، بل أيضًا على توفير خيارات تخصيص سهلة الاستخدام للمستخدمين. يوفر أداة تخصيص مواضيع ووردبريس (WordPress Theme Customizer) واجهة معاينة في الوقت الفعلي، مما يتيح للمستخدمين تعديل إعدادات الموضوع دون الحاجة إلى التعامل مع الكود.
فيfunctions.phpفي هذا السياق، يمكنك استخدام…$wp_customizeيمكن استخدام الكائنات لإضافة الإعدادات والعناصر التحكمية والمكونات الأخرى إلى الصفحة. على سبيل المثال، يمكن إضافة خيار لعرض نص حقوق النشر في القسم السفلي من الصفحة.
القراءة الموصى بها من الصفر إلى الواحد: دليل المهارات الأساسية والممارسات العملية لتطوير مواقع ووردبريس الحديثة。
function mytheme_customize_register( $wp_customize ) {
// 添加一个新的设置
$wp_customize->add_setting( 'mytheme_footer_text', array(
'default' => '© 2026 我的网站。保留所有权利。',
'sanitize_callback' => 'sanitize_text_field',
'transport' => 'postMessage', // 实现实时预览
) );
// 添加一个控件来编辑这个设置
$wp_customize->add_control( 'mytheme_footer_text', array(
'label' => __( '页脚版权文本', 'my-first-theme' ),
'section' => 'title_tagline', // 放在“站点身份”区域
'type' => 'text',
) );
}
add_action( 'customize_register', 'mytheme_customize_register' );
بعد ذلك، فيfooter.phpفي هذا السياق، يمكنك القيام بذلك من خلال…get_theme_mod()تقوم الدالة بإخراج هذه القيمة:
echo esc_html( get_theme_mod( 'mytheme_footer_text', '默认版权文本' ) );
بالنسبة لهياكل المحتوى الأكثر تعقيدًا، فإن بيانات الوصف الخاصة بالمقالات (الحقول المخصصة) وتوسيعات نظام التصنيف تعتبر أدوات قوية للغاية. يمكنك تحقيق ذلك باستخدام إضافات الحقول المخصصة المتقدمة (Advanced Custom Fields – ACF) أو الدوال الأصلية في ووردبريس. على سبيل المثال، يمكنك إضافة حقل يُظهر مدة قراءة المقال.
// 在 single.php 中显示自定义字段
$reading_time = get_post_meta( get_the_ID(), 'reading_time_minutes', true );
if ( $reading_time ) {
echo '<span class="reading-time">وقت القراءة: ' . intval( $reading_time ) . ' دقيقة</span>';
}
لبناء صفحات أكثر ديناميكية، فإن إنشاء قوالب صفحات مخصصة يعتبر تقنية شائعة الاستخدام. ما عليك سوى إضافة كتلة تعليقات معينة في بداية ملف PHP، وستظهر هذه القوالب ضمن قائمة الاختيار المتاحة لقوالب الصفحات.
<?php
/*
Template Name: 全宽页面模板
*/
get_header();
?>
<!-- 你的全宽内容布局代码 -->
<?php get_footer(); ?>
الملخصات
تطوير مواقع ووردبريس (WordPress themes) يمثل مهارة شاملة تجمع بين التصميم، وتقنيات الواجهة الأمامية (front-end)، والمنطق الخلفية (back-end). ابتداءً من فهم المبادئ الأساسية…style.cssوindex.phpبدء العمل على الملفات والتعرف تدريجيًا على قواعد تنظيم مستويات القوالب وأنظمة التكرار أمر أساسي لبناء مواضيع وظيفية فعالة. يتم ذلك عن طريق تقسيم هيكل الموضوع إلى وحدات معينة وfunctions.phpوget_template_part()الدوال (Functions) يمكن أن تعزز بشكل كبير قابلية صيانة الكود (Code Maintainability) وإعادة استخدامه (Code Reusability).
في المرحلة المتقدمة، يمكن لأداة تخصيص المواضيع المتكاملة بعمق أن توفر للمستخدمين تجربة إعدادات سهلة وفي الوقت الفعلي، بينما يمكن لاستخدام الحقول المخصصة وقوالب الصفحات بمرونة أن يساعد في إنشاء تخطيطات محتوى تلبي الاحتياجات المعقدة. الالتزام بمعايير البرمجة الرسمية لووردبريس وأفضل الممارسات هو المفتاح لضمان أمان وكفاءة موضوعك، بالإضافة إلى توافقه مع نظام ووردبريس بأكمله، وهو ما يمثل الخطوة الحاسمة لترقية مهاراتك البرمجية من “القدرة على الاستخدام” إلى “ال
الأسئلة الشائعة الأسئلة المتداولة
ما الفرق بين مواضيع (Themes) وإضافات (Plugins) في ووردبريس (WordPress)؟
تتحكم المواضيع (Themes) بشكل أساسي في مظهر الموقع الإلكتروني وعرضه من الناحية الأمامية (الواجهة البرمجية)، حيث تحدد تخطيط الموقع وألوانه وتنسيق النصوص وغيرها من الجوانب البصرية. تتفاعل هذه المواضيع مباشرة م
تُستخدم الإضافات (plugins) لتوسيع وظائف الموقع الإلكتروني، حيث يمكنها إضافة ميزات جديدة إلى الموقع دون تغيير مظهره، مثل نماذج الاتصال، أدوات تحسين محركات البحث، ووظائف التجارة الإلكترونية، وما إلى ذلك. يمكن لموقع واحد تفعيل موضوع واحد فقط في وقت واحد، ولكن يمكن تثبيت وت
ما هي الطريقة الصحيحة لتسجيل الأنماط والبرامج النصية في ملف functions.php؟
الطريقة الصحيحة هي استخدام…wp_enqueue_scripts“Hook” (خطاف). هذا يضمن معالجة العلاقات التابعة بشكل صحيح ويمنع التحميل المكرر للمحتويات. فيما يلي مثال قياسي:
function mytheme_enqueue_assets() {
// 注册并排队主样式表
wp_enqueue_style( 'mytheme-main-style', get_stylesheet_uri(), array(), '1.0.0' );
// 注册并排队一个自定义JavaScript文件
wp_enqueue_script( 'mytheme-custom-script', get_template_directory_uri() . '/js/custom.js', array('jquery'), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_assets' );
لا تستخدم أبدًا المحتويات مباشرةً داخل ملفات القوالب.linkأوscriptيعتبر تضمين الموارد عن طريق الترميز الثابت للتصنيفات (labels) مخالفًا لأفضل ممارسات ووردبريس (WordPress)، وقد يؤدي ذلك إلى حدوث تعارضات أو مشاكل في الأداء.
ما هو الموضوع الفرعي (Subtopic)، ولماذا نستخدمه، وكيف نستخدمه؟
الموضوع الفرعي (Sub-topic) هو موضوع يعتمد على موضوع آخر يُسمى الموضوع الرئيسي (Parent-topic)، ويسمح لك بتعديل أو توسيع وظائف وأنماط الموضوع الرئيسي دون الحاجة إلى تعديل ملفات الموضوع الرئيسي مباشرة. الفائدة من ذلك هي أنه عندما يتم تحديث الموضوع الرئيسي، فإن التعديلات التي قمت بها أنت شخصيًا (في الموضوع الفرعي) لن تُغطى، مم
إنشاء موضوع فرعي أمر بسيط للغاية. أولاً، في/wp-content/themes/قم بإنشاء مجلد جديد داخل المجلد الحالي (على سبيل المثال:mytheme-childثم قم بإنشاء واحد داخله.style.cssالملف، يجب أن تتضمن تعليقات الرأس الخاصة به المعلومات الضرورية.Template:يتم تحديد اسم مجلد الموضوع الرئيسي من خلال الإدخال المناسب.
/*
Theme Name: 我的主题子主题
Template: my-first-theme
*/
بعد ذلك، يمكنك العمل على المواضيع الفرعية (التابعة للموضوع الرئيسي).style.cssيمكنك إضافة قواعد أنماط في الملف، أو إنشاء ملف قالب بنفس الاسم لتغطية ملف القالب المقابل في الموضوع الأصلي.
كيف يمكنني أن أجعل موضوعي يدعم الترجمة متعددة اللغات؟
جعل موضوعك يدعم الترجمة الدولية (i18n) والتكييف المحلي (localization) خطوة مهمة نحو التطور المهني في مجال التطوير. يجب عليك استخدام الدوال المتاحة في ووردبريس لتغليف جميع النصوص التي تظهر للمستخدمين في الواجهة الأمامية.
أولاً، استخدم الطريقة المذكورة في جميع النصوص التي يمكن ترجمتها.__()(للاستخدام مع القيم المرجعية) أو_e()(للاستخدام في العرض المباشر) تم استدعاء الدالة، وتم تعيين حقل نصي (Text Domain).functions.phpفي الوسط، يتم استخدام…load_theme_textdomain()الدالة تقوم بتحميل ملفات الترجمة.
// 在 functions.php 中
function mytheme_load_textdomain() {
load_theme_textdomain( 'my-first-theme', get_template_directory() . '/languages' );
}
add_action( 'after_setup_theme', 'mytheme_load_textdomain' );
// 在模板文件中使用
_e( '阅读更多', 'my-first-theme' );
$heading = __( '最新文章', 'my-first-theme' );
ثم، يمكنك استخدام أدوات مثل Poedit لمسح السلاسل النصية الموجودة في ملفات الثيمات وإنشاء ما تحتاجه..potالملفات، وإنشاء نسخ منها بلغات مختلفة..poو.moالمستندات، الموضوعة حسب الموضوع./languages/تحت القائمة.
ما التالي، ما التالي؟
القراءة الموسعة والمعرفة العملية
فيما يلي بعض الموضوعات ذات الصلة بموضوع هذه المقالة وهي مناسبة لمزيد من القراءة المتعمقة. وغالباً ما يكون من الأفضل إعطاء الأولوية للبدء بالمقال الأقرب إلى مشكلتك الحالية ثم التوسع تدريجياً إلى المواضيع المحيطة.
- دليل شامل لعملية بناء المواقع الإلكترونية: تحليل التقنيات الأساسية واستراتيجيات التطبيق من الصفر حتى الإطلاق
- دليل شامل لعملية بناء المواقع الإلكترونية: عشر خطوات أساسية لإنشاء موقع إلكتروني مهني من الصفر
- من الصفر إلى الاحتراف: دليل شامل لعملية بناء المواقع الإلكترونية وتحليل أفضل الممارسات
- بناء المواقع الإلكترونية: دليل تقني شامل لإنشاء مواقع مهنية من الصفر
- كيفية إعداد WooCommerce: دليل شامل لتكوين المتجر من الصفر