عرب حصرى

كيفية إضافة القائمة الجانبية المتحركة إلي موقعك أو مدونة بلوجر مع الكود و الشرح

جدول محتوى المقال

كيفية إضافة القائمة الجانبية المتحركة إلي موقعك

المقدمة

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

الشرح

1- الستايل

أولاً قم بأخذ نسخة إحتياطة للقالب الخاص بك

يتم وضع استايل القائمة الجانية داخل استايل القالب

انسخ هذا الكود

]]></b:skin>

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

حمل ملف كود الستايل التحميل بالأسفل

2- كود القائمة

إبحث فى القالب عن

<head/>

ثم ضع الكود التالي اسفله

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

[ قم بتعديل الكود بوضع الروابط وتغيير أسماء الأقسام والصفحات بما يناسبك ]

 

ملحوظة: 

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

[ يتم وضع كود القائمة الجانبية المتحركة أسفل إغلاق الهيد ] 

3- كود زر فتح القائمة

جزء 1

إذا كانت قائمتك الرئيسية كود عادي داخل القالب

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

<ul>

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

<ul>

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

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

جزء 2

إذا كانت قائمتك من التخطيط

إبحث عن الكود

<div class='header-top'>

ثم أسفله يكون كود كونتينر

<div class='container'>

لتكون الأكواد بهذا الشكل

<div class='header-top'>
<div class='container'>

ثم ضع الكود التالي أسفلهم

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

إذا لم يكن لديك الأكواد

<div class='header-top'>
<div class='container'>

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

ملحوظة.

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

4- السكربت

يتم وضع السكربتات أعلي اغلاق البودي

ابحث فى القالب عن

</body>

ثم ضع السكربتات التالية فوقه

حمل ملف السكربتات التحميل بالأسفل

شرح بالفيديو

التحميل

من فايل أبلود:

من ميديا فاير:

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

الكاتب

Mohsen Abdo

الإنشاء

18 أبريل 2021

آخر تحديث

المشاهدات