> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# وحدة الرأس

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

<div id="overview">
  # نظرة عامة
</div>

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

<div id="header-module-settings">
  # **إعدادات وحدة الرأس**
</div>

<div id="general">
  ## **عام**
</div>

يبدّل **Height** بين **Slim** و**Tall** للتحكم في المساحة الرأسية. **Bottom border** إما **None** أو **Thin**. يقبل **Background color** كودًا سداسيًا عشريًا أو منتقي الألوان المدمج، ويدعم الشفافية.

<img src="https://mintcdn.com/aftersell/uxKAdY-e0h16xa48/images/upcart/header-module-height-and-background.gif?s=982cf4fec081aa2c1b62901e53602b80" alt="إعدادات General لوحدة الرأس في Upcart مع عناصر تحكم الارتفاع ولون الخلفية بجانب معاينة السلة" width="2172" height="1080" data-path="images/upcart/header-module-height-and-background.gif" />

<div id="title">
  # **العنوان**
</div>

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

<img src="https://mintcdn.com/aftersell/uxKAdY-e0h16xa48/images/upcart/header-module-title-options.gif?s=18bfdb000570d453195ba19bd5f0288b" alt="خيارات عنوان وحدة الرأس في Upcart: وراثة عناوين القالب، أو شعار العلامة التجارية، أو أنماط نصية مخصصة" width="1960" height="1080" data-path="images/upcart/header-module-title-options.gif" />

<div id="inherit-from-theme-titles">
  ## الوراثة من عناوين القالب
</div>

يستخدم هذا الخيار أنماط العناوين الافتراضية لقالبك، ما يساعدك في الحفاظ على اتساق التصميم بصريًا مع بقية موقعك. يمكنك إضافة عنوانك الخاص باستخدام حقل Text وتضمين عدد عناصر السلة ديناميكيًا باستخدام `{{cart_quantity}}`. يمكن ضبط محاذاة النص على Side أو Center، ويمكنك اختيار مستوى العنوان المناسب H2 أو H3 أو H4، بناءً على هيكل محتوى متجرك.

<div id="brand-logo">
  ## شعار العلامة التجارية
</div>

إذا كنت تفضل استخدام شعار العلامة التجارية بدلًا من النص، يمكنك رفع شعار متجرك مباشرةً في هذا القسم. اختر محاذاة الشعار إلى Side أو Center، وغيّر حجمه باستخدام شريط تمرير **Logo size** الذي يمتد من 14 بكسل إلى 48 بكسل. لا يوجد حد مفروض على الملف الذي ترفعه، ولكن يُنصح باستخدام ملف PNG للحصول على شفافية نظيفة وحواف حادة. ملفات JPEG مدعومة أيضًا ولكنها قد تتضمن ضوضاء في الخلفية أو تقلل من تفاصيل الشعار. من أجل الأداء، احرص على إبقاء أحجام الملفات محسّنة.

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

<div id="define-text-styles">
  ## تحديد أنماط النص
</div>

يمنحك اختيار خيار Text تحكمًا كاملًا في تنسيق العنوان بشكل مستقل عن قالب متجرك. يمكنك إدخال أي عنوان مخصص وتضمين `{{cart_quantity}}` للتحديثات الديناميكية. يمكن ضبط محاذاة النص على Side أو Center، مع خيارات لتغيير وزن الخط إلى Normal أو Semibold أو Bold. حجم الخط قابل للتعديل من 14 بكسل إلى 48 بكسل باستخدام شريط تمرير مرئي، ويمكنك اختياريًا تطبيق تجاوز للون النص.

<div id="close-button">
  # زر الإغلاق
</div>

زر الإغلاق قابل للتخصيص ليتوافق مع تصميم متجرك. يضعه **Location** على الجانب الأيسر أو الأيمن من الدرج. يقبل كل من **Background** و**Icon** و**Border** لونًا بالإضافة إلى لون منفصل عند التمرير. **Icon size** هو Small أو Medium أو Large، و**Icon thickness** هو Normal أو Thick. **Border** هو None أو Thin أو Normal أو Thick.

<Note>
  يكون حقلا لون الحد ولون الحد عند التمرير معطّلين عندما يكون **Border** مضبوطًا على **None**. اختر عرض حد أولًا، ثم اضبط ألوانه.
</Note>

<img src="https://mintcdn.com/aftersell/uxKAdY-e0h16xa48/images/upcart/header-module-close-button-settings.png?fit=max&auto=format&n=uxKAdY-e0h16xa48&q=85&s=c8f941c774ff6f7029b0833c09ca000d" alt="إعدادات زر الإغلاق في وحدة الرأس بـ Upcart للموقع والألوان وحجم الأيقونة والحد" width="1170" height="1166" data-path="images/upcart/header-module-close-button-settings.png" />

<div id="custom-template">
  # قالب مخصص
</div>

في الإصدار 2.0 من وحدة الرأس، يظهر محرر كود **Custom template** أسفل الإعدادات، مع قالب **Full** واحد يغطي الوحدة بأكملها. يستخدم JSX قائمًا على React، ويجب عليك أولًا تحديد **Access custom templates** ضمن **Settings > Cart settings > Advanced Settings** في Cart Editor. راجع [إعداد قالب مخصص](/ar/upcart/setting_up_a_custom_template_in_upcart).

<div id="tips">
  # نصائح
</div>

* **هل تريد مسافات أو أحجامًا دقيقة؟** استخدم [CSS المخصص](/ar/upcart/custom_css) للتحكم الكامل بما يتجاوز أشرطة التمرير، وهو رائع للهوامش الدقيقة أو الحشو أو تغيير حجم الشعار.
* **اختبر على سطح المكتب والجوال.** يمكن أن تُعرض عناصر الرأس مثل النص والشعار والأزرار بشكل مختلف على أحجام الشاشات المختلفة
* **استخدم مستويات العناوين المناسبة.** يساعد اختيار العنوان الصحيح (H2 أو H3 أو H4) في إمكانية الوصول وتحسين محركات البحث. طابق هيكل محتوى متجرك.

لمزيد من طرق تخصيص سلتك، استكشف [وثائق مساعدة Upcart](/ar). إذا كنت بحاجة إلى تغييرات مخصصة، نوصي بالتواصل مع [خبير Shopify](https://www.shopify.com/ca/partners/directory).