اللون والشعار والخط

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

1. بطاقة الهوية البصرية

   هي البطاقة الثانية في شاشة المظهر، تحت بطاقة الثيم مباشرة. كل ما في هذا الشرح موجود فيها.

   

   1. 1 الشعار — ارفع ملفاً من جهازك، أو الصق رابط صورة في الخانة تحته.
   2. 2 أيقونة الموقع — الصورة الصغيرة جداً التي تظهر في لسان المتصفح.
   3. 3 اللون الأساسي — مربع اللون، وبجانبه رمز اللون مكتوباً.
   4. 4 نوع الخط — قائمة فيها ستة خطوط عربية.
   5. 5 متجرك الحقيقي — يظهر بجانب النموذج على شاشة الكمبيوتر. اقرأ شاهد متجرك وأنت تعدّل.

2. اختر لوناً يُقرأ جيداً

   اللون الأساسي ليس لون الصفحة. هو لون الأشياء التي تريد أن يضغطها المشتري: زر أضف للسلة، وزر إتمام الطلب، والروابط، وعلامات التخفيض.

   له طريقتان للاختيار في نفس السطر:

   • ✓ اضغط المربع الملوّن. تفتح لوحة ألوان الجهاز، وتختار منها بإصبعك أو بالفأرة.
   • ✓ أو اكتب رمز اللون في الخانة. الرمز يبدأ بعلامة # ثم ستة أحرف أو أرقام، مثل #FD3F0F. هذه هي الطريقة القياسية لكتابة لون على الإنترنت، ومصمّمك يعطيك رمز علامتك بهذا الشكل.

   ثلاث قواعد تكفي لاختيار لون لا يُتعب العين:

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

   يعمل أيضاً: متجرك الحقيقي بجانب هذه البطاقة يريك اللون قبل الحفظ. غيّر اللون، وانظر إلى الأزرار في متجرك، ثم احفظ إذا أعجبك. إن كانت الكلمة على الزر صعبة القراءة، اللون فاتح جداً.

3. اللون له خانة ثانية في شاشة عام

   نفس اللون الأساسي موجود أيضاً في شاشة عام، تحت أساسيات المتجر. الخانتان تكتبان في نفس المكان، فأيّهما استخدمت وصلت لنفس النتيجة.

   

   1. 1 عام في قائمة الإعدادات. شاشة أخرى غير المظهر.
   2. 2 نفس اللون الأساسي. هنا اسم الزر الذي يحفظ هو حفظ الإعدادات، لا حفظ المظهر.
   تنبيه: لكل شاشة زر حفظ خاص بها. غيّرت اللون في عام؟ احفظ من عام. غيّرته في المظهر؟ احفظ من المظهر.

4. الشعار: المقاس والخلفية

   الشعار يظهر في أعلى كل صفحة من صفحات متجرك، وفي رسائل البريد للمشتري. الشاشة تكتب لك المقاس تحت الخانة: «الحجم الموصى: 200x50 بكسل. الرفع له أولوية على الرابط.»

   «بكسل» هي وحدة قياس الصور على الشاشة. و200x50 تعني صورة عرضها أربعة أضعاف ارتفاعها، أي مستطيل عريض ومنخفض، وليس مربعاً.

   • ✓ ارفع صورة أكبر من المقاس، لا أصغر. مثلاً 400x100. الصورة الصغيرة تبدو ضبابية على شاشات الجوال الحديثة.
   • ✓ اجعل الخلفية شفافة. الخلفية الشفافة تعني صورة بلا لون خلف الشعار، فيظهر على أي خلفية. صيغة PNG تدعم هذا. الشعار بخلفية بيضاء يصير مربعاً أبيض واضحاً فوق الثيم الفاخر الداكن.
   • ✓ حدّ الحجم 2 ميجابايت. ملف أكبر من ذلك تردّه الشاشة برسالة خطأ. وقد يكون الحد الأقصى الحقيقي أصغر، لأن للسيرفر حدّاً خاصاً به. الرسالة تكتب الرقم المسموح فعلاً، فاعمل به.
   • ✓ الرفع يغلب الرابط. إذا اخترت ملفاً ووضعت رابطاً في نفس الوقت، يُستخدم الملف المرفوع.
   تنبيه: ليس عندك شعار بعد؟ اترك الخانة فارغة. المتجر يكتب اسم المتجر مكانه، وهذا أفضل من شعار رديء. لإزالة شعار موجود، علّم إزالة الشعار الحالي ثم احفظ.
   متجر جاهز؟ الشعار موجود من قبلك. المتجر الذي أنشأته من باب متجر جاهز يصلك بشعار كتبناه لك: اسم متجرك بخط عربي بلون متجرك، وأيقونة موقع فيها أول حرف من الاسم. ارفع صورتك في الخانة أعلاه متى شئت وتحل محله.
   وهذا الشعار ملف SVG رغم أن الرفع لا يقبل SVG، ولا تناقض في ذلك: المنع على الملفات المرفوعة من الخارج، وهذا الملف كتبناه نحن حرفاً حرفاً.
   وملفات SVG لا تظهر في رسائل البريد. برامج البريد مثل Gmail وOutlook لا ترسم SVG، فرسائل المشتري تحمل اسم متجرك بلون متجرك مكان الشعار، لا مربعاً فارغاً. ارفع PNG في الخانة أعلاه وسيظهر شعارك في الرسائل أيضاً.

