استكشاف أخطاء قالب متجرك الإلكتروني وإصلاحها

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

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

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

• إذا كانت صورة GIF لا تُعرض بشكل صحيح وتمت إضافتها إلى واجهة متجرك باستخدام محرر النص المنسق، كما هو الحال في وصف المنتج أو في منشور مدونة، فقد يرجع ذلك إلى حجم الصورة. يمكنك تصحيح ذلك من خلال النقر على صورة GIF في محرر النص المنسق، ثم النقر على تعديل الصورة. من القائمة المنسدلة حجم الصورة، حدد الأصلي. يمكنك بعد ذلك تغيير حجم صورة GIF بالنقر على زوايا الصورة وسحبها للداخل لجعلها أصغر أو للخارج لجعلها أكبر.
• إذا حدث تغيير كبير في ألوان صورك على واجهة متجرك مقارنةً بالصورة الأصلية، فقد لا تكون صورك بتنسيق الألوان القياسي أحمر أخضر أزرق (sRGB). لإصلاح تغيير الألوان هذا، احفظ ملفك في تطبيق تعديل الصور بتنسيق sRGB. تتضمن المصطلحات الشائعة لهذا الإجراء "تحسين للويب (Web optimize)" أو "ضبط الصورة للويب (Adjust image for Web)" أو "حفظ للويب (Save for Web)". تعرف على المزيد حول ملفات تعريف الألوان.
• إذا كانت صور منتجاتك على صفحات مجموعاتك غير محاذاة، فقد تحتاج إلى ضبط نسبة العرض إلى الارتفاع في ملفات صور المنتجات بحيث تكون بنفس نسبة الارتفاع إلى العرض، ثم رفع صورة المنتج مرة أخرى. يمكنك أيضًا استخدام تطبيق لتعديل الصور من Shopify App Store.

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

• المنتجات المفقودة: إذا كانت منتجاتك مفقودة من واجهة متجرك، فقد تحتاج إلى مراجعة الحالة وقنوات المبيعات في قسم النشر بمنتجك في مسؤول Shopify. تأكد من أن حالة المنتج هي نشط وأن المنتج متاح لـ المتجر الإلكتروني.
• المجموعات المفقودة: إذا كانت مجموعاتك مفقودة من واجهة متجرك، فقد تحتاج إلى مراجعة قنوات المبيعات في قسم النشر بالمجموعة في مسؤول Shopify. تأكد من أن المجموعة متاحة لـ المتجر الإلكتروني، وأن مجموعتك مضافة إلى قوائمك.
• المجموعات معروضة ولكن المنتجات مفقودة: إذا كانت مجموعاتك تُعرض ولكن هناك منتجات مفقودة، فقد تحتاج إلى مراجعة أي فلاتر إشارات للمجموعة في إعدادات القوائم. تأكد من عدم وجود إشارات في حقل فلترة المجموعة باستخدام الإشارات قد تتسبب في عدم عرض المنتجات.
• العملة غير صحيحة: إذا كانت عملتك لا تُعرض بشكل صحيح للمنتجات أو في مجموعاتك، فقد ترغب في مراجعة عرض العملة في قسم الإعدادات الافتراضية للمتجر من خلال الإعدادات > عام للتأكد من عدم وجود أي كود إضافي. تعرف على المزيد حول تنسيق كيفية عرض العملة لعملائك.
• بعض المنتجات تُعرض بشكل مختلف: إذا كانت بعض المنتجات أو المجموعات تُعرض بشكل مختلف عن غيرها، فراجع نموذج القالب المعيَّن للمنتجات أو المجموعات في مسؤول Shopify.
• لا يمكن تعديل قوالب المنتجات أو المجموعات: إذا كانت قوالب المنتجات أو المجموعات الافتراضية باهتة وغير قابلة للتحديد في محرر القوالب، فستحتاج إلى إتاحة منتج واحد أو مجموعة واحدة على الأقل لقناة مبيعات المتجر الإلكتروني. لا يمكنك تعديل هذه القوالب الافتراضية دون توفر منتجات أو مجموعات لمعاينة التغييرات. تعرف على المزيد حول تغيير توفر مجموعة وتعيين توفر المنتجات في قنوات المبيعات.

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

