1
00:00:03,650 --> 00:00:08,240
قد يكون لديك عدة أسباب لفت انتباه الزوار

2
00:00:08,240 --> 00:00:11,890
إلى أجزاء معينة من موقع الويب الخاص بك أو ربما كنت ترغب

3
00:00:11,890 --> 00:00:16,370
في تنبيه المستخدمين حول بعض المعلومات أو قد ترغب في إبقاء

4
00:00:16,370 --> 00:00:22,150
المستخدمين على علم بالتقدم المحرز في العملية التي بدأها على موقع الويب الخاص بك.

5
00:00:22,150 --> 00:00:25,840
دعونا ننظر إلى بعض الآليات المختلفة التي

6
00:00:25,840 --> 00:00:30,750
يوفرها bootstrap لهذا النوع من العمليات.

7
00:00:30,750 --> 00:00:38,810
يحتوي Bootstrap على العديد من المكونات المختلفة التي تمكننا من إبقاء المستخدمين على علم.

8
00:00:38,810 --> 00:00:42,440
لدينا شارات تسمح لنا لفت انتباه

9
00:00:42,440 --> 00:00:46,550
المستخدمين إلى آخر التحديثات لصفحة الويب الخاصة بنا.

10
00:00:46,550 --> 00:00:48,365
لدينا

11
00:00:48,365 --> 00:00:52,010
رسائل التنبيه والخطأ والتحذير التي يمكن تسليمها للمستخدمين في حالة

12
00:00:52,010 --> 00:00:56,470
قيامهم بعمليات غير مسموح بها.

13
00:00:56,470 --> 00:01:01,870
وأيضا، قد نستخدم أشرطة التقدم لإبقاء المستخدمين على

14
00:01:01,870 --> 00:01:08,135
علم بالتقدم المحرز في أي العمليات التي بدأها على موقعنا على الانترنت.

15
00:01:08,135 --> 00:01:11,455
دعونا ننظر إلى هذا بمزيد من التفصيل بعد ذلك.

16
00:01:11,455 --> 00:01:15,800
الشارات هي وسيلة سهلة لإضافة كمية صغيرة من

17
00:01:15,800 --> 00:01:21,085
المعلومات إلى موقع الويب الخاص بك لجذب انتباه الزوار.

18
00:01:21,085 --> 00:01:24,710
على سبيل المثال، يمكنك أن ترى أننا قد أضفنا بضع شارات إلى

19
00:01:24,710 --> 00:01:30,890
هذا الوصف للطبق هنا على صفحتنا الرئيسية حتى

20
00:01:30,890 --> 00:01:37,480
تتمكن من رؤية أن لدينا شارة حمراء اللون لفت انتباه المستخدمين إلى

21
00:01:37,480 --> 00:01:40,495
حقيقة أن هذا هو البند الساخن في القائمة

22
00:01:40,495 --> 00:01:44,605
وربما حتى إعلامهم عن سعر القائمة.

23
00:01:44,605 --> 00:01:51,455
يمكن إضافة هذا النوع من المعلومات الصغيرة إلى موقع الويب الخاص بك باستخدام شارة.

24
00:01:51,455 --> 00:01:52,960
على سبيل المثال،

25
00:01:52,960 --> 00:02:00,400
يتم إنشاء شارة حمراء هنا باستخدام فترة مع شارة الفئات وشارة الخطر.

26
00:02:00,400 --> 00:02:04,495
يمكنك استخدام الألوان الأخرى المختلفة المضمنة في

27
00:02:04,495 --> 00:02:11,945
إطار bootstrap لإنشاء شارات من عدة ألوان مختلفة.

28
00:02:11,945 --> 00:02:18,075
وبالمثل، يمكنك استخدام شارة حبوب منع الحمل التي تخلق مستطيل مستدير كما ترى هنا،

29
00:02:18,075 --> 00:02:21,700
ويمكن القيام بذلك عن طريق تطبيق شارة،

30
00:02:21,700 --> 00:02:26,000
فئة حبوب منع الحمل شارة إليها جنبا إلى جنب مع فئة شارة.

31
00:02:26,000 --> 00:02:30,655
التنبيهات هي طريقة أخرى لإعلام المستخدمين عن المعلومات.

32
00:02:30,655 --> 00:02:37,245
على سبيل المثال، يمكن إنشاء تنبيه باستخدام مكون التنبيه

33
00:02:37,245 --> 00:02:45,370
الذي يمكن إنشاؤه ببساطة عن طريق تطبيق التنبيه مع تحذير التنبيه على سبيل المثال،

34
00:02:45,370 --> 00:02:50,285
في هذا المثال أن ترى تحذير إنشاء تنبيه أصفر اللون.

35
00:02:50,285 --> 00:02:57,075
يمكنك تطبيق مرة أخرى الخطر الأساسي والألوان التمهيد الأخرى هناك.

36
00:02:57,075 --> 00:02:59,955
ثم فئة التنبيه غير المسموح بها،

37
00:02:59,955 --> 00:03:06,190
يسمح لك بتضمين فئة هناك التي يمكن للمستخدم النقر عليها لرفض تنبيه.

38
00:03:06,190 --> 00:03:08,140
لدعم هذه العملية،