5. أيقونة الموقع وأين تظهر

   أيقونة الموقع هي الصورة الصغيرة جداً التي تراها:

   • ✓ في لسان المتصفح، بجانب اسم الصفحة.
   • ✓ في قائمة المفضلة، إذا حفظ المشتري متجرك.
   • ✓ على شاشة الجوال، إذا أضاف المشتري متجرك كأيقونة.

   المقاس الموصى به مكتوب تحت الخانة: «الحجم الموصى: 32x32 بكسل PNG»، وحدّها 1 ميجابايت. وهي مربعة، لا عريضة مثل الشعار.

   تنبيه: لا ترفع الشعار كاملاً هنا. في مربع 32x32 لن يُقرأ أي كلام. استخدم الحرف الأول من اسم متجرك، أو الرمز فقط بدون الكلمات.

6. اختر الخط

   قائمة نوع الخط فيها ستة خطوط، كلها تدعم العربية وتُقرأ من اليمين إلى اليسار:

   الخط	شكله	يناسب
   IBM Plex Sans Arabic	حديث وواضح جداً	الخيار الافتراضي. يصلح لكل متجر.
   Cairo	عصري وعريض قليلاً	العناوين القوية والعروض.
   Tajawal	هادئ ومتوازن	المتاجر العامة.
   Noto Sans Arabic	محايد وواسع الانتشار	النصوص الطويلة.
   Almarai	بسيط ومضغوط	الصفحات المزدحمة بالمنتجات.
   Amiri	كلاسيكي بأطراف مزخرفة	العطور والهدايا والمنتجات التراثية.

   قاعدة واحدة تكفي: اختر الخط الأسهل قراءة على الجوال. أكثر من ثلاثة أرباع المشترين في السعودية يفتحون المتجر من جوالهم، والخط المزخرف يتعب العين على شاشة صغيرة.

   يعمل أيضاً: بعض الثيمات لها خط خاص بها — الفاخر بخط ريم كوفي، والدافئ بخط أميري. اختيارك من هذه القائمة هو ما يظهر في النهاية.

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

   على الجوال لا توجد معاينة بجانب النموذج. اضغط جرّب في المتجر تحت الخط، ويفتح متجرك في نافذة جديدة باللون والخط اللذين اخترتهما، قبل الحفظ.

شاهد متجرك وأنت تعدّل

على شاشة الكمبيوتر يظهر متجرك الحقيقي بجانب النموذج، كما يراه المتسوق. تجده في شاشات المظهر، والأدوات، والمجموعات، والصفحات، والسياسات. غيّر اللون أو الخط، وتراهما على متجرك الحقيقي قبل الحفظ. الشعار يظهر بعد الحفظ.

1. 1 جوال وكمبيوتر — ترى متجرك بحجم شاشة الجوال، أو بحجم شاشة الكمبيوتر مصغَّراً. الشاشة تتذكر اختيارك.
2. 2 زر التحديث — يحمّل متجرك من جديد.
3. 3 افتح في نافذة — يفتح متجرك كاملاً في نافذة جديدة. في الشاشة الضيقة لا يظهر منه إلا الأيقونة.
4. 4 متجرك — في وضع المالك، فتراه حتى لو كان متجرك موقوفاً. تقدر أن تتنقل فيه وتضغط أزرار القلم.
5. 5 أين يظهر؟ — ينزل متجرك في المعاينة إلى هذا الجزء ويضيئه لحظة.

اضغط أين يظهر؟ تحت أي بطاقة، وينزل متجرك في المعاينة إلى هذا الجزء ويضيئه لحظة. على الجوال يفتح نفس الزر متجرك في نافذة جديدة، عند هذا الجزء.

على الجوال اضغط زر معاينة المتجر في أسفل الشاشة، ويفتح متجرك في نافذة جديدة. الجوال ليس فيه مكان لعمود بجانب النموذج.

1. 1 لديك تغييرات غير محفوظة — يظهر بعد أي تغيير، وفيه زر الحفظ نفسه.
2. 2 معاينة المتجر — يفتح متجرك في نافذة جديدة.
3. 3 أين يظهر؟ — يفتح متجرك في نافذة جديدة عند هذا الجزء.

عندما تغيّر أي خانة يظهر شريط في أسفل الشاشة: لديك تغييرات غير محفوظة، وبجانبه زر الحفظ. الثيم واللون والخط تظهر في المعاينة قبل الحفظ، وفوقها سطر معاينة قبل الحفظ — لم يُحفظ شيء بعد. أي خانة أخرى تظهر في المعاينة بعد الحفظ. بعد الحفظ تظهر رسالة تم الحفظ · شاهد في المتجر. اضغط الرابط فيها لترى التغيير.

تنبيه: إذا خرجت من الشاشة وفيها تغيير لم تحفظه، يسألك المتصفح قبل أن تخرج. اختر البقاء، ثم احفظ.

← كل الشروحات