يمكن أن تنطبق الحالات التالية على المحتوى المترجم:

• مترجم: المحتوى له ترجمات متاحة.
• قديم: تم تحديث المحتوى باللغة الافتراضية، لكن الترجمات لا تعكس أي تحديثات.
• غير مترجم: لا توجد ترجمات لنوع المحتوى هذا.

عند مراجعة المحتوى المترجم، حدِّث أي محتوى غير مترجم أو قديم، ومن المفترض أن يُعرض المحتوى المترجم بشكل صحيح بعد ذلك.

تعرّف على المزيد حول ترجمة متجرك وتوطينه.

إذا كانت واجهة متجرك ومحرر القوالب لا يعرضان المعلومات نفسها، فراجع نموذج القالب الذي تقوم بتعديله. قد تحتاج إلى إجراء تعديلات لتحديث نماذج القوالب لديك لعرض المعلومات الصحيحة.

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

تعرّف على المزيد حول تجاوزات السوق.

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

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

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

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

أحيانًا يتعارض كود HTML الذي تتم إضافته في محرر النصوص المنسقة الخاص بك مع كود القالب. إذا كانت المشكلة موجودة في صفحة واحدة، مثل صفحة منتج أو صفحة عادية أو منشور مدونة، فقد يرجع ذلك إلى كود HTML إضافي. يمكن إضافة هذا أحيانًا من خلال نسخ ولصق نص من موقع آخر.

مراجعة كود HTML

يمكنك مراجعة كود HTML في محرر النصوص المنسقة.

الخطوات:

1. انتقل إلى الصفحة في لوحة تحكم المسؤول.
2. انقر على زر عرض HTML لمراجعة كود HTML.
3. حدد موقع أي كود HTML قد يسبب مشكلات في العرض وأزله.
4. انقر على حفظ.

مسح التنسيق

يمكنك تمييز جزء من النص ومسح تنسيق HTML.

الخطوات:

1. انتقل إلى الصفحة في لوحة تحكم المسؤول.
2. ميّز النص الذي به مشكلات التنسيق.
3. انقر على زر 🚫.
4. انقر على حفظ.

تعرّف على المزيد حول محرر النصوص المنسقة.

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

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

للتحقق من أن إعادة التوجيه الخاصة بك لا تتداخل مع تجربة المحرر، استخدم إشارة إلى متغير window.Shopify.designMode في JavaScript لإلغاء تنشيط إعادة التوجيه عند زيارتك لمحرر القوالب. يتم تعيين هذا المتغير إلى true عند تحميل واجهة المتجر في المحرر، وإلى false عندما لا يتم تحميلها.

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

الكتل القابلة للطي تعرض نفس النص على جميع المنتجات

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

1. في لوحة تحكم مسؤول Shopify، انتقل إلى الإعدادات > الحقول الوصفية > المنتجات.
2. انقر على إضافة تعريف.
3. أدخل اسمًا لحقلك الوصفي، ثم انقر على تحديد نوع المحتوى.
4. حدد نص ونص متعدد الأسطر.
5. انقر على حفظ.
6. انتقل إلى صفحة منتج في لوحة تحكم المسؤول وقم بالتمرير إلى قسم الحقول الوصفية في أسفل الصفحة.
7. أضف المحتوى الخاص بمنتجك إلى الحقل الوصفي الذي أنشأته.
8. في محرر القوالب، انتقل إلى نموذج المنتج وابحث عن قسم الصف القابل للطي الخاص بك.
9. في إعداد محتوى الصف، انقر على زر .
10. حدد حقلك الوصفي من الخيارات المتاحة.
11. احفظ تغييراتك.

الآن سيعرض كل منتج محتواه الخاص عندما يتم ملء الحقل الوصفي، ولن يُعرض أي محتوى إذا كان الحقل الوصفي فارغًا لهذا المنتج.

تعرّف على المزيد حول عرض الحقول الوصفية في متجرك الإلكتروني واستخدام الحقول الوصفية والكائنات الوصفية مع المصادر الديناميكية.

إذا كان هناك خطأ في صياغة كود القالب، فستظهر رسالة تحذير HTML error found أو Theme error في محرر القوالب. تعرض رسالة الخطأ ملف Liquid الذي يحتوي على الخطأ.

