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

أثناء تطوير موقعنا، استخدمنا مقتطفات الكود بكثرة للتخصيص في لوحة الإدارة والواجهة الأمامية.

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

لقد اختبرنا هذه المقتطفات بدقة على مواقع إلكترونية حقيقية لضمان عملها على النحو المطلوب وخلوها من أي أخطاء.

في هذه المقالة، سنشارك قائمتنا لأكثر مقتطفات كود ووردبريس فائدة للمبتدئين.

لماذا نضيف مقتطفات الكود في ووردبريس؟

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

يمكنك استخدام الكود المخصص لتخصيص عناصر محددة في موقعك. على سبيل المثال، يمكنك تغيير لون تحديد النص في ووردبريس بإضافة مقتطف كود CSS بسيط.

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

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

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

1. السماح بتحميل ملف SVG

SVG (رسومات متجهية قابلة للتطوير) هو تنسيق ملفات يعرف الرسومات المتجهة باستخدام لغة ترميز XML. يتيح لك هذا التنسيق تكبير الصور دون فقدان الجودة.

هذه الملفات أصغر حجمًا وأخف وزنًا من JPEG أو PNG، مما يساعدك على تحسين سرعة موقعك الإلكتروني.

مع ذلك، لا يسمح ووردبريس بتحميل ملفات SVG افتراضيًا لأنها قد تحتوي على كود ضار يعرض أمان موقعك للخطر.

مع وضع ذلك في الاعتبار، إذا كنت لا تزال ترغب في رفع ملفات SVG على الموقع الكتروني الخاص بك، يمكنك اضافة مقتطف الكود التالي إليه:

/**
 * Allow SVG uploads for administrator users.
 *
 * @param array $upload_mimes Allowed mime types.
 *
 * @return mixed
 */
add_filter(
    'upload_mimes',
    function ( $upload_mimes ) {
        // By default, only administrator users are allowed to add SVGs.
        // To enable more user types edit or comment the lines below but beware of
        // the security risks if you allow any user to upload SVG files.
        if ( ! current_user_can( 'administrator' ) ) {
            return $upload_mimes;
        }
 
        $upload_mimes['svg']  = 'image/svg+xml';
        $upload_mimes['svgz'] = 'image/svg+xml';
 
        return $upload_mimes;
    }
);
 
/**
 * Add SVG files mime check.
 *
 * @param array        $wp_check_filetype_and_ext Values for the extension, mime type, and corrected filename.
 * @param string       $file Full path to the file.
 * @param string       $filename The name of the file (may differ from $file due to $file being in a tmp directory).
 * @param string[]     $mimes Array of mime types keyed by their file extension regex.
 * @param string|false $real_mime The actual mime type or false if the type cannot be determined.
 */
add_filter(
    'wp_check_filetype_and_ext',
    function ( $wp_check_filetype_and_ext, $file, $filename, $mimes, $real_mime ) {
 
        if ( ! $wp_check_filetype_and_ext['type'] ) {
 
            $check_filetype  = wp_check_filetype( $filename, $mimes );
            $ext             = $check_filetype['ext'];
            $type            = $check_filetype['type'];
            $proper_filename = $filename;
 
            if ( $type && 0 === strpos( $type, 'image/' ) && 'svg' !== $ext ) {
                $ext  = false;
                $type = false;
            }
 
            $wp_check_filetype_and_ext = compact( 'ext', 'type', 'proper_filename' );
        }
 
        return $wp_check_filetype_and_ext;
 
    },
    10,
    5
);

يمكنك إضافة هذا الكود إلى ملف functions.php الخاص بقالبك أو استخدام اضافة مقتطفات برمجية مثل WPCode. سنشرح لك بالتفصيل كيفية القيام بذلك لاحقًا في هذه المقالة.

للحصول على تعليمات أكثر تفصيلًا، يمكنك الاطلاع على درسنا التعليمي حول كيفية إضافة ملفات صور SVG في ووردبريس.

2. تعطيل شريط إدارة ووردبريس

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

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

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

لتعطيل شريط إدارة ووردبريس، قم ببساطة بإضافة مقتطف الكود PHP التالي إلى موقع ووردبريس الخاص بك:

/* Disable WordPress Admin Bar for all users */
add_filter( 'show_admin_bar', '__return_false' );

عند تنفيذ الكود، لن يظهر شريط الإدارة على واجهة الموقع.

ومع ذلك، إذا كنت ترغب في إزالة شريط الإدارة للجميع باستثناء المدير، يمكنك الاطلاع على شرحنا التعليمي حول كيفية تعطيل شريط إدارة ووردبريس لجميع المستخدمين باستثناء المديرين.

