Search the store

Documentation

دليل استخدام قالب أُنس

كل ما تحتاجه لتخصيص القالب: الأقسام، الإعدادات العامة، الصفحات، الفيديو، والحل السريع للمشاكل.

كل ما تحتاجه لتخصيص قالب «أُنس» لمتاجر زد: الأقسام، الإعدادات العامة، الصفحات، المميزات، الفيديو، ونصائح الحل السريع. هذا الدليل يخص الإصدار النهائي من القالب (Zid Vitrin Theme).

1. البداية السريعة ومفاهيم المحرر

القالب مبني على Vitrin (Jinja) ويعمل بالعربية (RTL) والإنجليزية (LTR). كل شيء قابل للتحكم من محرر القالب في زد، بدون كتابة كود.

نوعان من الإعدادات

النوعأين تجدهيؤثر على
إعدادات القسماضغط على القسم داخل الصفحة الرئيسيةذلك القسم فقط (نصوص، صور، فيديو، ألوان).
إعدادات الصفحة / القالب (عامة)لوحة «إعدادات الصفحة» في المحرر: الألوان والشكل، بطاقات المنتجات، صفحة التصنيف، صفحة المنتج، دليل المقاسات، السلة، عامكل الموقع: صفحات المنتج والسلة والتصنيف والكروت والفوتر.
الهيدر والفوترأعلى الصفحة / أسفل الصفحة في المحررالشعار، الإعلان، الروابط، ألوان الفوتر…

اللغتان

المحتوى النصي يُحفظ لكل لغة. بعد ضبط النسخة العربية استخدم أيقونة «نسخ القسم إلى اللغة الإنجليزية» (أو العكس) ثم ترجم النصوص.

إعداد أول مرة (10 دقائق)

  • ارفع الشعار وحدد عرضه من إعدادات الهيدر.
  • أنشئ قائمة التنقل الرئيسية من لوحة زد (تظهر في الهيدر والفوتر والقائمة الجانبية).
  • فعّل المفضلة وطرق الدفع من إعدادات المتجر في زد إن رغبت (تظهر تلقائيًا في الكروت والفوتر والسلة).
  • في الرئيسية: عدّل الواجهة (hero) ثم أضف منتجاتك في المجموعة المميزة وكاروسيل المنتجات.
  • اضبط ألوان الأزرار من «الألوان والشكل».
  • راجع الصفحة على الجوال أولًا (أغلب الزوار).

2. أقسام الصفحة الرئيسية (14 قسمًا) مع الإعدادات

يمكنك إضافة الأقسام وإعادة ترتيبها وإخفائها من المحرر. الترتيب الافتراضي كما يلي:

واجهة رئيسية hero

واجهة الصفحة الرئيسية الكبيرة (الصورة أو الفيديو مع العنوان والزر). أول ما يراه الزائر.

واجهة رئيسية (ديسكتوب)
ديسكتوب
واجهة رئيسية (موبايل)
موبايل
  • ارفع صورة منفصلة للجوال (900×1400 تقريبًا) لقص أفضل، وصورة الكمبيوتر بعرض 2400px.
  • تحكم في موضع النص والزر (أفقي/رأسي) للكمبيوتر والجوال بشكل منفصل، وفي حجم العنوان والزر وألوانهم.
  • يمكن استبدال الصورة بفيديو: ارفعه، أو الصق رابط ملف mp4/webm أو رابط YouTube/Vimeo.
  • لو الفيديو ثقيل فعّل خيار «عرض الصورة بدل الفيديو على الجوال».
