الهيكل الأساسي لموضوعات ووردبريس.

القراءة الموصى بها في عالم اليوم التنافسي عبر الإنترنت، فإن برنامج Word المصمم بشكل جيد وعالي الأداء。

معلومات الرأس لملف أنماط الصفحة الرئيسية (Theme Style Sheet)

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

خادم ووردبريس من شركة UltaHost

ضمان استرداد المال خلال 30 يومًا، عرض نطاق ترددي وقواعد بيانات غير محدودين، حماية مجانية ضد هجمات DDoS، خصم 50% عند الشراء لمدة 3 سنوات (السعة المتاحة: 501–4 تيرابايت).

صفحة الوصول

/*
Theme Name: My Awesome Theme
Theme URI: https://example.com/my-awesome-theme/
Author: Your Name
Author URI: https://example.com/
Description: A modern, responsive WordPress theme built for speed and SEO.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: my-awesome-theme
*/

من بينها، يُستخدم “Text Domain” لأغراض التدويل، وهو معرف يتم استخدامه لاحقًا أثناء عمليات الترجمة إلى لغات أخرى، وعادةً ما يكون مطابقًا لاسم مجلد الموضوع (theme folder).

العمليات الشائعة لملفات وظائف الموضوعات (Theme Function Files)

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

<?php
function my_awesome_theme_setup() {
    // 添加对文章特色图片的支持
    add_theme_support( 'post-thumbnails' );
    // 添加对自定义Logo的支持
    add_theme_support( 'custom-logo' );
    // 添加对HTML5标记的支持
    add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption' ) );
    // 添加对标题标签的支持
    add_theme_support( 'title-tag' );
}
add_action( 'after_setup_theme', 'my_awesome_theme_setup' );
?>

يقوم هذا الكود باستخدام "الخطافات" (hooks) لتنفيذ مهام معينة.after_setup_themeيتم تنفيذ هذا الكود بعد تحميل الموضوع (theme)، ويقوم بتفعيل عدد من الميزات الأساسية في ووردبريس بشكل آمن.

مستويات القوالب والقوالب المخصصة

يستخدم WordPress نظامًا ذكيًا يُسمى “مستويات القوالب” (Template Hierarchy) لتحديد كيفية عرض أنواع مختلفة من الصفحات. عندما يزور المستخدم صفحة ما، يبحث WordPress عن ملف القالب المناسب وفقًا لترتيب أولويات معين. على سبيل المثال، بالنسبة لمقالة مصنفة تحت تصنيف “الأخبار” (News)، يبحث WordPress تباعًا عن:single-post-news.php -> single-post.php -> single.php -> singular.php -> index.phpيمكن للمطورين استخدام هذه القواعد لتحقيق التحكم الدقيق في الصفحات من خلال إنشاء ملفات قوالب ذات أسماء محددة.

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

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

إنشاء قالب صفحة مخصص

على سبيل المثال، لإنشاء قالب صفحة بعرض كامل للشاشة، يمكنك إنشاء ملف جديد باسم…template-fullwidth.phpقم بتحميل الملف، وأضف التعليق التالي في بداية الملف:

<?php
/**
 * Template Name: 全宽度页面布局
 * Description: 一个没有侧边栏的全宽度页面模板
 */
?>

بعد ذلك، عند تعديل الصفحات في واجهة ووردبريس الخلفية، يمكنك رؤية خيار “تخطيط الصفحة بعرض كامل” (Full Width Page Layout) ضمن قائمة الاختيارات المتاحة تحت خانة “القالب” (Template) ضمن “خصائص الصفحة” (Page Properties). هذا الخيار يوفر مرونة كبيرة في عرض المحتوى، حيث لا يلزم تعديل الملفات الأساسية للقالب لتلبية احتياجات التخطي

استضافة.كوم استضافة مشتركة

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

صفحة الوصول

استخدم علامات التحكم المنطقي باستخدام علامات التحكم المنطقي.

في ملفات القوالب، غالبًا ما نحتاج إلى عرض محتويات مختلفة بناءً على شروط معينة. وفي هذه الحالات، نستخدم علامات الشروط المتاحة في ووردبريس (WordPress condition tags). على سبيل المثال،index.phpفي هذا السياق، يمكن استخدام علامات شرطية (conditional tags) لتحديد ما إذا كانت الصفحة تعرض قائمة المقالات أم مقالًا واحدًا، على الرغم من أن هناك عادةً ملفات قوالب أكثر تحديدًا مسؤولة عن ذلك.

<?php if ( is_home() && ! is_front_page() ) : ?>
    <h1>قائمة مقالات المدونة</h1>
<?php elseif ( is_search() ) : ?>
    <h1>搜索结果：</h1>