3. إزالة رقم إصدار ووردبريس

يعرض ووردبريس رقم إصدار ووردبريس الحالي على الموقع الكتروني الخاص بك للتتبع.

مع ذلك، قد تسبب هذه البصمة أحيانا تسريبات أمنية من خلال إخبار المخترقين بإصدار ووردبريس المستخدم. ويستطيع المخترقون بعد ذلك استهداف الثغرات الأمنية المعروفة في إصدارات محددة.

لإزالة رقم الإصدار، أضف مقتطف الكود التالي إلى موقعك الإلكتروني:

add_filter('the_generator', '__return_empty_string');

بمجرد قيامك بذلك، لن يتمكن المتسللون من تخمين إصدار ووردبريس الخاص بك باستخدام أدوات المسح التلقائية أو غيرها من المحاولات الأقل تعقيدًا.

للحصول على تعليمات أكثر تفصيل، يمكنك الاطلاع على برنامجنا التعليمي حول الطريقة الصحيحة لإزالة رقم إصدار ووردبريس.

4. إضافة الصور المميزة إلى موجزات RSS

تتيح موجزات RSS للمستخدمين تلقي تحديثات منتظمة حول مدونة ووردبريس الخاصة بك باستخدام قارئ موجزات مثل Feedly.

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

بإمكانك بسهولة عرض الصور المصغرة للمنشورات في خلاصات RSS الخاصة بك عن طريق إضافة مقتطف كود ووردبريس المفيد التالي:

/**
 * Add the post thumbnail, if available, before the content in feeds.
 *
 * @param string $content The post content.
 *
 * @return string
 */
function doctormega_snippet_rss_post_thumbnail( $content ) {
    global $post;
    if ( has_post_thumbnail( $post->ID ) ) {
        $content = '<p>' . get_the_post_thumbnail( $post->ID ) . '</p>' . $content;
    }
 
    return $content;
}
 
add_filter( 'the_excerpt_rss', 'doctormega_snippet_rss_post_thumbnail' );
add_filter( 'the_content_feed', 'doctormega_snippet_rss_post_thumbnail' );

يمكن أن يجعل هذا موجزك أكثر تفاعلاً ويجذب الزوار إلى موقعك.

للمزيد من المعلومات، يرجى الاطلاع على برنامجنا التعليمي حول كيفية إضافة صور مصغرة للمنشورات إلى موجزات RSS ووردبريس.

5. تعطيل رسائل البريد الإلكتروني للتحديث التلقائي

افتراضيًا، يرسل لك ووردبريس إشعار عبر البريد الإلكتروني في كل مرة يحدث فيها تلقائيًا أي اضافات أو قوالب أو جوهر الموقع نفسه.

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

في هذه الحالة، يمكنك بسهولة تعطيل رسائل البريد الإلكتروني للتحديث التلقائي عن طريق إضافة مقتطف الكود PHP التالي إلى الموقع الكتروني الخاص بك:

// Disable auto-update emails.
add_filter( 'auto_core_update_send_email', '__return_false' );
 
// Disable auto-update emails for plugins.
add_filter( 'auto_plugin_update_send_email', '__return_false' );
 
// Disable auto-update emails for themes.
add_filter( 'auto_theme_update_send_email', '__return_false' );

بمجرد القيام بذلك، لن تتلقى أي إشعارات بالتحديثات التلقائية للمكونات أو الثيمات.

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

6. تغيير “مرحبًا، يا Admin” في شريط المسؤول

عند تسجيل الدخول إلى لوحة تحكم ووردبريس الخاصة بك، سيتم الترحيب بك بكلمة “مرحبًا” متبوعة بـ اسم العرض الخاص بك في الزاوية اليسري العليا من الشاشة.

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

بإمكانك بسهولة تغيير التحية في شريط الإدارة عن طريق إضافة مقتطف الكود التالي إلى موقع ووردبريس الخاص بك:

function doctormega_snippet_replace_howdy( $wp_admin_bar ) {
 
    // Edit the line below to set what you want the admin bar to display intead of "Howdy,".
    $new_howdy = 'Welcome,';
 
    $my_account = $wp_admin_bar->get_node( 'my-account' );
    $wp_admin_bar->add_node(
        array(
            'id'    => 'my-account',
            'title' => str_replace( 'Howdy,', $new_howdy, $my_account->title ),
        )
    );
}
 
add_filter( 'admin_bar_menu', 'doctormega_snippet_replace_howdy', 25 );

