هل ترغب في إنشاء زر عائم باستخدام الفهرس Z. Elementor ?
نحن على يقين من أنك على دراية بالزر الذي يظهر أمام جميع محتويات الشاشة وعادة ما يكون له شكل دائري وأيقونة في المنتصف. حسنًا ، هذا هو زر الإجراء العائم.
يمكن أن يؤدي زر الإجراء العائم إلى تشغيل إجراء أو إرسال إبحار إليك في مكان ما. مثل مشغلات رسائل البريد الإلكتروني والشبكات الاجتماعية وتوجيهات آخر للاشتراك في قناة وغيرها الكثير.
في Elementor، هناك طريقتان لإنشاء زر إجراء عائم ، وهما كالتالي:
- عن طريق تحديد Z- الفهرس
- عن طريق إنشاء نافذة منبثقة -Popup-
في هذا البرنامج التعليمي سوف نوضح لك فقط كيفية إنشاء زر إجراء عائم من خلال ضبط فهرس Z. وسنستخدم الإصدار المحترف لتحقيق ذلك.
لكن أولاً ، اكتشف: كيفية تثبيت Elementor على WordPress
كيفية إنشاء زر الإجراء العائم في Elementor
يمكنك استخدام النسخة المجانية منElementor لإنشاء زر الإجراء العائم بهذه الطريقة. لكنك تحتاج إلى لصق الزر الذي صممته في كل صفحة حيث تريد عرض الزر على جهازك موقع على شبكة الإنترنت.
مع إليمنتور برو، يمكنك أيضًا الوصول إلى الميزة لغة تنسيق ويب حسب الطلب، والتي سنستخدمها في هذا البرنامج التعليمي.
انتقل إلى محرر Elementor الخاص بك ؛ يمكنك تعديل المحتوى الحالي الخاص بك (صفحات ، مقالات ، إلخ ...) أو إنشاء محتوى جديد. في هذا البرنامج التعليمي ، سنقوم بتعديل صفحة.
أولاً ، قم بإنشاء قسم جديد بعمود واحد. حدد أداة الزر وقم بسحبه وإفلاته في منطقة التحرير من لوحة الأدوات. ثم قم بتغيير الزر نص و حلقة الوصل.
في هذا البرنامج التعليمي ، سنستخدم الزر كمحفز للضغط على ملف آخر للتنقل في موقع انترنت العنصر. ثم ، على الخيار انحياز، اضبطه على حق et, أخيرًا ، قم بتغيير ملف حجم من زر التشغيل كبير جدا.
كما ترى في GIF أعلاه ، هذا الزر ثابت في القسم. بعد ذلك ، سوف نجعله يتحرك أثناء قيامنا بالتمرير مع إبقائه في نفس الموضع.
اذهب إلى علامة التبويب متقدم. في المعلمة تصميم، اضبط العرض على Inline (السيارة) ، تحديد ال الموقف على ثابت، جلس اتجاه أفقي علي حق وتعديله الوقت الفرق كما تريد.
بعد ذلك ، سنحدد الأساسيات في هذه الطريقة. في الحقل Z-مؤشر، أدخل الرقم 9999 ; سيجعل الزر دائمًا في المقدمة (عائمًا).
حان الوقت الآن لتدوير زر الإجراء العائم. دائما تحت علامة التبويب متقدم، الوصول إلى فصول css من الكتلة تصميم, ثم اكتب rotate في الداخل.
انظر أيضا: العنصر: تقديم أفضل منشئ صفحات WordPress
بعد ذلك اذهب إلى المبنى CSS مخصصة ، ثم الصق الكود التالي في الحقل:
.rotate.rotate
{transform: rotate(90deg);}يمكنك أن ترى أن المقبض قد استدار للتو ، ولكن هناك فجوة غريبة بين جانب الشاشة. لذلك ، دعونا نصلحها عن طريق تعديل الوقت الفرق في -92
أخيرًا ، سنقوم بلمسة أخيرة صغيرة لزر الإجراء العائم هذا. الوصول إلى الكتلة محول، حدده نظرة عامة، الوصول إلى الخيار عوض وضبط كل خيار على 7.
هناك عدة خيارات لتحقيق شيء معين في Elementor. عندما يتعلق الأمر بالزر العائم ، هناك خياران يمكنك استخدامهما. لقد قمنا هنا بتغطية طريقة واحدة فقط ، وستكون الطريقة الأخرى عبارة عن برنامج تعليمي آخر.
اقرأ أيضا: العنصر: كيفية ترحيل موقع WordPress
إذا كنت ترغب في الحصول على المزيد من خيارات التصميم ، فسيكون إنشاء زر إجراء عائم باستخدام منشئ Popup بديلاً أفضل حيث سيكون لديك خيارات لتخصيص الزر بالإضافة إلى السلوك ، مثل وقت إغلاق الزر ، والمدة ، وحركة الدخول أو الخروج ، إلخ. .
لقد أكملت للتو هذه المهمة بسهولة. فقط قم بمعاينة عمل جهازك اللوحي والهاتف الذكي ، في محاولة لتغيير الهوامش لتتناسب مع كل جهاز.
احصل على Elementor Pro الآن!
وفي الختام
لذا ! هذا كل شيء في هذه المقالة التي توضح لك كيفية تطبيق تأثير Zoom على بطاقة ملف تعريف. إذا كانت لديك أية مخاوف بشأن كيفية الوصول ، فأخبرنا بذلك تعليقات.
ومع ذلك ، يمكنك أيضا استشارة مواردنا، إذا كنت بحاجة إلى مزيد من العناصر لتنفيذ مشاريعك الخاصة بإنشاء مواقع الإنترنت ، من خلال الرجوع إلى دليلنا على وورد خلق بلوق أو واحد على ديفي: أفضل موضوع وورد في كل العصور.
ولكن في هذه الأثناء ، شارك هذا المقال على الشبكات الاجتماعية المختلفة.
...
