عنصر مجاني مخصص CSS: قم بتصميم أي عنصر واجهة مستخدم بدون عنصر Pro
هل سبق لك أن اصطدمت بجدار تصميم حيث عناصر التحكم المرئية في Elementor ليست كافية؟ يمنحك ملحق CSS المخصص القدرة على الاختراق. أضف أنماطك الدقيقة مباشرةً في إعدادات الصفحة أو على أي عنصر واجهة مستخدم واحد دون الحاجة إلى البحث في ملفات السمات أو استخدام مكون إضافي منفصل. سواء كان تأثير التمرير فريدًا، أو إصلاح مشكلة محاذاة صغيرة، أو إنشاء مظهر مخصص تمامًا، فإن التعليمات البرمجية الخاصة بك موجودة جنبًا إلى جنب مع تصميمك. استخدم الكلمة الأساسية للمحدد الذكي لاستهداف العناصر بأمان، وحتى احصل على مساعدة الذكاء الاصطناعي إذا كنت عالقًا. إنه الجسر المثالي بين البناء المرئي والتحكم على مستوى التعليمات البرمجية.
CSS حيث يكون له معنى
تختلف احتياجات CSS الخاصة بك في كل مرة. هل تحتاج إلى أنماط على مستوى الموقع لصفحة معينة؟ استخدم لوحة إعدادات الصفحة. ما عليك سوى تعديل زر واحد أو صورة واحدة؟ استخدم علامة التبويب "متقدم" على عنصر واجهة المستخدم هذا بالضبط. يحافظ هذا الأسلوب المرن على تنظيم التعليمات البرمجية الخاصة بك وتحديد نطاقها بشكل صحيح، مما يمنع الأنماط من التأثير عن طريق الخطأ على أجزاء أخرى من موقعك.
- التحكم على مستوى الصفحة: أضف أنماطًا مخصصة عامة لصفحة واحدة أو منشور واحد عبر إعدادات الصفحة > CSS المخصص.
- تعديلات خاصة بالعنصر: أضف CSS محدد النطاق مباشرةً في حقل Advanced > Custom CSS لأي عنصر واجهة مستخدم Elementor.
- سير العمل النظيف: حافظ على اتصال CSS الخاص بك بالسياق الذي تعمل فيه، مما يسهل العثور عليه وإدارته لاحقًا.
اختصار "المحدد" الذكي
يمكن أن تكون كتابة CSS لعناصر واجهة المستخدم الديناميكية أمرًا صعبًا لأن أسماء الفئات تتغير. يقوم نظامنا بإصلاح ذلك. ما عليك سوى استخدام محدد الكلمات الرئيسية في التعليمات البرمجية الخاصة بك. فهو يشير تلقائيًا إلى فئة الغلاف الفريدة للعنصر الذي تقوم بتحريره. وهذا يعني أن أنماطك تنطبق بدقة على تلك الأداة ولا شيء غير ذلك، مما يجعل التعليمات البرمجية الخاصة بك قوية ومحمولة.
- استهداف مضمون: محدد الكتابة {اللون: أحمر؛ } وسيقوم بتصميم هذا العنصر المحدد فقط.
- لا مزيد من التعليمات البرمجية المكسورة: لن ينكسر CSS الخاص بك إذا تغيرت أسماء الفئات التي تم إنشاؤها بواسطة Elementor.
- مثالي لحالات التمرير/التركيز: يمكنك كتابة المحدد بسهولة: التمرير {...} لإنشاء تفاعلات متقدمة.
الأسئلة المتداولة لـ CSS المخصصة
هل أحتاج إلى أن أكون خبيرًا في CSS لاستخدام هذا؟
ليس على الاطلاق! إنه مصمم لجميع المستويات. يمكن للمبتدئين استخدام الذكاء الاصطناعي مثل Gemini أو Deepseek أو OpenAI لإنشاء تعليمات برمجية بسيطة للألوان أو التباعد. سيحب المستخدمون المتوسطون اختصار المحدد للتصميم الآمن. يحصل الخبراء على سير عمل مبسط دون تبديل السياقات. ينمو بمهارتك.
كيف يكون هذا أفضل من إضافة CSS في لوحة "CSS الإضافية" الخاصة بالموضوع الخاص بي؟
يتعلق الأمر بالنطاق والتنظيم. موضوع CSS عالمي ويمكن أن يؤثر على كل صفحة، مما يؤدي إلى تعارضات. يتيح لك هذا الامتداد إضافة CSS فقط عندما تكون هناك حاجة إلى intage في صفحة واحدة أو عنصر واجهة مستخدم واحد. وهذا يحافظ على نظافة CSS العالمي الخاص بك ويجعل من السهل جدًا إدارته واستكشاف الأخطاء وإصلاحها لاحقًا.
هل سيتم تحميل CSS الذي أضيفه هنا بسرعة للزوار؟
نعم. تتم إضافة CSS الذي تكتبه هنا إلى HTML الخاص بالصفحة في علامة <style>، وهي علامة سريعة جدًا بشكل عام. إنها أكثر كفاءة من تحميل ورقة أنماط خارجية إضافية. فقط تجنب كتابة آلاف الأسطر من التعليمات البرمجية في حقل واحد، كما هو الحال مع أي طريقة.
ماذا يحدث إذا استخدمت الكلمة الأساسية "المحدد" في مربع إعدادات الصفحة CSS؟
في إعدادات الصفحة، تشير الكلمة الأساسية للمحدد عادةً إلى الغلاف الرئيسي للصفحة أو المنشور بأكمله. من الأفضل استخدامه للأنماط الواسعة على مستوى الصفحة. بالنسبة للتصميم الخاص بعنصر واجهة المستخدم، يجب عليك دائمًا استخدام حقل CSS داخل علامة التبويب "متقدم" الخاصة بعنصر واجهة المستخدم حيث يشير المحدد إلى عنصر واجهة المستخدم هذا وحده.
عناصر واجهة المستخدم والملحقات الشائعة
إنشاء مواقع متطورة في وقت أقل.
التشكل الزجاجي
إضافات الحاويات
أنماط
![ملحق Master Addons Post/Page Duplicator لـ Elementor: رابط صف MA Duplicator في قائمة صفحات WordPress لإنشاء صفحة مقصودة - مسودة [مكررة #128]](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
ناسخ البريد/الصفحة