بعد إضافة الكود، يجب عليك أيضًا إضافة تحية تفضلها بجوار سطر $new_howdy = في الكود.

لمزيد من المعلومات، يمكنك الاطلاع على درسنا التعليمي حول كيفية تغيير أو إزالة “مرحبًا Admin” في ووردبريس.

7. تعطيل XML-RPC

XML-RPC هي واجهة برمجة تطبيقات ووردبريس أساسية، تتيح للمستخدمين الاتصال بمواقعهم الإلكترونية عبر خدمات خارجية.

على سبيل المثال، ستحتاج إلى تفعيل XML-RPC إذا كنت ترغب في استخدام أداة أتمتة مثل Uncanny Automator أو تطبيق جوال لإدارة الموقع الكتروني الخاص بك.

ومع ذلك، إذا كنت لا ترغب في استخدام أي من هذه الدوال، فننصح بتعطيل XML-RPC لمنع المخترقين من الوصول إلى الموقع الكتروني الخاص بك.

يمكن للمخترقين استغلال هذه الثغرات الأمنية للعثور على بيانات اعتماد تسجيل الدخول أو شن هجمات DDoS.

لتعطيل XML-RPC، يمكنك استخدام مقتطف الشفرة التالي على موقعك الإلكتروني:

add_filter( 'xmlrpc_enabled', '__return_false' );

إذا كنت بحاجة إلى مزيد من المعلومات، فيمكنك مشاهدة البرنامج التعليمي الخاص بنا حول كيفية تعطيل XML-RPC في ووردبريس.

8. تعطيل إفراغ سلة المهملات تلقائيًا

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

مع ذلك، قد لا يرغب بعض المستخدمين في إفراغ سلة المهملات تلقائيًا ليتمكنوا من استعادة الملفات المحذوفة في أي وقت.

في هذه الحالة، يمكنك إضافة مقتطف الكود التالي إلى موقع ووردبريس الخاص بك:

add_action( 'init', function() {
    remove_action( 'wp_scheduled_delete', 'wp_scheduled_delete' );
} );

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

9. تغيير طول المقتطف

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

قد ترغب في اختصار المقتطف لإثارة اهتمام المستخدمين وتشجيعهم على النقر على المنشور لمعرفة المزيد.

وبالمثل، يمكنك زيادة طول المقتطف لتوفير سياق ومعلومات أساسية أكثر للقراء دون الحاجة إلى النقر عليه.

لتغيير طول المقتطف، أضف مقتطف الكود التالي إلى الموقع الكتروني الخاص بك:

add_filter(
    'excerpt_length',
    function ( $length ) {
        // Number of words to display in the excerpt.
        return 40;
    },
    500
);

افتراضيًا، سيقتصر هذا المقتطف على 40 كلمة، ولكن يمكنك تعديل العدد في السطر الخامس بما يناسب مدونتك.

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

10. تعطيل التحقق من البريد الإلكتروني لمسؤول الموقع

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

ومع ذلك، في بعض الأحيان قد يتم إرسال هذا الإشعار إليك أكثر من اللازم، مما قد يكون مزعج.

لحسن الحظ، يمكنك تعطيل إشعار التحقق من البريد الإلكتروني للمسؤول عن طريق إضافة مقتطف الكود التالي إلى موقع ووردبريس الخاص بك:

add_filter( 'admin_email_check_interval', '__return_false' );

للحصول على تعليمات مفصلة، ​​راجع البرنامج التعليمي الخاص بنا حول كيفية تعطيل إشعار التحقق من البريد الإلكتروني لمسؤول ووردبريس.

11. تعطيل التحديثات التلقائية

يقوم ووردبريس تلقائيًا بتحديث برمجياته الأساسية أو اضافاتة أو قوالبه لتقليل التهديدات الأمنية وإصابات البرامج الضارة وانتهاكات مواقع الويب وسرقة البيانات.

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

في هذه الحالة، يمكنك استخدام مقتطف الكود التالي لتعطيل التحديثات التلقائية:

// Disable core auto-updates
add_filter( 'auto_update_core', '__return_false' );
// Disable auto-updates for plugins.
add_filter( 'auto_update_plugin', '__return_false' );
// Disable auto-updates for themes.
add_filter( 'auto_update_theme', '__return_false' );

سيؤدي هذا إلى تعطيل جميع تحديثات ووردبريس التلقائية للبرنامج الأساسي والقوالب والإضافات. لمزيد من المعلومات، راجع دليلنا التعليمي حول كيفية تعطيل التحديثات التلقائية في ووردبريس.

كيفية اضافة مقتطفات الكود في ووردبريس (طريقة سهلة)

