شرح تخصيص Sidebar لموقعك الووردبريس

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

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

ما هو السايد بار sidebar وكيف يكون مفيد للموقع ؟

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

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

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


 السايد بار والودجات

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

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

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

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

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

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

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


أهم الودجات في قوالب الووردبريس 

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

من أشهر الودجات التي يمكنك الإستفادة منها، وتجدها في أغلب القوالب ما يأتي: 

  • “أحدث التعليقات”: تعرض آخر التعليقات داخل محتوى موقعك، وعند إضافتها يمكنك تحديد عدد التعليقات التي ترغب بظهورها أسفل المقالة أو الصفحة الواحدة. 
  • ” أحدث المقالات”: مثل الذي يظهر في موقع ووردبريس بالعربية ويوجد في أقصى يسار الصفحة، حيث يحتوي على مقالات و شروحات للمبتدئين. 
  • “تصنيفات”: يتضمّن قائمة منسدلة تحتوي على التصنيفات التي توجد داخل موقعك، ويمكن للزائر النقر على إحداها لفتح المحتوى المصنف بداخلها. 
  • “بحث”: تُستخدم من أجل إتاحة الفرصة أمام زوار موقعك للبحث عن محتوى معين كتابة اسم المقالة أو الصفحة داخل مربع البحث، ويعرض الودجيت بشكل تلقائي نتائج البحث الأكثر صلة بالموضوع ضمن موقعك.
  • “صورة”: من خلاله يمكن عرض صورة ما في جزء مخصص لها داخل موقعك، مثل إظهار بانر إعلاني.
  • “صوت”: يستخدم كذلك لإدراج ملف صوتي داخل الموقع، ويمكنك تخصيصه ليتم تشغيله بكل تلقائي أو عند ضغط الزائر عليها لتشغيلها. يمكن استخدامه في حال بث نشرات إذاعية عبر موقعك للزوار للإطلاع على آخر الأخبار والمستجدات.
  • “تقويم”: يقوم بإدراج مربع صغير يحتوي على التقويم الخاص بالتاريخ والوقت حسب الإعدادات التي تختارها. 
  • “سلة المشتريات”: يتوفر هذا الويدجيت في القوالب التي تم المخصصة للمتاجر الإلكترونية، أو عند تنصيب أحد إضافات التجارة الإلكترونية مثل Woocommerce، فيظهر هذا الودجيت، والذي يستعرض سلة المشتريات الخاصة بالعميل داخل المتجر. 
  • ” فرز حسب السعر”: هو أيضًا أحد الودجات التي تظهر في قوالب المتاجر الإلكترونية، حيث يَعرِض شريط تمرير يسمح للزائر بفرز المنتجات تنازليًّا او تصاعديًّا تبعًا للسعر. 

إضافة الودجات إلى السايد بار من داخل لوحة التحكم

تستطيع إضافة الودجات بسهولة من داخل لوحة تحكم الووردبريس من خلال إتباع الخطوات التالية:

  1. الدخول إلى لوحة التحكم ثم التوجه إلى: المظهر >> الودجات
  2. اختر الودجت التي تريد إضافته داخل السايد بار الخاص بموقعك، أو داخل أي جزء آخر.
  3. انقر على الودجت المُختار لتفتح لك قائمة منسدلة تحتوي على الأجزاء المخصصة داخل موقعك، والتي يمكن إدراج الويدجت بداخلها.
  4.  ستجد من ضمن تلك الخيارات ” السايد بار”

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

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

أيضًا تستطيع إدراج السايد بار داخل الموقع، عبر سحب الودجت المراد إدراج والقيام بإفلاته داخل الجزء المخصص له، سواء إذا كان السايد بار أو أي جزء آخر في الموقع: 

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

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


تعيين السايد بار من خلال تخصيص القالب

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

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

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


تخصيص السايد بار باستخدام إحدى الإضافات

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

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

بعد قيامك بتنصيب الإضافة وتفعيلها على قالب موقعك الووردبريس، ثم عند الدخول إلى لوحة تحكم الووردبريس ثم الذهاب إلى المظهر << ودجات، ستلاحظ ظهور عنصر جديد خاص بالإضافة لإنشاء سايد بار مخصص جديد Create new sidebar

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

بعد تسمية السايد بار ووضع وصف نصي له، قم بالضغط على Create sidebar :

سيتم إنشاء السايد بار بالاسم والوصف الذي قمت بإدخالها : 

الأن قمت بإضافة الودجات المراد ادرجها في السايد بار، اختر كل الودجات التي تريد ظهورها داخل السايد بار : 

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

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

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

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

أيضا من خلال تلك الإعدادات يمكنك التحكم في أنواع وأحجام الشاات التي ترغب في إظهار أو إخفاء السايد بار عليها، ولك عن طريق الدخول إلى خيار For screen sizes : 

سيفتح أمامك ثلاث مربعات إدخال للتحكم في حجم وابعاد الشاشات المراد إظهار أو إخفاء السايد بار بها، تلك الخانات هي كالتالي : 

  • Screen width: هنا تقوم بتحديد حجم الشاشة المراد التحكم في ظهور السايد بار عليه، وليكن نقوم بوضع الشاشات التي حجمها 700 بكسل. 
  • Show: يوجد بها خياران وهما Hide لإخفاء السايد بار على تلك الشاشات، و Show لإظهارها على الشاشات التي تم تحديد حجمها. 
  • Screen: هنا تحدد القيمة القصوى أو الدنيا لحجم الشاشة التي قمت بتحديدها. 

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

 في هذه الحالة سوف يظهر السايد بار فقط على الشاشات التي يتجاوز حجمها 700 بكسل. 

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

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

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