SHAREPOINT DESIGNER 2007
مكونات صفحة الويب
Web Page Components
مكونات صفحة الويب
WEB PAGE COMPONENTS
توجد مجموعه من المكونات المفيده في برنامج الشيربوينت التي يمكن ان تضاف
اثناء تصميم صفحة انترنت ومن هذه المكونات-:
غالبا ما يكون في الصفحه الرئيسيه للموقع ويستخدم لتعداد زوار عداد متصفحي الموقع
الصفحه )(Hit Counter
يمكن ادراج هذه االزرار في اي صفحه من صفحات الموقع وغالبا ما ازرار االفعال
يستفاد منها لتكون ارتباطات تشعبيه )(Interactive Buttons
الدراج نص متحرك في صفحات الموقع النص المتحرك
)(Marquee
يضاف الوقت والتاريخ الى صفحة الويب ليظهر وقت وتاريخ تصميم الوقت والتاريخ
الصفحه واثناء العرض يظهر وقت وتاريخ اخر تعديل على الصفحه Date and Time
يضاف نموذج البحث الى صفحه الويب لنتمكن من البحث عن الملفات نموذج بحث
والنص داخل صفحات الموقع Search Form
عداد لمتصفحي الموقع
HIT COUNTER
يكون العداد غالبا في الصفحه الرئيسيه للموقع
الدراج عداد للصفحه نقوم بالخطوات التاليه-:
فتح الموقع من خالل برمجية الشيربوينت
فتح الصفحه المراد اضافة العداد اليها
Insert → Web Component → Hit Counter → .1
.2اختيار الشكل المناسب للعداد
.3الضغط على زر Finish
.4تعديل تصميم العداد
2 خطوات اضافة عداد للمتصفحين
1
3 فتح الموقع من خالل الشيربوينت
فتح الصفحه المراد اضافة العداد
اليها
5 تحديد مكان ادراج العداد .1
4 Insert .2
Web Component .3
Hit Counter .4
اختيار الشكل المناسب للعداد .5
الضغط على زر Finish .6
6
لتغيير تصميم العداد
من هذه النافذه نستطيع تغيير تصميم
العداد وتفعيل كال من:
:Reset Counter to .1لتحديد قيمة
بدء العداد
:Fixed number of .2لتحديد
1 اقصى عدد لخانات العداد
2 من الشكل المجاور:
• بدء العداد ( 0رقم الزائر االول ) 1
• عدد الخانات , 5اذا اقصى قيمه للعداد
هو 99999
ازرار االفعال
INTERACTIVE BUTTONS
يمكن ادراج هذه االزرار في اي صفحه من صفحات الموقع وغالبا ما يستفاد منها لتكون
ارتباطات تشعبيه
الدراج مثل هذه االزرار لصفحه ما نقوم بالخطوات التاليه-:
.1فتح الموقع من خالل برمجية الشيربوينت
.2فتح الصفحه المراد اضافة الزرعليها
Insert → Web Component → Dynamic Effects → Interactive Button .3
.4الضغط على زر Finish
.5تعديل تصميم الزر
2
طريقة اضافة زر افعال
3
1
فتح الموقع من خالل الشيربوينت
فتح الصفحه المراد اضافة العداد
5 اليها
.1تحديد مكان ادراج الزر
4 Insert .2
4 Web Component .3
Dynamic Effects .4
Interactive Button .5
.6الضغط على زر Finish
6
لتعديل تصميم الزر
1 2 3
من هذه النافذه نستطيع تغيير تصميم الزر
وهذه النافذه تحتوي على 3نوافذ هي:
:Button .1الختيار خصائص الزر
: Font .2لتنسيق النص الظاهر على الزر
: Image .3لتعديل ابعاد الزر العرض
واالرتفاع
لتعديل تصميم الزر
نافذة BUTTON
1
من نافذه Buttonنستطيع تحديد الخصائص
التاليه:
:Previewمعاينة الزر .1
2 :Buttonsنمط الزر .2
3 :كتابة النص المراد اظهاره على الزر Text .3
:تحديد االرتباط التشعبي Link .4
4
لتعديل تصميم الزر
نافذة FONT
من نافذه Fontنستطيع تنسيق النص الظاهر
على الزر حسب التالي:
:نوع الخط Font .1
:Font Styleنمط الخط .2
1 3 :حجم الخط Size .3
2
: Original Font Colorلون النص .4
: Hovered Font Colorلون النص عند .5
تمرير الفأره على الزر
: Pressed Font Colorلون النص عند .6
الضغط على الزر
: Horizontal Alignmentموقع النص .7
4 5 6 افقيا على الزر (يمين – وسط – يسار)
: Vertical Alignmentموقع النص .8
راسيا على الزر (اعلى – وسط – اسفل)
7 8
لتعديل تصميم الزر
نافذة IMAGE
1 2
من نافذه Imageنستطيع تحديد ابعاد الزر
:تحديد عرض الزر Width .1
:تحديد ارتفاع الزر Height .2
النص المتحرك
MARQUEE
الدراج نص متحرك في صفحات الموقع ولعمل ذلك نقوم بالخطوات التاليه-:
فتح الموقع من خالل برمجية الشيربوينت .1
فتح الصفحه المراد اضافة الزرعليها .2
Insert → Web Component → Dynamic Effects → Marquee .3
الضغط على زر Finish .4
تعديل تصميم النص المتحرك .5
2
خطوات اضافة النص المتحرك
3
1
5
4 5
فتح الموقع من خالل الشيربوينت
فتح الصفحه المراد اضافة العداد اليها
.1تحديد النص المراد تحريكه
Insert .2
Web Component .3
Dynamic Effects .4
Marquee .5
6 .6الضغط على زر Finish
Next
خصائص النص المتحرك
هذه النافذه تمكننا من تحديد الخصائص التاليه:
:النص المراد تحريكه Text .1
1 :Direction .2تحديد اتجاه الحركه
• : leftالحركه من اليمين نحو اليسار
2 • : Rightالحركه من اليسارنحو اليمين
: Speed .3
• : Delayالفتره الزمنيه بين كل حركه
4 والتي تليها
• :Amountمقدار الخطوه بين كل حركه
والتى تليها
3 : Behavior .4تحديد شكل الحركه
• : Scrollحركه دائريه
• :Slideحركه انزالقيه من بداية شريط
الحركه الى نهايته
6 • : Alternateحركه تناوبيه من البداية الى
5 النهايه وبالعكس
: Size .5لتحديد عرض وارتفاع شريط الحركه
7 • : Widthتحديد عرض شريط الحركه
• :Heightتحديد ارتفاع شريط الحركه
: Repeat .6عدد مرات نكرار الحركه
:Background .7اختيار لون خلفية شريط
الحركه
الوقت والتاريخ
DATE AND TIME
يضاف الوقت والتاريخ الى صفحة الويب ليظهر وقت وتاريخ تصميم الصفحه واثناء
العرض يظهر وقت وتاريخ اخر تعديل على الصفحه والدراج الوقت والتاريخ نقوم
بالخطوات التاليه-:
.1فتح الموقع من خالل برمجية الشيربوينت
.2فتح الصفحه المراد اضافة الوقت والتاريخ لها
Insert → Web Component → Included content→ Date and Time .3
.4الضغط على زر Finish
2
خطوات اضافة الوقت والتاريخ
1
3
5
5
فتح الموقع من خالل الشيربوينت
4 فتح الصفحه المراد اضافة العداد اليها
.1تحديد مكان اضافة الوقت
والتاريخ
Insert .2
Web Component .3
Included Content .4
Date and Time .5
6 .6الضغط على زر Finish
Next
خصائص الوقت والتاريخ
1
من هذه النافذه يمكن تحديد الخصائص التاليه:
2 Display .1
• Date this page was last
:editedليتم تحديث الوقت والتاريخ
حسب اخر تعديل على الصفحه
• Date this page was last
:automatically updatedليتم
3 تحديث الوقت والتاريخ حسب اخر تحديث
لنشر الصفخهعلى االنترنت
:Date format .2تحديد نمط التاريخ
: Time format .3تحديد نمط الوقت
نموذج البحث
SEARCH FORM
يضاف نموذج البحث الى صفحه الويب لنتمكن من البحث عن الملفات والنص داخل
صفحات الموقع ولعمل ذلك نقوم بالخطوات التاليه-:
.1فتح الموقع من خالل برمجية الشيربوينت
.2فتح الصفحه المراد اضافة نموذج البحث اليها
Insert → Web Component → Web Search→ Current Web .3
.4الضغط على زر Finish
2
طريقة اضافة نموذج البحث
3
1
5
فتح الموقع من خالل الشيربوينت
4 فتح الصفحه المراد اضافة العداد اليها
تحديد مكان اضافة نموذج .1
البحث
Insert .2
Web Component .3
Web Search .4
Current Web .5
6 الضغط على زر Finish .6
Next
خصائص نموذج البحث
1 2
نافذه خصائص نموذج البحث تحتوي على
نافذتين هما:
:Search Form Properties .1
نافذة تصميم نموذج البحث
: Search Results .2نافذة تصميم
نتيجة البحث
Next
تعديل خصائص نموذج البحث
نافذة تصميم نموذج البحث Search Form Properties
1
من نافذة تصميم نموذج البحث وتتكون من:
:Label for Input .1اضافة جمله توضيحيه
2
لشريط البحث
:Width in characters .2تحديد عرض
صندوق البحث
Label for “Start Search” button .3
3 :كتابة النص المراد اظهاره على زر بدء البحث
4 : Label for “Rest” button .4
كتابة النص المراد اظهاره على زر حذف ما تم
كتابته في صندوق البحث العادة كتابة ما نريد مره
اخرى
تعديل خصائص نموذج البحث
نافذة تصميم نتيجة البحث Search Results
1
من نافذة تصميم نتيجة البحث وتتكون من:
2 :Word list to searchتحديد مكان البحث .1
:Date formatتحديد نمط تاريخ انشاء الملف .2
3 : Time formatتحديد نمط وقت انشاء الملف .3
: Display scoreالظهار رقم يمثل مدى .4
4 تطابق النتيجه
5
: Display File dateالظهار تاريخ /وقت .5
تخزين الملف
6 :Display file sizeالظهار حجم الملف .6
بوحدة كيلو بايت KB
مثال عملي على مكونات صفحة الويب
WEB PAGE COMPONENTS
اضغط لمشاهدة فيديو
تعليمي لما سبق
مثال عملي على مكونات صفحة الويب
WEB COMPONENTS
اضغط للحصول على ملف التمرين
Worksheet
WEB COMPONENTS
مثال عملي على مكونات صفحة الويب
WEB COMPONENTS
اضغط للحصول على حل
التمرين