الأن بعد أن تعرفت على مقتطفات كود ووردبريس المفيدة للمبتدئين، يمكنك إضافتها بسهولة إلى أوراق أنماط (stylesheets) قالبك أو ملف functions.php.

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

لهذا السبب، نوصي دائمًا باستخدام WPCode.

نستخدم WPCode لتوسيع وظائف مواقع ووردبريس الخاصة بنا، وقد وجدنا أنه يسهل اضافة كود مخصص إلى موقعك الإلكتروني بأمان.

كما تأتي هذه الاضافة مزود بمكتبة تضم أكثر من 900 مقتطف كود، بما في ذلك جميع المقطوعات التي ذكرناها سابقًا.

أولاً، عليك تثبيت وتفعيل إضافة WPCode. لمزيد من التعليمات، راجع دليلنا التعليمي حول كيفية تثبيت اضافة ووردبريس.

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

عند التنشيط، قم بزيارة صفحة Code Snippets » + Add Snippet من لوحة تحكم ووردبريس.

سيؤدي هذا إلى نقلك إلى مكتبة المقتطفات، حيث يمكنك إضافة كود مخصص إلى موقعك بالنقر على زر “Use Snippet” أسفل خيار “Add Your Custom Code (New Snippet)”.

وإذا كنت ترغب في استخدام مقتطف كود جاهز، يمكنك ببساطة النقر على زر “Use Snippet” أسفل هذا الخيار.

إذا كنت تضيف مقتطف كود مخصص، فما عليك سوى لصقه في مربع ‘Code Preview’.

ثم انتقل للأسفل إلى قسم ‘Insertion’ واختر وضع ‘Auto Insert’. سيتم تنفيذ الكود تلقائيًا على الموقع الكتروني الخاص بك عند تفعيل المقتطف.

أخيرًا، انتقل إلى أعلى الصفحة وقم بتبديل وضع ‘inactive’ إلى ‘active’. بعد ذلك، انقر على زر ‘Update’ لحفظ إعداداتك.

لقد أضفت الأن مقتطف الكود بنجاح إلى موقع ووردبريس الخاص بك.

للحصول على تعليمات أكثر تفصيلاً، راجع دليل المبتدئين الخاص بنا حول كيفية إضافة كود مخصص بسهولة في ووردبريس.

نصيحة احترافية 💡: إذا كنت تخشى استخدام أكواد مخصصة لتخصيص موقعك الإلكتروني، فلا تقلق، فنحن نوفر لك كل ما تحتاجه.

تقدم DoctorMega الأن خدمات تصميم مواقع الويب بأسعار معقولة جدًا. مع مدير مشروع متخصص، نحول أفكارك إلى واقع.

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

قم بزيارة صفحة خدمات DoctorMega الاحترافية الخاصة بنا للحصول على مزيد من المعلومات!

الأسئلة الشائعة حول مقتطفات كود ووردبريس

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

كيف أعرض الكود على موقع ووردبريس الخاص بي؟

إذا كنت تكتب منشورات مدونة حول مواضيع تقنية، فقد يكون من المفيد إضافة مقتطفات كود إلى منشوراتك. للقيام بذلك، افتح الصفحة أو المنشور الذي تريد عرض مقتطف الكود فيه، ثم انقر على زر إضافة كتلة “+”.

بعد ذلك، ما عليك سوى إدراج كتلة الكود من قائمة الكتل، ثم إضافة الكود المخصص إليها.

أخيرًا، انقر على زر ‘نشر’ أو ‘تحديث’ في الأعلى لحفظ تغييراتك.

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

كيف أقوم بإنشاء موقع ووردبريس من الصفر بدون برمجة؟

إذا كنت ترغب في انشاء موقع الكتروني من الصفر دون استخدام أي أكواد، فيمكنك استخدام Beaver Builder.

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

لقد استخدمناه بأنفسنا لبناء مواقع ويب كاملة، وكانت تجاربنا معه رائعة.

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

للمزيد من التفاصيل، يمكنك الاطلاع على برنامجنا التعليمي حول كيفية إنشاء صفحة هبوط في ووردبريس.

أين يمكنني الحصول على مقتطفات كود ووردبريس؟

يمكنك استخدام مكتبة WPCode للوصول إلى أكثر من 900 مقتطف كود لإضافتها بسهولة إلى موقعك الإلكتروني.

وإذا لم تكن تستخدم WPCode، فيمكنك أيضًا الحصول على مقتطفات كود جاهزة من مواقع مثل Stack Overflow أو CodePen أو GenerateWP.

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