تمرين - إنشاء تنقل جانبي

مكتمل

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

الأهداف التعليمية

الهدف من هذه التمارين هو أن تتعلم كيفية:

• تحديد تنقل فِي موقع الويب الثانوي وتعديله.

• استخدم التطبيق "إدارة المدخل" لإضافة ارتباطات ويب جديدة إلى مجموعة ارتباطات الويب الموجودة.

• إنشاء صفحة ويب باستخدام قائمة تنقل مضمنة باستخدام استوديو تصميم Power Pages.

المتطلبات الأساسية

في هذا التمرين، ستحتاج إلى إعداد المعلمات التالية فِي بيئتك:

• موقع ويب Power Pages متوفر. إذا لم يكن لديك موقع ويب متاح، فاتبع إرشادات إنشاء موقع باستخدام Power Pages.
• الوصول إلى استوديو تصميم Power Pages.

ملاحظة

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

السيناريو

قامت مؤسستك بتوفير موقع ويب Power Pages وإعداده. وأنت تريد بدء تعديل التنقل فِي موقع الويب لتوفير وصول سريع إلى المعلومات المستخدمة بشكل متكرر.

لتعديل التنقل فِي موقع الويب بما يتناسب مع المتطلبات المؤسسية، سيلزمك إكمال المهام التالية:

• استخدم التطبيق "إدارة المدخل" لتعديل مجموعة ارتباطات ويب التنقل الثانوي الموجودة لتضمين صفحات الويب الموجودة وارتباط خارجي.

• أنشئ صفحة جديدة باستخدام استوديو تصميم Power Pages.

• أضف مكوناً من عمودين إلى الصفحة الجديدة.

• قم بتعديل التعليمات البرمجية المصدر للصفحة للإشارة إلى التنقل الثانوي.

تحديث مجموعة ارتباطات الويب

لتحديث مجموعة ارتباطات الويب، اتبع الخطوات التالية:

1. سجِّل الدخول إلى Power Pages.

2. حدّد البيئة الصحيحة فِي الزاوية العلوية اليمنى.

3. حدّد قائمة الحذف (...) لموقع الويب ثم حدّد إدارة المدخل. لا تغلق نافذة صفحة Power Pages الرئيسية.

4. حدّد موقع صفوف مجموعات ارتباطات الويب.

5. حدّد صف مجموعات ارتباطات الويب المسمى التنقل الثانوي وافتحه.

6. إذا لم يكن الصف موجواً، فحدّد + جديد لإنشاء صف جديد باسم التنقل الثانوي.

   

7. حدّد علامة التبويب ارتباطات‬.

8. حدّد الزر ارتباط ويب جديد.

9. أدخل المعلومات التالية:

   • الاسم - المنتج أ

   • مجموعة ارتباطات الويب - التنقل الثانوي (الذي يجب أن يكون محدداً بالفعل)

   • حالة النشر - منشور

   • الصفحة - الصفحة الفرعية 1

   ملاحظة

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

10. حدّد حفظ وإغلاق.

    

11. حدّد الزر ارتباط ويب جديد مرة أخرى.

12. أدخل المعلومات التالية:

    • الاسم - المنتج ب

    • مجموعة ارتباطات الويب - التنقل الثانوي (الذي يجب أن يكون محدداً بالفعل)

    • حالة النشر - منشور

    • الصفحة - الصفحة الفرعية 2

13. حدّد حفظ وإغلاق.

14. حدّد الزر ارتباط ويب جديد مرة أخرى.

15. أدخل المعلومات التالية:

    • الاسم -‏ Microsoft

    • مجموعة ارتباطات الويب - التنقل الثانوي (الذي يجب أن يكون محدداً بالفعل)

    • حالة النشر - منشور

    • عنوان URL الخارجي - https://www.microsoft.com

16. حدّد حفظ وإغلاق.

إنشاء صفحة الويب

لإنشاء صفحة الويب، اتبع الخطوات التالية:

1. قم بالتبديل إلى نافذة صفحة Power Pages الرئيسية.

2. حدّد تحرير لفتح استوديو تصميم Power Pages.

3. حدّد مساحة عمل الصفحات، ثم حدّد صفحة + صفحة.

4. في مربع حوار الصفحة الجديدة، أكمل الإجراءات التالية:

   1. أدخل ارتباطات المنتجات باعتبارها اسم الصفحة.

   2. حدّد تخطيط البدء من فارغ.

   3. حدّد إضافة.

إضافة مكون عمود وإضافة التنقل

لإضافة مكون عمود وإضافة تنقل، اتبع الخطوات التالية:

1. حدّد تحرير التعليمة البرمجية لتشغيل محرر Visual Studio Code.

2. في محرر التعليمات البرمجية، حدّد عنصر <div> الداخلي.

3. أضف {% include "weblink_list_group" weblink_set_name: "Secondary Navigation" %} علامة Liquid إلى السطر لكي تظهر مثل المثال التالي:

   <div class="col-md-12 columnBlockLayout" style="display: flex; flex-direction: column;">
     {% include "Weblink List Group" weblink_set_name: "Secondary Navigation" %}
   </div>
   

4. أغلق علامة التبويب Visual Studio Code. حدّد حفظ فِي حالة المطالبة بذلك.

5. حدّد مزامنة لمزامنة التغييرات.

6. حدّد معاينة > سطح المكتب. يجب أن تظهر صفحة بها ارتباطات لصفحات الويب وعنوان URL الخارجي.

   

ملاحظة

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