يتيح لك Elementor تعيين خلفية متدرجة، ولكن ليس تدرجًا على النص نفسه. تأخذ أداة العنوان القياسية لونًا ثابتًا فقط، لذا فإن العنوان متعدد الألوان يعني عادةً كتابة CSS الخاص بك باستخدام background-clip: text. هذه هي الفجوة الحرة القطعة عنوان التدرج في الإضافات الرئيسية للعنصر يملأ.
باستخدام هذه الأداة، يمكنك اختيار لونين، واختيار تدرج خطي أو شعاعي، ويمتلئ النص بهذا التدرج، بدون رمز. تحصل أيضًا على ظل نص اختياري و13 وضع مزج تتحكم في كيفية مزج التدرج مع كل ما يوجد خلفه. يغطي هذا الدليل كل إعداد، باستخدام الأداة التي تأتي مجانًا مع الإضافات الرئيسية.
إليك نوع النص المتدرج الذي ستقوم بإنشائه، وهو عنوان يتلاشى من لون إلى آخر فوق صورة الخلفية
قبل أن تبدأ #
- العنصر مثبت ونشط
- الإضافات الرئيسية للعنصر مثبتة ونشطة (دليل التثبيت)
- صفحة أو قالب مفتوح في محرر Elementor
الخطوة 1: أضف عنصر واجهة المستخدم لعنوان التدرج #
في محرر Elementor، ابحث في لوحة عناصر واجهة المستخدم عن عنوان التدرج واسحبه إلى صفحتك. تحمل عناصر واجهة المستخدم Master Addons شارة “MA”، لذلك من السهل اكتشافها. يفتح المحرر تحرير عنوان التدرج لوحة تحتوي على ثلاث علامات تبويب: المحتوى والأسلوب والمتقدم.
الخطوة 2: قم بتعيين محتوى العنوان #
على ال محتوى علامة التبويب، اكتب عنوانك في عنوان مجال. أما باقي الحقول هنا فهي الأساسيات:
- عنوان URL يحول العنوان بأكمله إلى رابط.
- محاذاة يضبطه على اليسار أو الوسط أو اليمين.
- عنوان علامة HTML يختار العلامة: من H1 إلى H6، أو div، أو span، أو p. استخدم H1 للعنوان الرئيسي للصفحة وH2 لعناوين الأقسام حتى تحافظ الصفحة على بنية نظيفة.
الخطوة 3: اختر ألوان التدرج #
التبديل إلى أسلوب علامة التبويب وفتح نمط التدرج. يحافظ لون النص اضبط على التدرج (يعطي الكلاسيكي لونًا واحدًا عاديًا). يمتد التدرج بين لونين:
- لون هو اللون الأول، مع أ موقع شريط التمرير (نسبة مئوية) الذي يحدد مكان وجوده على طول النص.
- اللون الثاني هو اللون النهائي، مع الخاص به موقع المنزلق.
اضبط اللونين على لوحة علامتك التجارية، ثم ادفع أشرطة تمرير الموقع لتحديد مقدار النص الذي يغطيه كل لون. يتم تحديث المعاينة أثناء السحب. هناك منفصل عادي و تحوم علامة التبويب أيضًا، بحيث يمكن أن يتغير التدرج عندما يقوم شخص ما بتمرير العنوان.
الخطوة 4: اختر نوع التدرج، الخطي أو الشعاعي #
ال يكتب يقوم Dropdown بتعيين شكل التدرج. يقوم كل خيار بتبديل عنصر التحكم الإضافي الذي يظهر أسفله
- شعاعي ينشر الألوان من نقطة مركزية. اختر أ موضع (مثل مركز المركز) لتعيين مكان تلك النقطة.
- خطي يدير الألوان في خط مستقيم. ضبط زاوية للتحكم في الاتجاه: 180 نقطة التدرج مباشرة للأسفل، 90 نقطة ترسله عبره.
شعاعي جيد للتوهج من منتصف النص. الخطي هو الصورة الوحيدة التي يصورها معظم الناس عندما يفكرون في نص متدرج، أو يتلاشى بشكل نظيف من اليسار إلى اليمين أو من الأعلى إلى الأسفل.
الخطوة 5: إضافة ظل نصي (اختياري) #
ال ظل النص يضيف التحكم عمقًا خلف الحروف. انقر فوق قلم الرصاص لضبط لون الظل، والضبابية، والإزاحة الأفقية والرأسية. يساعد الظل الناعم النص المتدرج على البقاء قابلاً للقراءة عندما يكون موجودًا فوق صورة خلفية مزدحمة.
الخطوة 6: جرب أوضاع المزج الثلاثة عشر #
ال وضع المزج يقرر Dropdown كيفية مزج النص المتدرج مع كل ما يوجد خلفه، مثل صورة الخلفية أو اللون. هناك 13 وضعا:
- عادي، ضرب، شاشة، تراكب
- أغمق، أفتح، لون دودج، التشبع
- اللون، الفرق، الاستبعاد، اللون، اللمعان
عادي يحافظ على التدرج كما هو. يتفاعل الباقي مع الخلفية: يظلم المضاعفة، وتضيء الشاشة، ويمكن للاختلاف عكس الألوان للحصول على مظهر ملفت للنظر. أسرع طريقة للاختيار هي التنقل بينها ومشاهدة المعاينة، لأن النتيجة تعتمد على الألوان الموجودة خلف النص.
لحن الطباعة لمعرفة الخط والحجم أثناء وجودك هنا، انقر فوق ينشر (أو تحديث) لحفظ الصفحة.
حيث يعمل نص التدرج بشكل جيد #
- عناوين الأبطال، حيث يبرز عنوان متدرج مقابل صورة أو قسم مظلم.
- عناوين الأقسام وهذا يحتاج إلى شخصية أكثر قليلاً من النص المسطح.
- الصفحات المقصودة مطابقة التدرج لنظام ألوان العلامة التجارية.
- على صور الخلفية، حيث يقوم وضع المزج بربط النص بالمشهد.
الأسئلة المتداولة #
هل يمكنك إضافة لون متدرج إلى النص في Elementor؟
ليس مع عنصر واجهة المستخدم الافتراضي للعنوان، والذي يأخذ لونًا ثابتًا فقط. تضيفها أداة عنوان التدرج الرئيسية: اختر لونين، واختر خطيًا أو شعاعيًا، ويمتلئ النص بالتدرج، ولا حاجة إلى CSS مخصص.
كيف أقوم بإنشاء نص متدرج في Elementor بدون CSS؟
أضف عنصر واجهة مستخدم التدرج الرئيسي للإضافات، واكتب عنوانك، ثم افتح علامة التبويب "النمط" وقم بتعيين اللون الأول واللون الثاني. اختر خطيًا أو شعاعيًا ضمن النوع، وينطبق التدرج على النص تلقائيًا.
ما الفرق بين نص التدرج الخطي والشعاعي؟
يقوم التدرج الخطي بتشغيل الألوان في خط مستقيم، يتم ضبطه بزاوية. يقوم التدرج الشعاعي بتوزيعها من نقطة مركزية تختارها باستخدام عنصر التحكم في الموضع. البدلات الخطية تتلاشى من اليسار إلى اليمين؛ شعاعي يناسب التوهج من المنتصف.
ماذا تفعل أوضاع المزج؟
تتحكم أوضاع المزج في كيفية مزج النص المتدرج مع الخلفية الموجودة خلفه. تتراوح الخيارات الثلاثة عشر من عادي (بدون مزج) إلى الضرب والشاشة والتراكب والفرق والمزيد. يعتمد التأثير على الألوان الموجودة خلف النص، لذا قم بمعاينة كل منها.
هل أحتاج إلى Elementor Pro للنص المتدرج؟
رقم تعمل أداة عنوان التدرج مع الإصدار المجاني من Elementor، لذا فإن الألوان المتدرجة والأنواع وظل النص وأوضاع المزج تعمل جميعها بدون Elementor Pro.