39
00:03:08,140 --> 00:03:14,625
تحتاج أيضا إلى تضمين زر في التنبيه الخاص بك كما ترون داخل هذا div،

40
00:03:14,625 --> 00:03:16,740
قمنا بتضمين هذا الزر هنا.

41
00:03:16,740 --> 00:03:23,505
ويمكن تنسيق محتويات التنبيه باستخدام HTML القياسية كما ترون هنا.

42
00:03:23,505 --> 00:03:27,490
لذلك، وهذا يتيح لنا إنشاء تنبيه على صفحة الويب الخاصة بنا.

43
00:03:27,490 --> 00:03:32,320
لذا, لتلخيص, تنبيه يمكن إنشاؤها من قبل تطبيق فئة التنبيه

44
00:03:32,320 --> 00:03:37,585
جنبا إلى جنب مع فئات تنبيه مؤهلة إضافية,

45
00:03:37,585 --> 00:03:40,560
والتي تمكنك من إنشاء تنبيهات بألوان مختلفة.

46
00:03:40,560 --> 00:03:43,145
يمكننا أيضًا تضمين روابط في تنبيهاتنا.

47
00:03:43,145 --> 00:03:46,110
يمكننا أيضا جعل التنبيه غير مسموح به باستخدام

48
00:03:46,110 --> 00:03:51,260
فئة التنبيه غير المسموح به بما في ذلك زر الصليب داخل تنبيهنا.

49
00:03:51,260 --> 00:03:55,360
وبالمثل، يتم تضمين أشرطة التقدم في المواقع الإلكترونية لإبقاء

50
00:03:55,360 --> 00:03:59,680
المستخدمين على علم بالتقدم المحرز في كل ما بدأناه على الموقع.

51
00:03:59,680 --> 00:04:04,100
على سبيل المثال، إذا كنت تقوم بتحميل ملف إلى موقع ويب،

52
00:04:04,100 --> 00:04:08,105
فقد ترغب في إبقاء المستخدم على علم بمدى

53
00:04:08,105 --> 00:04:12,780
اكتمال تحميل الملف من خلال عرض شريط التقدم على الموقع.

54
00:04:12,780 --> 00:04:16,780
لذا،

55
00:04:16,780 --> 00:04:22,155
يتم إنشاء شريط تقدم في bootstrap عن طريق تطبيق فئة التقدم على div وداخله يمكننا تطبيق

56
00:04:22,155 --> 00:04:26,265
div داخلي آخر مع شريط تقدم الفئة

57
00:04:26,265 --> 00:04:30,695
والسماح أيضًا بتمييزها باستخدام أشياء مثل

58
00:04:30,695 --> 00:04:34,890
شريط التقدم المخطط ثم يمكنك تطبيق اللون

59
00:04:34,890 --> 00:04:40,180
شريط التقدم عن طريق تحديد اللون كما واصلة BG واللون.

60
00:04:40,180 --> 00:04:44,910
لذلك، في هذه الحالة يتم تطبيق خطر bg على شريط التقدم هذا.

61
00:04:44,910 --> 00:04:47,150
يمكننا أيضا جعل جزء التقدم مخطط،

62
00:04:47,150 --> 00:04:49,395
يمكننا أيضا تحريك شريط التقدم،

63
00:04:49,395 --> 00:04:54,100
وأيضا تحديد مقدار شريط التقدم هذا يحتاج إلى أن يكون في الشكل.

64
00:04:54,100 --> 00:04:58,015
لذلك، عن طريق تغيير قيمة العرض هذه

65
00:04:58,015 --> 00:05:04,925
ديناميكيًا، يمكنك إنشاء شريط تقدم يحافظ على تحديث نفسه على صفحة الويب.

66
00:05:04,925 --> 00:05:08,350
لذلك، لتلخيص، يمكن إنشاء شريط التقدم عن طريق

67
00:05:08,350 --> 00:05:12,030
تطبيق فئة التقدم على div وداخل

68
00:05:12,030 --> 00:05:14,260
هناك div الداخلي الذي تقوم بتطبيق

69
00:05:14,260 --> 00:05:18,800
فئة شريط التقدم سيمكنك من إنشاء شريط التقدم.

70
00:05:18,800 --> 00:05:22,450
يمكنك حتى تكديس أشرطة التقدم متعددة معا

71
00:05:22,450 --> 00:05:28,325
لإنشاء شريط التقدم مكدسة وأيضا تطبيق ألوان مختلفة على شريط التقدم وأيضا

72
00:05:28,325 --> 00:05:32,865
يمكن أن يكون لها مظهر مختلف لشريط

73
00:05:32,865 --> 00:05:36,570
التقدم باستخدام فئة شريط التقدم مخطط وأيضا شريط التقدم

74
00:05:36,570 --> 00:05:41,375
فئة الرسوم المتحركة لتحريك المشارب على شريط التقدم لدينا.

75
00:05:41,375 --> 00:05:45,515
الآن بعد أن نظرنا في طرق مختلفة لتنبيه المستخدمين،

76
00:05:45,515 --> 00:05:50,925
دعونا نفعل ممارسة بسيطة بعد ذلك واستخدام شارات

77
00:05:50,925 --> 00:05:58,090
في صفحة الويب الخاصة بنا لجذب انتباه المستخدمين.