إعدادات القسم (32)
الإعدادالنوعملاحظة
نص صغيرنص
العنواننص
النص المساندنص طويل
نص الزرنص
رابط الزررابط
إخفاء الزرمربع تفعيل
إخفاء النص الصغيرمربع تفعيل
إخفاء النص المساندمربع تفعيل
الصورة (كمبيوتر)صورة
الصورة (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.
فيديو (رفع مباشر)فيديو (رفع)اختياري. تظهر الصورة قبل التشغيل وعلى الأجهزة التي توفر البيانات.
رابط فيديو (YouTube / Vimeo / ملف مباشر)نصرابط مباشر لملف mp4 / webm (من استضافتك مثل Bunny أو Cloudflare R2 أو Backblaze B2 أو Amazon S3) أو رابط YouTube أو Vimeo. يتغلب على الفيديو المرفوع.
عرض الصورة بدل الفيديو على الجوالمربع تفعيل
موضع الصورة على الجوالالمنتصف · الأعلى · الأسفل · اليسار · اليمينقائمة اختياريحدد الجزء الظاهر من الصورة عند القص.
قوة التظليل على الجوالخفيف · متوسط · قويقائمة اختياريساعد على وضوح النص فوق الصورة.
ارتفاع القسم على الجوالمدمج · قياسي · طويلقائمة اختيار
موضع المحتوى أفقيًا (كمبيوتر)البداية · المنتصف · النهايةقائمة اختيار
موضع المحتوى رأسيًا (كمبيوتر)الأعلى · المنتصف · الأسفلقائمة اختيار
محاذاة النص (كمبيوتر)تلقائي · البداية · المنتصف · النهايةقائمة اختيار
عرض المحتوى (كمبيوتر)ضيق · قياسي · عريضقائمة اختيار
ارتفاع القسم (كمبيوتر)مدمج · قياسي · ملء الشاشةقائمة اختيار
قوة التظليل (كمبيوتر)بدون · خفيف · متوسط · قويقائمة اختيار
حجم العنوانصغير · قياسي · كبيرقائمة اختيار
لون النصوصلوناتركه فارغًا للون الأبيض الافتراضي.
موضع الزر بالنسبة للنصمع النص · البداية · المنتصف · النهايةقائمة اختيار
شكل الزرممتلئ · إطار فقط · نص بخط سفليقائمة اختيار
حجم الزرصغير · قياسي · كبيرقائمة اختيار
لون خلفية الزرلون
لون نص الزرلون
موضع المحتوى رأسيًا (جوال)الأعلى · المنتصف · الأسفلقائمة اختيار
محاذاة المحتوى (جوال)البداية · المنتصف · النهايةقائمة اختيار
عرض الزر (جوال)كامل العرض · حسب النصقائمة اختيار

مساحات المنزل selection

ثلاث بطاقات كبيرة لمساحات أو تصنيفات رئيسية، تظهر بحركة عند التمرير على الكمبيوتر.

مساحات المنزل (ديسكتوب)
ديسكتوب
مساحات المنزل (موبايل)
موبايل
  • لكل بطاقة: صورة كمبيوتر وصورة جوال ورابط، ويمكن وضع فيديو للبطاقة عبر «رابط فيديو».
  • الصور بطول (رأسي) 4:5 تعطي أفضل نتيجة.
إعدادات القسم (17)
الإعدادالنوعملاحظة
العنواننص
نص أزرار البطاقاتنص
عنوان البطاقة 1نص
صورة البطاقة 1 (كمبيوتر)صورة
صورة البطاقة 1 (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.
رابط فيديو للبطاقة 1نصرابط مباشر لملف mp4 / webm (من استضافتك مثل Bunny أو Cloudflare R2 أو Backblaze B2 أو Amazon S3) أو رابط YouTube أو Vimeo. يتغلب على الفيديو المرفوع.
رابط البطاقة 1رابط
عنوان البطاقة 2نص
صورة البطاقة 2 (كمبيوتر)صورة
صورة البطاقة 2 (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.
رابط فيديو للبطاقة 2نصرابط مباشر لملف mp4 / webm (من استضافتك مثل Bunny أو Cloudflare R2 أو Backblaze B2 أو Amazon S3) أو رابط YouTube أو Vimeo. يتغلب على الفيديو المرفوع.
رابط البطاقة 2رابط
عنوان البطاقة 3نص
صورة البطاقة 3 (كمبيوتر)صورة
صورة البطاقة 3 (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.
رابط فيديو للبطاقة 3نصرابط مباشر لملف mp4 / webm (من استضافتك مثل Bunny أو Cloudflare R2 أو Backblaze B2 أو Amazon S3) أو رابط YouTube أو Vimeo. يتغلب على الفيديو المرفوع.
رابط البطاقة 3رابط

مشهد فيديو media_story

مشهد عريض بفيديو أو صورة مع عنوان ووصف.

مشهد فيديو (ديسكتوب)
ديسكتوب
مشهد فيديو (موبايل)
موبايل
  • الفيديو: ارفع ملف (حتى 10MB حسب Zid) أو ضع رابط YouTube/Vimeo أو رابط ملف مباشر.
  • على الجوال تظهر الصورة الثابتة، فعّل «تشغيل الفيديو على الجوال» إذا أردته متحركًا.
إعدادات القسم (9)
الإعدادالنوعملاحظة
نص صغيرنص
العنواننص
النص المساندنص طويل
فيديو (رفع مباشر)فيديو (رفع)اختياري. تظهر الصورة قبل التشغيل وعلى الأجهزة التي توفر البيانات.
رابط فيديو (YouTube / Vimeo / ملف مباشر)نصرابط مباشر لملف mp4 / webm (من استضافتك مثل Bunny أو Cloudflare R2 أو Backblaze B2 أو Amazon S3) أو رابط YouTube أو Vimeo. يتغلب على الفيديو المرفوع.
صورة الغلاف (كمبيوتر)صورة
صورة الغلاف (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.
موضع الصورة على الجوالالمنتصف · الأعلى · الأسفل · اليسار · اليمينقائمة اختياريحدد الجزء الظاهر من الصورة عند القص.
تشغيل الفيديو على الجوالمربع تفعيلافتراضيًا يعرض الجوال صورة الغلاف فقط لتوفير البيانات.

كوّن مجموعتك product_bundle

«كوّن مجموعتك»: الزائر يختار حتى 4 منتجات ويضيفها دفعة واحدة للسلة.

كوّن مجموعتك (ديسكتوب)
ديسكتوب
كوّن مجموعتك (موبايل)
موبايل
  • اختر المنتجات من منتقي المنتجات (4 على الأقل لتبدو كاملة).
  • تُضاف المنتجات للسلة بالمعرّف الأصلي لكل منتج؛ المنتجات ذات الخيارات تحتاج اختيار خيار من صفحة المنتج.
إعدادات القسم (6)
الإعدادالنوعملاحظة
نص صغيرنص
العنواننص
المنتجات (حتى 4)اختيار منتجات
لون الخلفيةلون
لون النصلون
عرض محتوى تجريبي عند عدم إضافة محتوىمربع تفعيليظهر المحتوى التجريبي دائمًا في المحرر. فعّل هذا الخيار لإظهاره في المتجر الفعلي والجوال أيضًا إلى أن تضيف محتواك.

تسوق حسب المساحة shop_by_collection

«تسوق حسب المساحة»: قائمة مساحات كبيرة تتبدل خلفيتها عند المرور (ديسكتوب) وبطاقات على الجوال.

تسوق حسب المساحة (ديسكتوب)
ديسكتوب
تسوق حسب المساحة (موبايل)
موبايل
  • أضف حتى 6 مساحات؛ لكل واحدة اسم وصورة كمبيوتر وصورة جوال ورابط وفيديو اختياري.
إعدادات القسم (2)
الإعدادالنوعملاحظة
العنواننص
المساحاتداخل كل عنصر: الاسم، الصورة (كمبيوتر)، الصورة (جوال)، الرابط، رابط فيديو (اختياري)قائمة عناصراتركها فارغة لعرض المساحات الافتراضية.

نص مع صورة text_with_image

نص مع صورة أو فيديو وزر.

نص مع صورة (ديسكتوب)
ديسكتوب
نص مع صورة (موبايل)
موبايل
  • الصورة الثانية (قطعة أثاث بخلفية شفافة PNG) تظهر عائمة على الكمبيوتر.
  • يمكنك استبدال الصورة الرئيسية بفيديو.
إعدادات القسم (14)
الإعدادالنوعملاحظة
العنواننص
النصنص طويل
نص الزرنص
رابط الزررابط
إخفاء الزرمربع تفعيل
الصورة الرئيسية (كمبيوتر)صورة
الصورة الرئيسية (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.
فيديو (رفع مباشر)فيديو (رفع)اختياري. تظهر الصورة قبل التشغيل وعلى الأجهزة التي توفر البيانات.
رابط فيديو (YouTube / Vimeo / ملف مباشر)نصرابط مباشر لملف mp4 / webm (من استضافتك مثل Bunny أو Cloudflare R2 أو Backblaze B2 أو Amazon S3) أو رابط YouTube أو Vimeo. يتغلب على الفيديو المرفوع.
عرض الصورة بدل الفيديو على الجوالمربع تفعيل
موضع الصورة على الجوالالمنتصف · الأعلى · الأسفل · اليسار · اليمينقائمة اختياريحدد الجزء الظاهر من الصورة عند القص.
صورة المنتج العائمةصورةالأفضل PNG بخلفية شفافة.
لون الخلفيةلون
لون النصلون

شريط العلامة brand_slider

شريط متحرك باسم العلامة وعبارة قصيرة.

شريط العلامة (ديسكتوب)
ديسكتوب
شريط العلامة (موبايل)
موبايل
  • يتوقف تلقائيًا لو المستخدم مفعّل «تقليل الحركة» في جهازه.
إعدادات القسم (4)
الإعدادالنوعملاحظة
اسم العلامةنصاتركه فارغًا لاستخدام اسم المتجر.
العبارةنص
لون الخلفيةلون
لون النصلون

الأسئلة الشائعة faq

الأسئلة الشائعة بجانب صورة أو فيديو.

الأسئلة الشائعة (ديسكتوب)
ديسكتوب
الأسئلة الشائعة (موبايل)
موبايل
  • أضف الأسئلة من القائمة؛ أول سؤال يكون مفتوحًا افتراضيًا.
إعدادات القسم (13)
الإعدادالنوعملاحظة
العنواننص
الوصفنص طويل
الصورة (كمبيوتر)صورة
الصورة (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.
فيديو (رفع مباشر)فيديو (رفع)اختياري. تظهر الصورة قبل التشغيل وعلى الأجهزة التي توفر البيانات.
رابط فيديو (YouTube / Vimeo / ملف مباشر)نصرابط مباشر لملف mp4 / webm (من استضافتك مثل Bunny أو Cloudflare R2 أو Backblaze B2 أو Amazon S3) أو رابط YouTube أو Vimeo. يتغلب على الفيديو المرفوع.
عرض الصورة بدل الفيديو على الجوالمربع تفعيل
عنوان قائمة الأسئلةنص
وصف قائمة الأسئلةنص طويل
الأسئلةداخل كل عنصر: السؤال، الإجابةقائمة عناصر
لون الخلفيةلون
لون النصلون
عرض محتوى تجريبي عند عدم إضافة محتوىمربع تفعيليظهر المحتوى التجريبي دائمًا في المحرر. فعّل هذا الخيار لإظهاره في المتجر الفعلي والجوال أيضًا إلى أن تضيف محتواك.

آراء العملاء testimonials

آراء العملاء بصورة وتقييم، مع أسهم وسحب.

آراء العملاء (ديسكتوب)
ديسكتوب
آراء العملاء (موبايل)
موبايل
  • كل رأي: صورة (كمبيوتر/جوال) أو فيديو، النص، الاسم، الوصف.
إعدادات القسم (4)
الإعدادالنوعملاحظة
الآراءداخل كل عنصر: الصورة (كمبيوتر)، الصورة (جوال)، الرأي، الاسم، الوصف، رابط فيديو (اختياري)قائمة عناصرأضف آراء عملائك الحقيقية. القسم يختفي إذا تُرك فارغًا.
لون الخلفيةلون
لون النصلون
عرض محتوى تجريبي عند عدم إضافة محتوىمربع تفعيليظهر المحتوى التجريبي دائمًا في المحرر. فعّل هذا الخيار لإظهاره في المتجر الفعلي والجوال أيضًا إلى أن تضيف محتواك.

المدونة blog

بطاقات مقالات المدونة (عنوان، مقتطف، صورة، رابط، تاريخ).

المدونة (ديسكتوب)
ديسكتوب
المدونة (موبايل)
موبايل
  • الروابط الفارغة تفتح صفحة المدونة /blogs.
إعدادات القسم (6)
الإعدادالنوعملاحظة
العنواننص
نص رابط المقالنص
المقالاتداخل كل عنصر: العنوان، المقتطف، الصورة، الرابط، التاريخقائمة عناصرأضف روابط مقالاتك. القسم يختفي إذا تُرك فارغًا.
لون الخلفيةلون
لون النصلون
عرض محتوى تجريبي عند عدم إضافة محتوىمربع تفعيليظهر المحتوى التجريبي دائمًا في المحرر. فعّل هذا الخيار لإظهاره في المتجر الفعلي والجوال أيضًا إلى أن تضيف محتواك.

صور التواصل social_feed

شبكة صور من حسابات التواصل أو أعمالك.

صور التواصل (ديسكتوب)
ديسكتوب
صور التواصل (موبايل)
موبايل
  • لكل عنصر صورة أو رابط فيديو، عنوان ونص ورابط.
إعدادات القسم (6)
الإعدادالنوعملاحظة
العنواننص
حساب التواصلنصمثال: @mystore
الصورداخل كل عنصر: الصورة، العنوان، النص، الرابط، رابط فيديو (اختياري)قائمة عناصرالقسم يختفي إذا تُرك فارغًا.
لون الخلفيةلون
لون النصلون
عرض محتوى تجريبي عند عدم إضافة محتوىمربع تفعيليظهر المحتوى التجريبي دائمًا في المحرر. فعّل هذا الخيار لإظهاره في المتجر الفعلي والجوال أيضًا إلى أن تضيف محتواك.

آراء متحركة reviews_glass

آراء بتصميم زجاجي فوق صورة أو فيديو خلفية.

آراء متحركة (ديسكتوب)
ديسكتوب
آراء متحركة (موبايل)
موبايل
  • ارفع خلفية للكمبيوتر وأخرى للجوال، أو فيديو خلفية.
إعدادات القسم (9)
الإعدادالنوعملاحظة
نص صغيرنص
العنواننص
صورة الخلفية (كمبيوتر)صورة
صورة الخلفية (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.
فيديو (رفع مباشر)فيديو (رفع)اختياري. تظهر الصورة قبل التشغيل وعلى الأجهزة التي توفر البيانات.
رابط فيديو (YouTube / Vimeo / ملف مباشر)نصرابط مباشر لملف mp4 / webm (من استضافتك مثل Bunny أو Cloudflare R2 أو Backblaze B2 أو Amazon S3) أو رابط YouTube أو Vimeo. يتغلب على الفيديو المرفوع.
عرض الصورة بدل الفيديو على الجوالمربع تفعيل
الآراءداخل كل عنصر: الصورة، الاسم، المدينة، الرأيقائمة عناصرالقسم يختفي إذا تُرك فارغًا.
عرض محتوى تجريبي عند عدم إضافة محتوىمربع تفعيليظهر المحتوى التجريبي دائمًا في المحرر. فعّل هذا الخيار لإظهاره في المتجر الفعلي والجوال أيضًا إلى أن تضيف محتواك.

تنبيه مهم: الأقسام الفارغة

لماذا بعض الأقسام تظهر في المحرر ولا تظهر في المتجر أو الجوال؟

في المحرر يعرض القالب محتوى تجريبيًا للأقسام الفارغة لتخيّل الشكل. في المتجر الفعلي تُخفى الأقسام التي لا تحتوي بيانات: المنتجات المميزة، الباقة، كاروسيل المنتجات، الأسئلة الشائعة، آراء العملاء، المدونة، صور التواصل، الآراء المتحركة.

الحل: أضف محتواك الحقيقي، أو فعّل «عرض محتوى تجريبي عند عدم إضافة محتوى» داخل القسم لإظهاره مؤقتًا في المتجر.

3. الهيدر والبحث والقائمة الجانبية والفوتر

الهيدر

الهيدر (ديسكتوب)
ديسكتوب
الهيدر (موبايل)
القائمة الجانبية (موبايل)
  • اللوجو في منتصف الهيدر على الجوال تمامًا مهما كان عدد الأيقونات.
  • قائمة التنقل تأتي من القائمة الرئيسية في زد، والعناصر الفرعية تظهر كقائمة ضخمة (Mega menu) على الكمبيوتر.
  • أيقونة السلة تعرض عدد المنتجات تلقائيًا، وتتحرك عند الإضافة.
  • أسفل القائمة الجانبية: الحساب واللغة والعملة مثبتان.

الشعار والأيقونات

الإعدادالنوعملاحظة
الشعارصورةاختياري. إذا تُرك فارغًا يظهر شعار المتجر من لوحة التحكم.
عرض الشعارشريط قيمةيُطبق على الشعار المرفوع.
إخفاء البحثمربع تفعيل
إخفاء الحسابمربع تفعيل
إخفاء اللغة والعملةمربع تفعيل
لون خلفية الرأسلونيُطبق بعد التمرير وفي الصفحات الداخلية.
لون نص الرأسلونيُطبق بعد التمرير وفي الصفحات الداخلية.

شريط الإعلانات

الإعدادالنوعملاحظة
الرسالة الأولىنصاتركها فارغة لإخفاء الشريط.
الرسالة الثانيةنصاختيارية. تتبدل مع الرسالة الأولى.
إخفاء شريط الإعلاناتمربع تفعيل

البحث المباشر

البحث المباشر (موبايل)
البحث أثناء الكتابة
  • النتائج تظهر أثناء الكتابة بعد حرفين (صورة، اسم، سعر) بدون الضغط على «بحث».
  • زر «عرض كل النتائج» يفتح صفحة نتائج كاملة. يمكن إخفاء البحث من إعدادات الهيدر.

الفوتر

الفوتر (ديسكتوب)
ديسكتوب
الفوتر (موبايل)
موبايل (أكورديون)
  • يتكوّن من: شريط الثقة، بلوك العلامة وأيقونات التواصل، أعمدة الروابط (روابط سريعة، المجموعات، الدعم، التواصل)، شعارات الدفع، الحقوق.
  • أيقونات التواصل والبريد والجوال تُؤخذ تلقائيًا من إعدادات المتجر في زد.
  • شعارات الدفع من طرق الدفع المفعّلة في زد.
  • تحكم كامل في الألوان: الخلفية، النص، العناوين، الروابط، لون المرور (Hover)، الخطوط الفاصلة.

محتوى التذييل

الإعدادالنوعملاحظة
نبذة عن المتجرنص طويلتظهر تحت اسم المتجر. التواصل الاجتماعي والبريد والجوال تُؤخذ من إعدادات المتجر.
روابط سريعة إضافيةداخل كل عنصر: النص، الرابطقائمة عناصر
عنوان قسم الدعمنص
روابط الدعمداخل كل عنصر: النص، الرابطقائمة عناصر
نص الحقوقنصاتركه فارغًا لعرض اسم المتجر.
عبارة جانبيةنص
عنوان الروابط السريعةنص
عنوان المجموعاتنص
إظهار اسم المتجر بدل الشعارمربع تفعيل
إخفاء أيقونات التواصلمربع تفعيل
إخفاء شريط المميزات (دفع آمن / شحن)مربع تفعيل
عناصر شريط المميزاتداخل كل عنصر: الأيقونة، النصقائمة عناصراتركها فارغة للعناصر الافتراضية.
إخفاء شعارات الدفعمربع تفعيل
لون خلفية التذييللون
لون النصوصلون
لون العناوينلون
لون الروابطلون
لون الروابط عند المرور (Hover)لون
لون الخطوط الفاصلةلون

النشرة البريدية

الإعدادالنوعملاحظة
إظهار النشرة البريديةمربع تفعيلالنموذج للعرض فقط ولا يرسل بيانات.
نص صغيرنص
العنواننص
الوصفنص طويل
صورة الخلفية (كمبيوتر)صورة
صورة الخلفية (جوال)صورةيستخدم صورة الكمبيوتر إذا لم تُرفع صورة للجوال.

4. بطاقات المنتجات: الألوان، المفضلة، النظرة السريعة

تظهر في المجموعة المميزة وكاروسيل المنتجات والتصنيف وكل المنتجات والمنتجات المقترحة.

بطاقات المنتجات (ديسكتوب)
ديسكتوب
بطاقات المنتجات (موبايل)
موبايل
  • دوائر الألوان: تظهر تلقائيًا إذا كان للمنتج خيار لون، وقد يجلب القالب الخيارات من زد عند ظهور البطاقة. يمكن تحديد أقصى عدد أو إخفاؤها.
  • المفضلة (قلب): تظهر عند تفعيل المفضلة في زد. الزائر غير المسجل يتحول لتسجيل الدخول.
  • النظرة السريعة (عين): تفتح نافذة بالمنتج وخياراته ويمكن الإضافة للسلة منها (على الجوال تظهر كشاشة سفلية).
  • الإضافة السريعة (موبايل): المنتج بدون خيارات يُضاف للسلة مباشرة، وإلا يظهر «اختر الخيارات».
  • من «الإعدادات العامة ← بطاقات المنتجات» تتحكم في نسبة الصورة وقصها وإخفاء كل عنصر.

5. صفحة التصنيف وصفحة كل المنتجات

البانر العلوي مركزي افتراضيًا ويمكن التحكم به بالكامل من «الإعدادات العامة ← صفحة التصنيف».

  • إخفاء البانر، أو بانر افتراضي واحد، أو بانر مختلف لكل تصنيف (اختر التصنيف ثم صورة الكمبيوتر وصورة الجوال وعنوانًا مختلفًا اختياريًا).
  • إخفاء العنوان أو الوصف، تغيير موضع النص أفقيًا ورأسيًا، ارتفاع منفصل للكمبيوتر والجوال، قوة التظليل، لون النص.
  • عدد الأعمدة: 3 أو 4 للكمبيوتر، و1 أو 2 للجوال. إخفاء شريط التصفية والترتيب.

6. صفحة المنتج ودليل المقاسات

صفحة المنتج (ديسكتوب)
ديسكتوب
صفحة المنتج (موبايل)
موبايل
  • الخيارات (لون/مقاس) من مكوّن زد الرسمي؛ تتحدّث الصورة والسعر والمخزون عند تغيير الخيار، ويظهر شريط خصم تلقائي.
  • شريط المميزات (3 عناصر) قابل للتعديل بالكامل (النص والأيقونة)، أو الإخفاء.
  • أقسام المعلومات (الشحن والعناية) قابلة للاستبدال بأقسامك (عنوان + نص).
  • طرق الدفع وApple Pay ومعلومات الخصم تظهر من زد تلقائيًا إذا كانت مفعّلة في المتجر.
  • المنتجات المقترحة كاروسيل (سحب على الجوال وأسهم على الكمبيوتر).
  • شريط ثابت أسفل الشاشة عند التمرير: «أضف للسلة» و«اشترِ الآن» جنبًا إلى جنب.
المنتجات المقترحة والشريط الثابت (ديسكتوب)
المقترحات
المنتجات المقترحة والشريط الثابت (موبايل)
الشريط الثابت (موبايل)

دليل المقاسات

دليل المقاسات (ديسكتوب)
ديسكتوب
دليل المقاسات (موبايل)
موبايل
  • تُخصَّص من «الإعدادات العامة ← دليل المقاسات»: العنوان، نص تمهيدي، صورة جدول جاهزة، عناوين الأعمدة (حتى 4)، صفوف الجدول، نصائح القياس، ملاحظة.
  • لو أضفتَ صفوفًا أو صورة يظهر تبويب «جدول المقاسات» أولًا.
  • يمكن إخفاؤه من إعدادات صفحة المنتج.

7. السلة وتأكيد الإضافة

صفحة السلة (ديسكتوب)
ديسكتوب
صفحة السلة (موبايل)
موبايل
  • بطاقة ملخص ثابتة، كوبون قابل للطي، زر دفع، أيقونات (دفع آمن / شحن / استبدال) وشريط شعارات الدفع.
  • على الجوال: شريط ثابت أسفل الشاشة يعرض الإجمالي وزر إتمام الطلب (يمكن إيقاف التثبيت).
  • أزرار الكمية بتصميم كبسولة بحجم مناسب للمس.
  • عرض عناصر السلة نفسه يأتي من مكوّن زد، والقالب يجمّله.

تأكيد الإضافة للسلة

نافذة تأكيد الإضافة للسلة (موبايل)
الإضافة من صفحة المنتج
  • نافذة منبثقة بصورة المنتج وأزرار «عرض السلة» و«إتمام الطلب»، يتحول الزر إلى «تمت الإضافة ✓»، ويتحرك عداد السلة.
  • يمكن إيقافها من «عام».

8. الإعدادات العامة (مرجع كامل)

تظهر في لوحة «إعدادات الصفحة». هذه كل المجموعات والإعدادات:

الألوان والشكل

الإعدادالنوعملاحظة
لون الأزرار الرئيسيةلونيطبق على أزرار إضافة للسلة وإتمام الطلب وتطبيق الخصم.
لون نص الأزرار الرئيسيةلون
خلفية الصفحات الداخليةلونالمنتج والتصنيف والسلة.
لون النص في الصفحات الداخليةلون
استدارة الأزرارالافتراضي · حادة · ناعمة · دائريةقائمة اختيار
استدارة الصور والبطاقاتالافتراضي · حادة · ناعمة · مستديرةقائمة اختيار

بطاقات المنتجات

الإعدادالنوعملاحظة
إخفاء دوائر الألوانمربع تفعيلتظهر دوائر الألوان تلقائيًا إذا كان للمنتج خيار لون.
أقصى عدد للألوان3 · 4 · 5 · 6 · 8قائمة اختيار
إخفاء اسم المتجر فوق اسم المنتجمربع تفعيل
إخفاء زر الإضافة السريعةمربع تفعيلزر يظهر على بطاقات صفحات التصنيف على الجوال.
نسبة صورة البطاقةالافتراضي · مربع 1:1 · طولي 4:5 · طولي 3:4 · طولي 5:6 · عرضي 4:3قائمة اختيار
قص صورة البطاقةالافتراضي · ملء الإطار (قص) · إظهار كاملةقائمة اختيار
إخفاء أيقونة المفضلةمربع تفعيلتظهر تلقائيًا إذا كانت المفضلة مفعّلة في إعدادات المتجر.
إخفاء أيقونة النظرة السريعةمربع تفعيل

صفحة التصنيف

الإعدادالنوعملاحظة
إخفاء البانرمربع تفعيل
صورة البانر الافتراضية (كمبيوتر)صورةتُستخدم لكل التصنيفات التي ليس لها بانر خاص أدناه.
صورة البانر الافتراضية (جوال)صورةتستخدم صورة الكمبيوتر إذا تُركت فارغة.
بانر مخصص لكل تصنيفداخل كل عنصر: التصنيف، صورة (كمبيوتر)، صورة (جوال)، عنوان مختلف (اختياري)، إخفاء النص لهذا التصنيفقائمة عناصرأضف تصنيفًا واختر له صورة (كمبيوتر وجوال) وعنوانًا مختلفًا اختياريًا.
إخفاء العنوان والوصفمربع تفعيل
إخفاء الوصف فقطمربع تفعيل
موضع النص أفقيًاالبداية · المنتصف · النهايةقائمة اختيار
موضع النص رأسيًاالأعلى · المنتصف · الأسفلقائمة اختيار
ارتفاع البانر (كمبيوتر)شريط قيمة0 = تلقائي.
ارتفاع البانر (جوال)شريط قيمة0 = تلقائي.
قوة التظليلبدون · خفيف · متوسط · قويقائمة اختيار
لون النصلون
عدد الأعمدة (كمبيوتر)3 · 4قائمة اختيار
عدد الأعمدة (جوال)1 · 2قائمة اختيار
إخفاء شريط التصفية والترتيبمربع تفعيل

صفحة المنتج

الإعدادالنوعملاحظة
إخفاء مسار التنقلمربع تفعيل
إخفاء التقييممربع تفعيل
إخفاء زر المفضلةمربع تفعيل
إخفاء شريط المميزاتمربع تفعيل
مميزات المنتجداخل كل عنصر: الأيقونة، النصقائمة عناصراتركها فارغة لعرض المميزات الافتراضية.
إخفاء دليل المقاساتمربع تفعيل
إخفاء زر اشترِ الآنمربع تفعيل
إخفاء شعارات الدفعمربع تفعيل
إخفاء قسم (الشحن / العناية)مربع تفعيل
أقسام المعلومات (الشحن، العناية…)داخل كل عنصر: العنوان، النصقائمة عناصراتركها فارغة لعرض قسمي الشحن والعناية الافتراضيين.
إخفاء المنتجات المقترحةمربع تفعيل
عنوان المنتجات المقترحةنص
إخفاء آراء العملاءمربع تفعيل
عنوان آراء العملاءنص
إخفاء شريط الإضافة للسلة المثبّتمربع تفعيل

صفحة السلة

الإعدادالنوعملاحظة
عنوان الصفحةنص
إخفاء عنوان الصفحةمربع تفعيل
نص زر إتمام الطلبنص
نص رابط متابعة التسوقنص
إخفاء رابط متابعة التسوقمربع تفعيل
إخفاء خانة الخصممربع تفعيل
ملاحظة تحت زر الدفعنصمثال: الدفع آمن ومشفّر.
عدم تثبيت زر الدفع أسفل الشاشة على الجوالمربع تفعيل
عنوان السلة الفارغةنص
نص زر السلة الفارغةنص
إخفاء أيقونات (دفع آمن / شحن / استبدال)مربع تفعيل
إخفاء شعارات طرق الدفعمربع تفعيل

عام

الإعدادالنوعملاحظة
رقم واتسابنصمع رمز الدولة، مثال: 966500000000. يظهر زر عائم.
إيقاف نافذة تأكيد الإضافة للسلةمربع تفعيل
رسالة واتساب الافتراضيةنص
موضع زر واتسابالنهاية · البدايةقائمة اختيار
إيقاف التمرير الناعممربع تفعيل
CSS مخصصنص طويللمطورين: يُضاف في كل الصفحات.
كود مخصص في <head>كود HTML

دليل المقاسات

الإعدادالنوعملاحظة
العنواننص
نص تمهيدينص
صورة جدول المقاساتصورةاختياري: ترفع صورة جاهزة للجدول.
عنوان عمود الأسماءنصافتراضي: المقاس
عنوان العمود 1نصمثال: العرض (سم)
عنوان العمود 2نص
عنوان العمود 3نص
عنوان العمود 4نص
صفوف الجدولداخل كل عنصر: الاسم / المقاس، العمود 1، العمود 2، العمود 3، العمود 4قائمة عناصر
نصائح القياسداخل كل عنصر: العنوان، النصقائمة عناصرتستبدل تبويب (طريقة القياس).
ملاحظةنص طويل

9. الصور والفيديو

مقاسات الصور المقترحة

الموضعالكمبيوترالجوال
واجهة الهيرو2400×1350 (16:9)900×1400 (رأسي)
بطاقات «مساحات المنزل»1200×1500 (4:5)900×1100
نص مع صورة / الأسئلة الشائعة1600×12001000×1000
بانر التصنيف2400×7001000×800
صور المنتجات (من زد)مربعة أو 4:5 بخلفية نظيفة

الفيديو في الأقسام

  • متاح في: الهيرو، مشهد الفيديو، نص مع صورة، الأسئلة الشائعة، الآراء المتحركة، بطاقات «مساحات المنزل»، «تسوق حسب المساحة»، الآراء، صور التواصل.
  • ثلاث طرق: رفع مباشر (mp4 / webm / ogg حتى 10MB حسب زد)، أو رابط ملف مباشر، أو رابط YouTube أو Vimeo.
  • الرابط يتغلب على الفيديو المرفوع.
  • الصورة تبقى كخلفية قبل التشغيل، وتُستخدم بدل الفيديو عند «توفير البيانات» أو «تقليل الحركة» أو إذا فعّلت «عرض الصورة بدل الفيديو على الجوال».
  • الفيديو صامت ومتكرر ولا يُحمَّل إلا عند اقتراب القسم من الشاشة.

استضافة الفيديو (للروابط المباشرة)

الخدمةلماذا
Bunny Stream / Bunny CDNسريع ورخيص ويعطي رابط mp4 مباشر
Cloudflare R2 (+CDN)بدون رسوم نقل بيانات تقريبًا
Backblaze B2 + Cloudflareأرخص تخزين
Amazon S3 + CloudFrontالأكثر استقرارًا للمشاريع الكبيرة

نصيحة: ملف mp4 مضغوط (H.264) من 3 إلى 8MB للخلفيات.

10. الربط مع زد وما يلزم تفعيله

الميزةما يلزم من زد
قائمة التنقل والمجموعاتإنشاء القائمة الرئيسية في زد
المفضلةتفعيلها في إعدادات المنتجات في زد
شعارات الدفعطرق الدفع المفعّلة في المتجر
Apple Pay / الدفع السريعتفعيله في إعدادات الدفع؛ يظهر من مكوّن زد تلقائيًا، وغيابه لا يسبب مشكلة
أيقونات التواصل والبريد والجوالإعدادات التواصل في المتجر
التقييماتتفعيل التقييمات في المتجر
الكوبوناتتفعيل خانة الكوبون في إعدادات الدفع
شعار المتجريُستخدم شعار الهيدر أو شعار المتجر

القالب يستخدم واجهات زد الرسمية: السلة (zid.cart)، المنتجات والبحث (zid.products)، والمفضلة (zid.account).

11. حل المشاكل الشائعة

المشكلةالحل
قسم يظهر في المحرر ولا يظهر في المتجرأضف محتوى حقيقيًا أو فعّل المحتوى التجريبي داخل القسم.
التعديلات لا تظهرحدّث الصفحة بالإجبار (Ctrl/Cmd+Shift+R) أو افتحها في نافذة خاصة.
لا تظهر دوائر الألوان على الكروتتأكد أن المنتج له خيار اسمه «اللون/Color». لو الخيارات لا تصل من زد قد تتأخر في الظهور لحظات. يمكن إخفاؤها من «بطاقات المنتجات».
عداد السلة لا يظهريظهر عند وجود منتجات في السلة بعد تحميل زد SDK (لحظات بعد فتح الصفحة).
أيقونة القلب لا تظهرفعّل المفضلة من إعدادات المنتجات في زد.
الفيديو لا يعملتأكد أن الرابط مباشر mp4/webm أو رابط YouTube/Vimeo عام. على الجوال فعّل تشغيل الفيديو (قد يكون مخفيًا لتوفير البيانات).
خطأ «No route exists for …name»ارفع النسخة الأحدث كاملة؛ الروابط الثابتة مثل /blogs لا تحتاج مسارًا.
شكل عناصر السلة غير مرتبالتصميم يطبق على مكوّن زد؛ أرسل لقطة شاشة لتعديل الـCSS.
الأقسام تتحرك كثيرًاالمستخدم لديه «تقليل الحركة»، أو يمكنك إيقاف التمرير الناعم من «عام».

12. قائمة مراجعة قبل الإطلاق

  • الشعار وقائمة التنقل.
  • نسخة الهيرو للجوال (صورة منفصلة).
  • كل الأقسام المعروضة لها محتوى حقيقي، وأُخفيت غير المستخدمة.
  • طرق الدفع والمفضلة وApple Pay مفعّلة حسب الرغبة.
  • جرّب: إضافة منتج بخيارات، السلة، الكوبون، البحث، النظرة السريعة على الجوال.
  • نسِّخ الإعدادات إلى النسخة الإنجليزية وراجعها.
  • دليل المقاسات وأقسام الشحن والعناية بنصوصك.
  • افحص الصفحة على 360 و390 و430 و768 وكمبيوتر.

الأسئلة الشائعة المعاينة الحية للقالب

Last updated October 19, 2026