كيفية تخصيص قالب ووردبريس دون الحاجة لخبرة برمجية

تخصيص قالب ووردبريس دون الحاجة لخبرة برمجية

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

ما هو تخصيص قالب الووردبريس؟

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

لماذا يجب عليك تخصيص قالب ووردبريس الخاص بموقعك؟

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

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

ما هي الخيارات المتاحة لتخصيص قالب الووردبريس وتغيير التصميم؟

تتعدد خيارات تخصيص قالب ووردبريس ضمن ثلاثة خيارات رئيسية، وهي كما يلي:

  1. تخصيص القالب عن طريق التعديل عليه برمجيًا بإضافة أكواد، يمكن تنفيذ ذلك عبر Theme Editor. يتطلب هذا الخيار مهارة ومعرفة برمجية جيدة على الأقل، لتجنب حدوث أي عطل للموقع الخاص بك، جراء إضافة كود برمجي غير دقيق أو في مكانٍ خاطئ.
  2. تخصيص القالب يدويًا عن طريق موقع ووردبريس، لكنها توفر خيارات محدودة في التخصيص لكل قالب. يمكن عمل ذلك عن طريق الذهاب إلى “المظهر (Appearance)” ثم اختيار خيار “تخصيص (Customize)”.
  3. تضمين أداة للقالب تمكنك من التخصيص حسبما تريد في كل جانب موجود به، توجد عدة خيارات تندرج تحت هذا الخيار، أبرزها ما يلي:

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

كيفية تخصيص قالب ووردبريس

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

تثبيت Beaver Themer

أولاً، تحتاج إلى تثبيت وتفعيل الإضافات Beaver Builder و Beaver Themer على ووردبريس من خلال خانة “الإضافات (Plugins)” ثم “إضافة جديد (Add New)”. ستحتاج بالبداية إلى قالب مجاني غير مخصص للعمل عليه. يمكن أن نوصيك بالقوالب الآتية التي تتمتع بخفة حجم ومرونة كبيرة في العمل مع Beaver Themer وتدعم كل ما يأتي مع Beaver Builder.

سنستعين هنا بقالب Astra للعمل عليه، ولكن يمكنك تطبيق جميع الخطوات التالية على الخيارات الأخرى.

إعداد القالب لاستعمال Beaver Themer

أهم نقطة قبل البدء هي أن تهتم بأن Beaver Themer يمتلك صلاحية الوصول إلى كافة النافذة الخاصة بالقالب، أي أنه عليك إزالة أي شريط جانبي ليس له علاقة. ستلاحظ الشريط الجانبي في قالب Astra أو القوالب الأخرى. يمكن إزالته عن طريق الذهاب إلى “المظهر (Appearance)” ثم إلى “علامة الشريط الجانبي (Sidebar tab)”، ما عليك بعدها سوى تحديد جملة “No sidebar”.

تخصيص قالب ووردبريس دون الحاجة لخبرة برمجية: الصفحة الرئيسية
تخصيص قالب ووردبريس : ازالة الشريط الجانبي

إن كنت تستخدم قالب آخر ولم تناسبه هذه الطريقة، يمكنك التواصل مع المسؤول عن القالب ليساعدك في ذلك ليصبح قالبك جاهزًا لتطبيق Beaver themer.

أساسيات Beaver Builder

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

تخصيص قالب ووردبريس باستخدام Beaver builder

لكن لا زلت بحاجة إلى ما هو أكثر من ذلك، يأتي هنا دور الـ Beaver Themer، يتم ذلك عبر “Themer Layout”، بحيث يسمح لك بإضافة تخطيطات وخصائص للرأس والتذييل ومنطقة المحتوى الرئيسية، إضافة لصفحة 404 إن تم التوجه لصفحة غير موجودة على الموقع. يمكنك إضافته كما الصورة الموضحة أدناه.

سننتقل الآن إلى كيفية تخصيص كافة العناصر التي توفرها Theme Builder.

تصميم رأس (Header) مخصص لموقعك

عليك أولاً إضافة منطقة رأس (Header) للموقع عن طريق Beever Builder بأن تنتقل إلى إضافة صفحة وتحدد خيار Header في خانة التخطيط (Layout) وخيار “Themer Layout” كنوع الصفحة. كما موضح في الصورة أدناه.

تصميم رأس الموقع Header

سينقلك هذا إلى صفحة “إعدادات التخطيط (Layout settings)”. يجب عليك عندها تحديد “الموقع بالكامل (Entire site)” باعتباره الموقع الذي سيتم عرض قالب الرأس فيه. بعد ذلك، انقر فوق الزر “Launch Beaver Builder” لفتح واجهة تسمح لك بتخصيص رأس (Header) موقعك.

تخصيص قالب ووردبريس دون الحاجة لخبرة برمجية: تصميم رأس الموقع Header

تحتوي النافذة على عنصر عمودي واحد وثلاثة صفوف، يمكن الإضافة والحذف والتخصيص كما تود.

 Beaver builder

تصميم مخصص تذييل (Footer) لموقعك

يمكنك إنشاء تذييل مخصص باستخدام Beaver Themer تمامًا كما قمت بإنشاء رأس مخصص لا أكثر! توجه إلى Beaver Builder ثم أضف صفحة جديدة للتذييل، ستنتقل إلى إعدادات التخطيط التي ستحدد منها “الموقع بالكامل (Entire site)” ثم إلى واجهة التخصيص التي ستصل إليها عند النقر على “Launch Beaver Builder”.

تصميم مخصص لمنطقة المحتوى لموقعك

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

تخصيص القالب باستخدام Beaver builder

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

يتيح Beaver Builder تخصيص صفحات وعناصر أخرى في موقعك، مثل صفحة 404 والعديد من الخيارات الأخرى. 

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

لأي استفسارات يمكنك طلب المساعدة في التعليقات وسنجيبك في أقرب وقت ممكن 

nv-author-image

فريق وبسايتي

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

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *