أهلا وسهلا بك زائرنا الكريم، إذا كانت هذه زيارتك الأولى للمنتدى، فيرجى التكرم بزيارة صفحة التعليمـــات، بالضغط هنا.كما يشرفنا أن تقوم بالتسجيل بالضغط هنا إذا رغبت بالمشاركة في المنتدى، أما إذا رغبت بقراءة المواضيع والإطلاع فتفضل بزيارة القسم الذي ترغب أدناه.
من الإضافات الأساسية لأى موقع هى القوائم التى تحتوى على روابط تخبر الزائر بمحتويات الموقع ، وتتنوع تصميمات القوائم على حسب تصميم قالب الموقع فالكثير يفضل القوائم المنسدلة ذات التبويبات المتفرعة خصوصًا إذا كان الموقع يحتوى على العديد من الأقسام والتصنيفات ، وبالرغم من أن العديد من القوالب الجاهزة تحتوى على قوائم منسدلة إلا أنه يفضل البعض تصميم تلك القوائم بأنفسهم على حسب خريطة الموقع لذلك سأوضح فى هذا الموضوع شرح لكيفية تصميم القوائم المنسدلة بالشكل الذى يناسب موقعك.
تابع أيضًا: أضف قائمة رأسية ثابتة بالأقسام الهامة لمدونات بلوجر Fixed vertical menu قائمة ثابتة من أيقونات المواقع الاجتماعية الخشبية woody social menu قوائم رأسية أنيقة بها نجوم متحركة animated star vertical menu
إستخدلم برنامج Css3 Menu لتصميم قوائم الويب
هو برنامج مجانى لتصميم القوائم المنسدلة ويعتمد على التعديل على النماذج الموجودة بالبرنامج عن طريق إضافة النصوص والروابط
تحميل البرنامج من الموقع الرسمى: css3 menu
ترخيص البرنامج: Free version
مميزات البرنامج
واجهة البرنامج بسيطة جدا يمكن من خلالها تنسيق القائمة المناسبة لموقعك وإضافة الروابط والنصوص والتأثيرات
يمكن إضافة صور أيقونات المتاحة بالبرنامج للقوائم أو إضافة صور أيقونات خارجية
يدعم اللغة العربية وإتجاه الكتابة من اليمين
إمكانية تصميم قوائم رئيسية Main Menu أفقية أو رأسية وإنشاء قوائم متفرعة منها Submenu
إمكانية تصميم قوائم مناسبة للشاشات المتعددة لأجهزة الهواتف الذكية وذلك بتنشيط الخيار Responsive
بالإضافة إلى النماذج المجانية الموجودة بالبرنامج توجد نماذج غير مجانية بتأثيرات أكثر تطورًا
تكون القوائم المصممة بهذا البرنامج متوافقة مع جميع أنواع المتصفحات بإصداراتها
يمكن إستخدام القوائم لجميع أنواع منصات المواقع Wordpress,blogger,................
كيفية تركيب القوائم المنسدلة على مدونات Blogger
بعد تصميم القائمة المناسبة للموقع إضغط على زر Publish ليكون الناتج ملف يحتوى على صفحة ويب Html، ومجلد css
بالنسبة للمواقع التى يكون لديها إستضافة يمكن إضافة هذا الملف إلى الإستضافة أما بالنسبة للمواقع التى لا تملك إستضافة مثل مدونات بلوجر فيمكن الإستعانة بخدمات التخزين السحابى Dropbox or Googledrive
يمكن الإطلاع على :
كيفية إستضافة ملفات موقعك على Dropbox إستضافة ملفات Css , Javascript على Google drive
وسأشرح مثال توضيحى عن خطوات إستضافة ملف قائمة منسدلة مصممة ببرنامج Css menu على Dropbox وإضافتها لمدونة بلوجر
معاينة المثال
1 - بعد تصميم القائمة إنسخ الملف الناتج "صفحة الويب Html، ومجلد css" داخل مجلد public بحسابك على Dropbox
2- إفتح صفحة الويب ببرنامج Notepad
ستكون الأكواد مكتوبة هكذا بصفحة الويب
3 - إنسخ الرابط المباشر لملف Css داخل dropbox
4- إستبدل مسار ملف css الموجود بصفحة الويب وهو ما ينتهى دائما بــ "style.css" بالرابط المباشر لملف Css داخل dropbox ليكون الكود بهذا الشكل
5- ثم إنسخ كل الأكواد الموجودة بصفحة الويب وأضفها إلى مدونة بلوجر داخل أداة Html/javascript وأضفها بالمكان المناسب لمدونتك.
ملاحظات:
إذا كانت القوائم تتضمن أيقونات يمكن أيضا تبديل مسارات الأيقونات التى تنتهى بالإمتداد Png داخل الكود بالرابط المباشر لهذه الأيقونات على Dropbox بنفس الطريقة السابقة
يمكن أيضًا إستخدام موقع [url=http://www.condaianllkhir.com/search/label/Google drive]Google drive[/url] فى إستضافة القائمة
إقرأ أيضًا:
طريقة عمل قائمة بسيطة بتصنيفات وأقسام الموضوعات على بلوجر
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا
بقلم Dr.R.O
هوايتى التقنيةوالجرافيكس وأحببت أن أدون كل ما تعلمته فى هذا الموقع للإفادة فى أعمال هادفة لمزيد من مقالاتى تابع هـــنا
إقرأ المزيد http://www.condaianllkhir.com/2014/09/css-dropdown-menu.html#ixzz3M3wlg400
العضو الأكثر نشاطاً هذا اليوم 
.gif "Tomato")
السمعه♛»
موضوع: قوائم منسدله