قد تظهر رسالة تحذير The theme you're looking for couldn't be found عند وجود أي تلف في كود HTML. يمكن أن يفشل تحميل الصفحة في محرر القوالب لعدة أسباب، مثل الأسباب التالية:

• مشكلات في الاتصال بالشبكة
• كود Liquid غير صالح في قالبك

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

الخطوات:

1. انقر على ملف قسم .liquid المرتبط في رسالة الخطأ أو راجع الملفات للبحث عن التغييرات الأخيرة. ينقلك هذا إلى صفحة تعديل HTML/Cascading Style Sheets (CSS)، ويُفتح الملف في محرر الأكواد.
2. تصفح الكود في الملف وحاول العثور على أي كود HTML أو Liquid غير صالح. يعرض محرر الأكواد أخطاء الصياغة المحتملة باللون الأحمر. تشمل المشكلات الشائعة ما يلي:
   • وسوم إغلاق HTML زائدة، على سبيل المثال، وسم إغلاق </div> بدون وسم فتح <div>
   • وسوم فتح HTML زائدة غير مغلقة، على سبيل المثال، وسم فتح <div> بدون وسم إغلاق </div>
   • وسوم HTML مكتوبة بصيغة غير صحيحة، على سبيل المثال، <div class="my-class" بدون >
   • كود Liquid مكتوب بصيغة غير صحيحة
   • كود HTML تالف في ملف قصاصة مضمن بالقالب
3. بعد العثور على المشكلة، صحّح الكود في ملف قالبك. إذا كنت تستخدم عرض المخطط الزمني لمحرر الأكواد لتحديد إصدار سابق واستعادة المحتويات، فسيتم استبدال محتويات الملف بالكامل. انسخ محتويات الملف الحالي في مكان آمن أولاً إذا كنت ترغب في الاحتفاظ بأي تغييرات.
4. انقر على حفظ.
5. انقر على تعديل القالب للعودة إلى محرر القوالب، وتأكد من اختفاء رسالة الخطأ.
6. انتقل إلى واجهة متجرك للتحقق من عرضها كما هو متوقع.

خطأ "Exceeded maximum number of unique handles"

إذا ظهرت رسالة خطأ Liquid مثل "Exceeded maximum number of unique handles for all_products" في صفحتك الرئيسية، فهذا يعني عادةً أنك أضفت عددًا كبيرًا جدًا من أقسام المنتجات المميزة إلى صفحتك الرئيسية (عادةً أكثر من 20 قسمًا في معظم القوالب).

لحل هذه المشكلة:

1. في مسؤول Shopify، انتقل إلى المتجر الإلكتروني > القوالب.
2. ابحث عن قالبك الحالي وانقر على تعديل القالب.
3. انتقل إلى صفحتك الرئيسية.
4. أزل بعض أقسام المنتجات المميزة للبقاء ضمن حدود القالب.
5. فكّر في استخدام أقسام المجموعات المميزة بدلاً من ذلك، حيث يمكنها عرض منتجات متعددة بكفاءة أكبر وتحسين أداء متجرك.

تُضمَّن أيقونات الدفع عادةً بشكل افتراضي في تذييلات معظم القوالب لتوضيح طرق الدفع التي تقبلها للعملاء. إذا لم تظهر أيقونات الدفع في تذييل قالبك، فيمكنك التحقق مما يلي:

1. في محرر قوالبك، انتقل إلى قسم التذييل وتأكد من تفعيل إعداد إظهار أيقونات الدفع.
2. في مسؤول Shopify، انتقل إلى الإعدادات > المدفوعات وتأكد من وجود طريقة دفع واحدة نشطة على الأقل. قد تتطلب بعض طرق الدفع إكمال إعداد الحساب قبل ظهور أيقوناتها.
3. إذا كنت تستخدم بوابة دفع تابعة لجهة خارجية، فقد لا تُعرض أيقونات الدفع بسبب قيود في المنصة.

إذا تحققت من هذه الإعدادات ولا تزال أيقونات الدفع لا تظهر، فقد تحتاج إلى الحصول على دعم لقالبك.