تشمل العلامات الشرطية الشائعة الاستخدام أيضًا:is_single()、is_page()、is_category()、is_archive()إلخ، هي الأساس الذي يُبنى عليه إنشاء المواضيع الديناميكية والذكية.

إدارة سكريبتات الموضوعات وأنماطها

لضمان استقرار وأداء الموقع، يجب تحميل جميع ملفات JavaScript وCSS وفقًا للطرق التي يوفرها WordPress، وليس باستخدامها مباشرة داخل ملفات القوالب.أوالعلامات… تم إنشاؤها بهذه الطريقة.functions.phpأنا أحبك، أيها الأخ الأكبر.wp_enqueue_scriptsتم تنفيذ ذلك باستخدام “الخطافات” (hooks).

القراءة الموصى بها التركيز على الممارسة العملية: اكتساب المهارات الأساسية لتطوير مواضيع WordPress الحديثة من الصفر إلى واحد.。

تسجيل الموارد ووضعها في قائمة الانتظار بشكل صحيح

الاستفادة منwp_register_script()وwp_enqueue_script()(السكريبت) أو المقابل لهwp_register_style()وwp_enqueue_style()(الأسلوب): الدوال تسمح لووردبريس بإدارة العلاقات التابعة وعمليات التحكم في الإصدارات بشكل موحد، وتمنع تحميل المحتويات بشكل متكرر.

<?php
function my_awesome_theme_scripts() {
    // 注册并排队主样式表（style.css）
    wp_enqueue_style( 'my-awesome-theme-style', get_stylesheet_uri(), array(), wp_get_theme()->get('Version') );

    // 注册一个自定义JavaScript文件
    wp_register_script( 'my-theme-navigation', get_template_directory_uri() . '/js/navigation.js', array('jquery'), '1.0.0', true );
    // 排队这个脚本（仅在需要时）
    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
        wp_enqueue_script( 'comment-reply' );
    }
}
add_action( 'wp_enqueue_scripts', 'my_awesome_theme_scripts' );
?>

في المثال أعلاه،get_stylesheet_uri()الحصول على الموضوع الحالي…style.cssالمسار (Path)get_template_directory_uri()قم بالحصول على URI لدليل المواضيع. قم بتعيين المعامل الأخير للسكريبت إلى…trueيعني ذلك أن المحتوى يتم تحميله في أسفل الصفحة، وهو ما يساعد على تحسين أداء تحميل الصفحة.

الاستضافة المشتركة InterServer

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

صفحة الوصول

إضافة أنماط مضمنة (inline styles) أو سكريبتات (scripts)

أحيانًا، قد يكون من الضروري إنشاء بعض ملفات CSS أو JavaScript بشكل ديناميكي بناءً على منطق PHP. في مثل هذه الحالات، يمكن استخدام…wp_add_inline_style()وwp_add_inline_script()الدوال (Functions) يجب أن تعتمد على مورد (Resource) موجود بالفعل في القائمة المنتظرة (Queue).

<?php
function my_dynamic_css() {
    $custom_css = "
        .site-header {
            background-color: #" . get_theme_mod('header_bg_color', 'ffffff') . ";
        }
    ";
    wp_add_inline_style( 'my-awesome-theme-style', $custom_css );
}
add_action( 'wp_enqueue_scripts', 'my_dynamic_css' );
?>

محررات التخصيص والميزات القابلة للتعديل

مُعدل تخصيصات ووردبريس (WordPress Customizer) يوفر واجهة عرض مباشرة في الوقت الفعلي، تسمح للمستخدمين (أو المسؤولين) بتعديل بعض إعدادات القالب مثل الألوان والشعار وصورة الخلفية وغيرها. من خلال واجهة برمجة التطبيقات (API) الخاصة بمُعدل التخصيصات، يمكن للمطورين إضافة خيارات قابلة للتكوين إلى القالب بشكل آمن.

أضف إعدادًا في المحرر المخصص.

أولاً، من الضروري القيام بـfunctions.phpاستخدمه فيcustomize_registerالأدوات المستخدمة لتسجيل الإعدادات والعناصر التحكمية والمناطق (Regions).

<?php
function my_awesome_theme_customize_register( $wp_customize ) {
    // 添加一个“颜色”板块
    $wp_customize->add_section( 'theme_colors', array(
        'title'    => __( '主题颜色', 'my-awesome-theme' ),
        'priority' => 30,
    ) );

    // 添加一个“链接颜色”设置
    $wp_customize->add_setting( 'link_color', array(
        'default'           => '#0073aa',
        'sanitize_callback' => 'sanitize_hex_color',
        'transport'         => 'postMessage', // 支持实时预览
    ) );

    // 为该设置添加一个颜色选择器控件
    $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'link_color', array(
        'label'    => __( '链接颜色', 'my-awesome-theme' ),
        'section'  => 'theme_colors',
        'settings' => 'link_color',
    ) ) );
}
add_action( 'customize_register', 'my_awesome_theme_customize_register' );
?>

