العناصر¶
تساعد العناصر في تنظيم المحتوى وعرضه بشكل فعال. وهي تتراوح من المكونات النصية مثل العناوين و:ref:القوائم <website/elements/lists> و:ref:تمييز النص <website/elements/text_highlights> إلى المكونات التفاعلية مثل الأزرار و:ref:الروابط <website/elements/links>. يمكن أيضاً إضافة عناصر مرئية مثل الصور و:ref:الأيقونات <website/elements/icons> و:ref:مقاطع الفيديو <website/elements/videos> و:ref:الرسوم المتحركة <website/elements/animations> لتحسين عرض المحتوى وتنظيمه.
لإضافة عنصر موقع إلكتروني أو تعديله:
انتقل إلى صفحة الموقع الإلكتروني ذات الصلة وانقر على Edit.
انقر على القسم في الصفحة حيث تريد إضافة عنصر أو تعديله.
قم بإجراء التغييرات اللازمة.
انقر على Save.
ملاحظة
يتم تعريف الأنماط الافتراضية للعناوين والأزرار والروابط ونص الفقرة، على سبيل المثال، في علامة تبويب السمة في محرر الموقع الإلكتروني.
العناوين¶
تحدد العناوين الرؤوس وتنظم محتوى الموقع الإلكتروني إلى مستويات مختلفة للوضوح والبنية. لإدراج عنوان، اكتب /title، واختر نمط العنوان (Heading 1 أو Heading 2 أو Heading 3)، واكتب النص.
نصيحة
بدلاً من ذلك، اكتب النص وحدده، واختر النمط المناسب من قسم Inline Text في علامة التبويب Customize في محرر الموقع الإلكتروني. تتوفر أيضاً خيارات تنسيق إضافية، مثل الخطوط والألوان، في هذا القسم.
الصور¶
لإدراج صورة:
اكتب
/image.ابحث في قاعدة بيانات Unsplash أو انقر على تحميل صورة لاختيار ملف من صورك المحلية.
انقر فوق إضافة.
لتخصيص الصورة، انقر على الصورة وعدّل الخيارات في قسم الصورة في محرر الموقع الإلكتروني. على سبيل المثال:
استبدل الصورة.
حدد وسم بديل في حقل الوصف.
أدخل وسم عنوان في حقل تلميح الأداة. سيظهر هذا النص عندما يمرر الزوار مؤشر الماوس فوق الصورة.
أضف شكلاً؛ بعض الأشكال تسمح أيضاً بتخصيص اللون.
اضبط عرض الصورة، على سبيل المثال، لتحسين الأداء. قد يُقترح حجم أصغر إذا كان كافياً للعرض.
غيّر حجم الصورة باستخدام أداة التحويل.
اضبط المسافة البادئة لإضافة مساحة (بالبكسل) حول الصورة.
إلخ.
مقاطع الفيديو¶
لإضافة فيديو، اكتب /video، أدخل عنوان URL، وقم بتفعيل الخيارات المطلوبة:
Autoplay: لتشغيل الفيديو تلقائيًا عند الوصول إلى الصفحة. يتم كتم صوت الفيديو تلقائيًا بشكل افتراضي.
Loop: لتشغيل الفيديو بشكل متكرر.
Hide player controls
Hide fullscreen button
البدء عند: لتحديد الطابع الزمني الذي يجب أن يبدأ عنده الفيديو، بتنسيق
MM:SS.
الأيقونات¶
لإدراج أيقونة، اكتب /image، انتقل إلى علامة التبويب Icons، حدد أيقونة، وانقر فوق Add. لتعديل أيقونة، انقر فوقها واستخدم قسم Icon في محرر الموقع الإلكتروني لتخصيص الخيارات، مثل Color، Size، Animations، Shape، وما إلى ذلك.
الروابط¶
تُستخدم الروابط لربط الصفحات والموارد المختلفة، وتوجيه الزوار وتحسين التنقل. لإضافة رابط، اكتب /link، ثم في النافذة المنبثقة التي تفتح، أدخل Label الرابط وأضف URL or Email. اكتب / للبحث عن صفحة و # للربط anchor.
نصيحة
بشكل افتراضي، يتم تعيين حقل Style على Link. حدد نمطًا مختلفًا لتحويل الرابط إلى button.
القوائم¶
تساعد القوائم في تنظيم المحتوى بوضوح، مما يجعل المعلومات أسهل في القراءة ويحسن بنية صفحات الويب. اكتب /list واختر من بين ثلاثة أنواع مختلفة من القوائم: Bulleted lists، Numbered lists، أو Checklists.
تمييز النص¶
يمكن إضافة التمييز إلى العناوين والنصوص باستخدام قسم Inline Text في محرر الموقع الإلكتروني. لإضافة تمييز:
حدد النص أو العنوان الذي تريد تمييزه.
في محرر الموقع الإلكتروني، انقر فوق Highlight.
حدد نمط التمييز.
عدّل Color.
اختر Thickness.
الرسوم المتحركة¶
تُستخدم الرسوم المتحركة لإضافة حركة إلى building blocks وعناصر الموقع الإلكتروني مثل الصور والنصوص. تتوفر ثلاثة أنواع من الرسوم المتحركة: On Scroll، On Appearance، و On Hover (للصور فقط).
لإضافة رسم متحرك إلى عنصر من عناصر الموقع الإلكتروني:
انقر فوق العنصر.
في محرر الموقع الإلكتروني، انتقل إلى القسم ذي الصلة بالعنصر (مثل Button، Column، Inline Text، إلخ).
في حقل Animation، حدد نوع الحركة المطلوب.
خصص إعدادات الحركة حسب الحاجة. تختلف الخيارات المتاحة بناءً على نوع الحركة المحدد.
الحركات عند التمرير¶
بالنسبة للحركات عند التمرير، من الممكن:
اختر In لإضافة الحركة عندما يدخل العنصر إلى الشاشة و:guilabel:
Outلإضافتها عندما يغادر الشاشة.حدد Effect.
اختر Direction للتأثير.
اضبط Intensity للتأثير.
حدد Scroll Zone، حيث تمثل القيمة الأولى النسبة المئوية للشاشة المعروضة عند بدء التأثير، وتمثل القيمة الثانية نسبتها المئوية عند النهاية.
الحركات عند الظهور¶
بالنسبة للحركات عند الظهور، من الممكن:
الاختيار من بين تأثيرات مختلفة.
اختر Direction للتأثير.
اختر خيار Trigger لتحديد وقت حدوث الحركة: إما First Time only أو Every Time.
اضبط Intensity للتأثير.
إذا كنت تريد تشغيل الحركة بعد عدد من الثواني، حدد هذا العدد في حقل Start After.
اختر Duration للحركة.
الحركات عند التمرير (للصور فقط)¶
يمكن إضافة الحركات On hover إلى images. يمكنك اختيار Effect للحركة، بالإضافة إلى Color و:guilabel:Stroke Width.
انظر أيضًا