https://dl.dropbox.com/u/28875420/2f13230887411.png
Adobe Muse
https://dl.dropboxusercontent.com/u/...s/Mus/Logo.png
في البداية بإمكانكم تنزيل و تثبيت البرنامج من رابط هذا الموضوع
[برنامج] Adobe Muse لتصميم المواقع بسهولة
https://dl.dropbox.com/u/28875420/2f13230887412.png
نتيجة الشرح ستكون لتصميم موقع بسيط كهذا
pearls-necklace.tk/test
https://dl.dropboxusercontent.com/u/...ination/24.jpg
https://dl.dropbox.com/u/28875420/2f13230887412.png
نفتح البرنامج و نختار site
https://dl.dropboxusercontent.com/u/...mms/Mus/20.png
من هنا نغير اعدادات ابعاد الصفحة ... الخ
هنا سنتركها كما هي
https://dl.dropboxusercontent.com/u/...mms/Mus/21.png
كما تشاهدون هنا في الأعلى
https://dl.dropboxusercontent.com/u/...lination/1.png
و من هنا تخطيط الصفحات
https://dl.dropboxusercontent.com/u/...mms/Mus/22.png
و هنا التصميم
https://dl.dropboxusercontent.com/u/...mms/Mus/23.png
https://dl.dropbox.com/u/28875420/2f13230887412.png
تخطيط الصفحات
https://dl.dropbox.com/u/28875420/2f13230887412.png
https://dl.dropboxusercontent.com/u/...lination/2.png
بعد اضافة الصفحات
https://dl.dropboxusercontent.com/u/...lination/3.png
و يمكن تحريك الصفحات و تغيير مكانها من فرعية الى رئيسية كما يلي :
http://www.youtube.com/watch?v=nApvmBIvlzw
الصفحات الأساسية أو Master pages
و نجدها في أسفل البرنامج و مكتوب بجانبها Masters
https://dl.dropboxusercontent.com/u/...lination/4.png
و هي مهمة جدا
وظيفتها : عند تعديلها تكون بمثابة الثيم الذي نطبقه على الصفحات في الأعلى
و هنا مثال : قمنا بعمل 3 صفحات أساسية
A و B و C
https://dl.dropboxusercontent.com/u/...lination/5.png
و قمنا بتلوينها
https://dl.dropboxusercontent.com/u/...lination/6.png
و الآن سنقوم بتغييرلون الصفحة الأساسية A
و سيتغير تبعا لذالك لون الصفحات التابعة للصفحة الأساسية A
http://www.youtube.com/watch?v=6HMhb4HI488
و لتحديد الصفحة الأساسية لكل صفحة
مثلا : صفحة blog تتبع الصفحة الأساسية Master C
نقوم بما يلي
http://www.youtube.com/watch?v=5h8-9PO1_aA
لكل صفحة توجد خصائص نتقل اليها
https://dl.dropboxusercontent.com/u/...lination/8.jpg
layout لتغيير الأبعاد
https://dl.dropboxusercontent.com/u/...lination/9.jpg
Metadata بيانات الوصف
https://dl.dropboxusercontent.com/u/...ination/10.jpg
تغيير تسمية الصفحة و تسمية العنوان و تسمية الملف
https://dl.dropboxusercontent.com/u/...ination/11.jpg
و لتسمية الصفحات باللغة العربية و بالطريقة الصحيحة نقوم بما يلي
ننقر على اسم الصفحة مرتين ثم نكتب الاسم بالعربي لتصبح بهذا الشكل
https://dl.dropboxusercontent.com/u/...ination/12.jpg
ثم نذهب الى خصائص الصفحة المراد تسميتها مثلا هنا " المنتدى"
نذهب الى properties ثم options
و نلاحظ أن كل حقول التسمية تحولت للعربي
https://dl.dropboxusercontent.com/u/...ination/13.jpg
لكن يجب أن يكون اسم الملف بالانجليزية
فنزيل علامة الصح من أمام Same as page name الموجودة تحت Filename
و نكتب اسم الملف بالانجليزي وليكن forum
ثم OK
ملاحظة : اذا لم نقم بتطبيق هذه الطريقة سيظهر خطأ عند فتح الصفحة
https://dl.dropboxusercontent.com/u/...ination/14.jpg
https://dl.dropbox.com/u/28875420/2f13230887412.png
تصميم الصفحات
https://dl.dropbox.com/u/28875420/2f13230887412.png
نقرتين على الصفحة المراد تصميمها ..
هنا اخترنا A master
https://dl.dropboxusercontent.com/u/...ination/15.jpg
الشريط العلوي
https://dl.dropboxusercontent.com/u/...ination/16.jpg
خصائص أداة التحديد
https://dl.dropboxusercontent.com/u/...ination/17.jpg
في القائمة اليمنى نجد عدة قوائم من أهمها
قائمة Assest و تعرض الكائنات الموجودة في حقل العمل مثل الصور ... الخ
https://dl.dropboxusercontent.com/u/...ination/19.jpg
قائمة paragraph Styles لحفظ استايل النصوص و تطبيقها على نصوص أخرى
قائمة CharacterStyles لحفظ استايل الكائنات و تطبيقها على كائنات أخرى
https://dl.dropboxusercontent.com/u/...ination/20.jpg
قائمة State و هي لعرض حالة النص أو الكائن أثناء :
الحالة العادية : Normal
مرور افأرة من فوقه : Rollover
أو عند الضغط عليه : Mouse Down
أو عندما يكون منشطا : Active
https://dl.dropboxusercontent.com/u/...ination/21.jpg
قائمة Widget Library أو مكتبة الويدجيت
وهي أهم جزء في هذا البرنامج
يحتوي على القوائم و عارض الصور و .... الخ
https://dl.dropboxusercontent.com/u/...ination/22.jpg
لحفظ المشروع تذهب الى File ثم Save ثم نختار المكان ثم Save
https://dl.dropboxusercontent.com/u/...ination/23.jpg
https://dl.dropboxusercontent.com/u/...ination/18.jpg
https://dl.dropbox.com/u/28875420/2f13230887412.png
اضافة صورة
https://dl.dropbox.com/u/28875420/2f13230887412.png
الطريقة الأولى
http://www.youtube.com/watch?v=ww_tbT3h-Tw
http://dl.dropbox.com/u/77096421/but...oad_button.png
الطريقة الثانية
http://www.youtube.com/watch?v=ODSWv6KkN9A
http://dl.dropbox.com/u/77096421/but...oad_button.png
اضافة قائمة
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=4Vc-N0MUytQ
http://dl.dropbox.com/u/77096421/but...oad_button.png
تعيين محتوى الصفحة الرئيسية
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=eCvfiwEPxsA
http://dl.dropbox.com/u/77096421/but...oad_button.png
اضافة رابط للمنتدى
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=3ABFlhq9RGw
http://dl.dropbox.com/u/77096421/but...oad_button.png
اضافة رابط للمنتدى من القائمة
(اضافة روابط خارجية لعناصر القائمة)
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=6JcOkhwDr0I
http://dl.dropbox.com/u/77096421/but...oad_button.png
اضافة عارض صور
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=-v9-S9uO6QI
http://dl.dropbox.com/u/77096421/but...oad_button.png
اضافة فيديو من اليوتيوب
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=pGiHA72BEdA
http://dl.dropbox.com/u/77096421/but...oad_button.png
اضافة زر لليوتيوب
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=TqE1bluB-B0
http://dl.dropbox.com/u/77096421/but...oad_button.png
تنسيق خلفية الموقع
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=HFCNbepSN4c
http://dl.dropbox.com/u/77096421/but...oad_button.png
تنسيق Header و Footer
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=Mwgzs7BBvFo
http://dl.dropbox.com/u/77096421/but...oad_button.png
معاينة الموقع في متصفح خارجي و تصديره
على شكل ملفات HTML
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=WUHC4DAjAQo
http://dl.dropbox.com/u/77096421/but...oad_button.png
نقل ملفات الموقع الى السيرفر الشخصي
https://dl.dropbox.com/u/28875420/2f13230887412.png
http://www.youtube.com/watch?v=8oIEW3yC8-o
http://dl.dropbox.com/u/77096421/but...oad_button.png
في أمان الله
http://dl.dropbox.com/u/77096421/buttons/blo.png