في الموضوع، يتم عرض الإعدادات المخصصة.

بعد إضافة الإعدادات، من الضروري عرض هذه القيمة في واجهة الموقع الأمامية للموضوع (theme frontend). عادةً ما يتم ذلك في…style.cssأو من خلالwp_add_inline_style()في الـ CSS الديناميكي المضاف، تم استخدام…get_theme_mod()الدالة تحصل على القيمة.

<?php
function output_customizer_css() {
    $link_color = get_theme_mod( 'link_color', '#0073aa' ); // 第二个参数为默认值
    if ( $link_color !== '#0073aa' ) {
        $css = "
            a { color: {$link_color}; }
            a:hover { color: " . adjust_color( $link_color, -50 ) . "; }
        ";
        wp_add_inline_style( 'my-awesome-theme-style', $css );
    }
}
add_action( 'wp_enqueue_scripts', 'output_customizer_css' );
?>

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

الملخصات

تطوير قالب ووردبريس (WordPress theme) يعتبر مشروعًا هندسيًا منهجيًا يتطلب فهمًا عميقًا لمستويات القوالب (templates)، الدوال الأساسية (core functions)، إدارة الموارد (resource management)، بالإضافة إلى واجهات برمجة التطبيقات المخصصة (custom APIs). يبدstyle.cssوindex.phpابدأ بإنشاء ملفات قوالب محددة للتحكم في طريقة عرض الصفحات المختلفة، واستخدم هذه الملفات بشكل فعال.functions.phpتوسيع وظائف الموضوع واتباع معايير ووردبريس في إدارة السكريبتات والأنماط هو أساس بناء موضوع قوي وفعال. بالإضافة إلى ذلك، فإن دمج واجهة برمجة التطبيقات (API) الخاصة بأداة تخصيص المواضيع يمكن أن يوفر للمستخدمين تجربة تخصيص سهلة وفي الوقت الفعلي. إتقان هذه المفاهيم والمهارات الأساسية هو المفتاح لتصبح مطور مواضيع ووردبريس محترفًا.

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

ما هي العدد الأدنى من الملفات المطلوبة لتصميم قالب ووردبريس (WordPress theme) أساسي؟

أبسط قالب يمكن أن يتم التعرف عليه بواسطة ووردبريس (WordPress) يحتاج إلى ملفين على الأقل:style.cssوindex.php。style.cssيجب أن يحتوي الجزء العلوي من الملف على تعليقات معلومات الموضوع الصحيحة، و…index.phpهذا هو الملف الأخير في مستويات القوالب (templates)، ويُستخدم لإخراج المحتوى الأساسي فقط.

ما الفرق بين المواضيع الفرعية (Subtopics) والمواضيع الرئيسية (Parent Topics)؟ وكيف يمكن إنشاؤها؟

ترث الأفكار الفرعية (Sub-Themes) جميع الوظائف والأنماط من الفكرة الرئيسية (Parent Theme)، لكنها تسمح للمطورين بتغييرها وتخصيصها دون الحاجة إلى تعديل ملفات الفكرة الرئيسية نفسها. هذا يسهل الحفاظ على التعديلات المخصصة عند تحديث الفكرة الرئ/wp-content/themes/قم بإنشاء مجلد جديد داخل المجلد الحالي، ثم أنشئ ملفًا جديدًا داخل هذا المجلد الجديد.style.cssالملف يجب أن يحتوي، في تعليقات الرأس الخاصة به، على…Template:يتم تحديد اسم مجلد الموضوع الأب من خلال الأوامر المقدمة.

لماذا لا يظهر قالب الصفحة المخصص الخاص بي في قائمة الاختيار السفلية في الواجهة الخلفية؟

يرجى مراجعة ملف قالب الصفحة الخاص بك (مثل…)my-template.phpيجب أن يكون الملف موجودًا في المجلد الرئيسي (الجذري) للموضوع، ويجب أن يكون تنسيق كتلة التعليقات في بداية الملف صحيحًا تمامًا. يجب أن تحتوي كتلة التعليقات على…Template Name:هذا السطر، ويجب أن يليه اسم قالبك مباشرةً. أي خطأ في استخدام المسافات أو نقص علامة الفاصلة (:) قد يمنع ووردبريس من التعرف عليه.

كيف يمكنني أن أجعل موضوعي يدعم الترجمة متعددة اللغات؟

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