آدرس

تهران، خیابان شریعتی، بالاتر از سه راه ملک، روبروی آتش نشانی

شماره تماس

۰۹۱۹۳۴۲۶۲۵۱
۰۲۱۹۱۳۰۳۴۲۴

آدرس ایمیل

info@artarasaneh.com
artarasaneh@gmail.com

ویجت جعبه تلنگر در المنتور وردپرس

ویجت جعبه تلنگر در المنتور وردپرس

می‌خوای سایتت یه تلنگر کوچیک بزنه تا توجه کاربر رو جلب کنه؟ با ویجت Flip Box در المنتور، می‌تونی با یه حرکت ساده، اطلاعات رو به‌ صورت خلاق و متفاوت نمایش بدی!

ایجاد محتوا به صورت تعاملی

ویجت flip box در المنتور ابزاری کاربردی برای نمایش محتوا به صورت تعاملی و جذاب است. این ویجت امکان طراحی جعبه‌هایی را فراهم می‌کند که با حرکت موس یا لمس روی موبایل، تصویر یا متن پشت جعبه نمایان می‌شود. استفاده از این ویژگی باعث جلب توجه کاربران و ارتقای تجربه بصری سایت می‌شود و محتوای مهم را به شکل مؤثری نمایش می‌دهد.

ویجت flip box امکانات متنوعی در اختیار کاربران قرار می‌دهد. می‌توان متن، تصویر، آیکن و دکمه‌های فراخوان را در هر دو طرف جعبه قرار داد و نحوه نمایش آن‌ها را به دلخواه تنظیم کرد. همچنین امکان تغییر رنگ، فونت، اندازه و افکت‌های حرکتی وجود دارد تا ظاهر جعبه با طراحی سایت هماهنگ شود. این قابلیت‌ها باعث می‌شوند محتوای ارائه شده هم جذاب و هم قابل فهم باشد.

بخش محتوا در ویجت flip box المنتور

بخش محتوا در ویجت flip box المنتور
 

در بخش محتوا (Content) ویجت جعبه تلنگر (Flip Box) المنتور شما اطلاعات اولیه و اصلی این المان تعاملی را وارد میکنید. این ویجت دارای دو سمت است: روی کارت و پشت کارت. در تب محتوا شما برای هر دو سمت عنوان اصلی توضیحات متنی و در صورت نیاز یک آیکون یا تصویر انتخاب میکنید. همچنین تنظیمات مربوط به دکمه متن و لینک و جهت حرکت یا انیمیشن تلنگر خوردن کارت (Flip Direction) در همین بخش مشخص میشود. این بخش محل ورود تمام دادههای خام است که قرار است هنگام تعامل کاربر با کارت نمایش داده شوند.

شما می توانید فیلم کامل آموزش این ویجت را که توسط استاد اسماعیلی از اساتید مجرب مجموعه آرتا رسانه، تدریس شده، در ادامه به صورت 100% رایگان مشاهده کنید. برای دیدن ویدئوی این المان به کانال یوتیوب آرتا رسانه مراجعه فرمایید.

در این آموزش یاد می‌گیری چطور با ویجت Flip Box در المنتور، جعبه‌های تعاملی و جذاب بسازی که وقتی کاربر روشون هاور می‌کنه، برمی‌گردن و محتوای جدیدی رو نشون می‌دن. این ویجت برای بخش‌های معرفی خدمات، ویژگی‌ها یا هرجایی که بخوای محتوا رو به‌صورت خلاقانه نمایش بدی فوق‌العاده‌ست.

فرانت در بخش محتوای جعبه تلنگر المنتور

فرانت یا روی کارت (Front Side) در ویجت جعبه تلنگر (Flip Box) المنتور به آن بخش اولیه و قابل مشاهده کارت اشاره دارد که کاربر هنگام بارگذاری صفحه برای اولین بار آن را می‌ بیند. در تنظیمات بخش محتوا، شما می‌ توانید المان‌های این سمت کارت شامل یک آیکون یا تصویر جذاب، یک عنوان اصلی و یک متن توصیفی مختصر را وارد کنید. هدف از طراحی سمت فرانت، جلب توجه سریع کاربر و ارائه یک سرنخ بصری یا متنی جذاب است تا او تشویق شود با کارت تعامل داشته باشد و اطلاعات کامل‌ تر را که در سمت "بک" پشت کارت پنهان شده است، مشاهده کند.

 بک در بخش محتوای flip box وردپرس

پشت یا بک (Back Side) در ویجت جعبه تلنگر المنتور، بخشی از کارت است که محتوای ثانویه و معمولا مفصل تری را در خود جای میدهد و تنها پس از عمل تلنگر (Flip) یا چرخش کارت توسط کاربر نمایان میشود. در تنظیمات بخش محتوا، شما متنی توضیحی، یک دکمه فراخوان به عمل (CTA) با لینک مشخص و عنوان مربوط به آن را برای این سمت کارت وارد میکنید. هدف از سمت بک، ارائه جزئیات بیشتر، تشویق کاربر به اقدام خاص مثلا خرید یا مطالعه بیشتر و تکمیل اطلاعاتی است که در سمت فرانت روی کارت به اختصار بیان شده بود.

تنظیمات در ویجت جعبه تلنگر در المنتور

تنظیمات در بخش محتوای جعبه تلنگر المنتور مجموعه ای از گزینه ها را برای مدیریت هر دو سمت کارت (روی و پشت) ارائه میدهد. این تنظیمات به شما اجازه میدهند تا نوع محتوا (آیکون یا تصویر)، عناوین، توضیحات و دکمه ها را برای هر طرف به صورت مجزا وارد کنید. علاوه بر این، در همین بخش تنظیمات مهمی برای تعیین ارتفاع کلی جعبه تلنگر، نحوه فعال شدن انیمیشن (کلیک یا هاور ماوس) و جهت انیمیشن (مثلا چرخش افقی از راست به چپ یا عمودی) وجود دارد که رفتار تعاملی المان را قبل از رفتن به بخش استایل تعیین میکنند.

بخش استایل در ویجت جعبه تلنگر وردپرس

بخش استایل در ویجت جعبه تلنگر المنتور
 

در بخش استایل ویجت جعبه تلنگر (Flip Box) المنتور شما کنترل کاملی بر ظاهر بصری هر دو سمت کارت فرانت و بک و همچنین تنظیمات کلی کادر دارید. این بخش به دو قسمت اصلی تقسیم میشود: یکی برای سفارشی سازی روی کارت و دیگری برای پشت کارت. در هر قسمت میتوانید مواردی مانند رنگ پس زمینه، تنظیمات تایپوگرافی فونت، اندازه، رنگ متن عناوین و توضیحات، استایل دهی به آیکون ها یا تصاویر، و تنظیمات مربوط به دکمه در پشت کارت را مدیریت کنید. هدف این بخش هماهنگ سازی ظاهر بصری این المان تعاملی با طراحی کلی وب سایت شماست.

فرانت در بخش استایل جعبه تلنگر المنتور

در بخش استایل ویجت جعبه تلنگر، قسمت فرانت یا روی کارت به شما اجازه میدهد ظاهر بصری آن سمت از کارت را که در ابتدا قابل مشاهده است، به طور کامل سفارشی سازی کنید. این تنظیمات شامل مواردی مانند انتخاب رنگ پس زمینه یا تصویر پس زمینه، تنظیمات کامل تایپوگرافی برای عنوان اصلی و متن توضیحات شامل فونت، اندازه، رنگ متن و فاصله خطوط، و همچنین استایل دهی به آیکون یا تصویر استفاده شده در روی کارت مانند اندازه، رنگ و حاشیه میشود. هدف این تنظیمات ایجاد یک نمای جذاب و گیرا است که کاربر را به تعامل با ویجت و دیدن پشت کارت ترغیب کند.

بک دربخش استایل flip box المنتور

در بخش استایل ویجت جعبه تلنگر، قسمت پشت یا بک کارت به شما امکان میدهد ظاهر بصری سمت پنهان کارت را که پس از چرخش نمایش داده میشود، سفارشی سازی کنید. این تنظیمات دقیقا مشابه سمت فرانت شامل گزینه هایی برای تعیین رنگ پس زمینه یا تصویر پس زمینه، تنظیمات کامل تایپوگرافی برای عنوان و توضیحات متنی، و همچنین استایل دهی کامل دکمه فراخوان به عمل شامل رنگ دکمه، رنگ متن، حاشیه و افکت هاور است. هدف این بخش ایجاد یک ظاهر جذاب و متقاعدکننده برای تشویق کاربر به انجام اقدام نهایی مورد نظر شماست.

بخش پیشرفته در ویجت جعبه تلنگر المنتور

بخش پیشرفته در ویجت جعبه تلنگر وردپرس
 

بخش پیشرفته (Advanced) درالمنتور، مجموعه‌ ای از تنظیمات قدرتمند را ارائه می‌ دهد که فراتر از محتوا و استایل پایه هستند و به شما کنترل دقیقی بر چید مان، فاصله و جلوه‌های ویژه می‌دهند در این بخش می‌توانید حاشیه‌ های داخلی (Padding) و خارجی (Margin) را برای کنترل دقیق فضای اطراف تیتر تنظیم کنید همچنین، گزینه‌ هایی برای افزودن افکت‌ های حرکتی جذاب مانند انیمیشن‌ های ورود، تنظیمات ریسپانسیو برای پنهان کردن تیتر در دستگاه‌ های خاص، و افزودن کلاس‌ های CSS سفارشی یا شناسه‌های ID برای استایل‌ دهی اختصاصی وجود دارد. این تنظیمات پیشرفته به طراحان اجازه می‌ دهد تا کنترل کامل بر موقعیت‌ یابی و تعامل‌ پذیری تیتر در صفحه داشته باشند.

آموزش طرح‌ بندی در ویجت جعبه تلنگر 

در بخش طرح‌ بندی (Layout) یا همان تنظیمات ابعادی درالمنتور، شما می‌ توانید نحوه قرارگیری و اندازه تصویر را در صفحه کنترل کنید این تنظیمات شامل تعیین عرض و حداکثر عرض با استفاده از واحدهای مختلف مانند پیکسل یا درصد هستند که انعطاف‌ پذیری بالایی برای نمایش تصویر در دستگاه‌های مختلف فراهم می‌ کنند همچنین، با استفاده از گزینه تراز بندی می‌توانید موقعیت افقی تصویر چپ، راست، وسط را تنظیم کرده و با مدیریت حاشیه‌های داخلی و خارجی در بخش پیشرفته، فضای اطراف تصویر را مدیریت کنید تا مطمئن شوید تصویر به درستی و به صورت واکنش‌ گرا در جریان کلی طراحی صفحه شما قرار می‌ گیرد.

آموزش موشن افکت در flip box المنتور

گزینه موشن افکت به شما این قابلیت را می‌ دهد که انیمیشن‌ها و جلوه‌های حرکتی جذاب به عناصر صفحه خود اضافه کنید تا وب‌ سایت شما پویاتر و جذاب‌ تر شود . این تنظیمات شامل دو دسته اصلی هستند: انیمیشن‌های ورودی که هنگام بارگذاری یا اسکرول کاربر به سمت عنصر فعال می‌ شوند؛ و افکت‌های اسکرول که با حرکت دادن صفحه، باعث ایجاد جلوه‌هایی مانند حرکت پارالاکس عمودی یا افقی، شفافیت تدریجی یا مقیاس‌ پذیری می‌ شوند استفاده از موشن افکت‌ ها می‌ تواند توجه کاربر را به بخش‌های خاصی جلب کند، اما استفاده بیش از حد از آنها ممکن است باعث حواس‌ پرتی یا کاهش عملکرد وب‌ سایت شود.

بخش تبدیل در ویجت جعبه تلنگر وردپرس

گزینه تبدیل مجموعه‌ ای از ابزارهای قدرتمند CSS را در اختیار شما قرار می‌ دهد تا بتوانید ظاهر و موقعیت عناصر را بدون تأثیرگذاری بر چیدمان کلی صفحه تغییر دهید این قابلیت شامل توابعی مانند چرخش برای چرخاندن عنصر در زوایای مختلف، مقیاس برای کوچک یا بزرگ کردن اندازه آن، کج کردن برای ایجاد جلوه‌ های زاویه‌ دار، و انتقال برای جابجایی دقیق عنصر در محورهای افقی و عمودی است با استفاده از این ابزارها، می‌توانید جلوه‌های بصری خلاقانه و تعاملی ایجاد کنید و با فعال‌ سازی گزینه هاور ، این تبدیل‌ها را به صورت انیمیشنی هنگام قرار گرفتن ماوس کاربر روی عنصر اعمال نمایید.

گزینه پس زمینه در ویجت جعبه تلنگر المنتور

در بخش پس‌زمینه المنتور، که در تنظیمات سکشن‌ها، ستون‌ها، کانتینرها و حتی برخی ویجت‌ها در دسترس است، شما می‌ توانید ظاهر پشت عناصر خود را به طور کامل سفارشی‌ سازی کنید . این بخش شامل چند ین گزینه قدرتمند است: می‌ توانید از یک رنگ کلاسیک ساده استفاده کنید، یک گرادیانت زیبا با ترکیب دو یا چند رنگ ایجاد نمایید، یا یک تصویر را به عنوان پس‌ زمینه آپلود کنید هنگام استفاده از تصاویر، تنظیماتی مانند موقعیت، اندازه ، و تکرار تصویر وجود دارد همچنین، در نسخه‌ های پیشرفته‌ تر المنتور، امکان استفاده از پس‌زمینه ویدئویی یا حتی نمایش اسلاید تصاویر نیز فراهم است که به شما اجازه می‌ دهد پس‌زمینه‌ هایی جذاب و تعاملی ایجاد کنید و با استفاده از پوشش پس‌زمینه، خوانایی متن روی تصویر را بهبود بخشید.

گزینه حاشیه در ویجت flip box وردپرس

تنظیمات حاشیه (Border) کنترل کاملی بر خطوط اطراف هر عنصر به شما می‌ دهد این تنظیمات به شما امکان می‌ دهند که سبک حاشیه را انتخاب کنید مثلاً توپر ، نقطه‌چین ، خط‌ چین و غیره، ضخامت دلخواه را برای هر چهار طرف تعیین کنید و رنگ حاشیه را متناسب با طراحی خود تنظیم نمایید . علاوه بر این، ویژگی بسیار کاربردی شعاع مرزوجود دارد که با استفاده از آن می‌ توانید گوشه‌ های تیز عنصر را گرد کنید و جلوه‌های بصری نرم‌تر یا مدرن‌ تری ایجاد نمایید این تنظیمات به شما کمک می‌ کنند تا عناصر مختلف صفحه را کادربندی کرده و ساختار بصری واضح‌ تری در طراحی خود ایجاد کنید.

آموزش ماسک در ویجت جعبه تلنگر المنتور 

ویژگی ماسک (Masking) به شما اجازه می‌ دهد تا شکل ظاهری یک عنصر، مانند تصویر یا پس‌ زمینه، را از حالت مستطیل پیش‌ فرض خارج کنید با استفاده از این قابلیت، می‌ توانید از اشکال آماده‌ای مانند دایره، لوزی، مثلث یا حتی اشکال سفارشی استفاده کنید تا محتوای شما به جای نمایش در یک قاب چهارگوش، در داخل آن شکل خاص نمایش داده شود این ویژگی یک ابزار طراحی خلاقانه است که بدون نیاز به نرم‌افزارهای گرافیکی پیچیده، به شما امکان می‌ دهد جلوه‌های بصری منحصر به فردی ایجاد کرده و بخش‌های خاصی از تصویر را پنهان یا برجسته نمایید.

بخش واکنش‌ گرا در ویجت جعبه تلنگر المنتور

واکنش‌ گرا (Responsive) یا واکنش‌گرایی در طراحی وب به رویکردی گفته می‌ شود که در آن چید مان و ظاهر یک وب‌ سایت به طور خودکار با اندازه صفحه نمایش دستگاه کاربر تنظیم می‌ شود هدف اصلی این است که وب‌ سایت شما در هر دستگاهی، از جمله رایانه‌ های رومیزی، لپ‌تاپ‌ها، تبلت‌ها و تلفن‌های هوشمند، به بهترین شکل ممکن نمایش داده شود و تجربه کاربری بهینه‌ ای فراهم کند در المنتور، قابلیت‌ های واکنش‌ گرایی بسیار برجسته هستند و شما می‌ توانید در حالت‌های مختلف نمایشی دسکتاپ، تبلت و موبایل تنظیمات متفاوتی را برای مواردی مانند اندازه فونت، حاشیه‌ ها، تعداد ستون‌ها و حتی نمایش یا پنهان کردن عناصر خاص اعمال کنید.

آموزش ویژگی ها در بخش پیشرفته ویجت flip box المنتور

افزونه المنتوربرای ورد پرس دارای مجموعه‌ ای گسترده از ویژگی‌ها است که آن را به یکی از محبوب‌ ترین سازندگان صفحات بصری تبدیل کرده است ویژگی اصلی آن رابط کاربری کشیدن و رها کردن است که به کاربران اجازه می‌ دهد بدون دانش کدنویسی، صفحات وب حرفه‌ ای طراحی کنند المنتور شامل کتابخانه‌ ای غنی از ویجت‌ها برای افزودن انواع محتوا مانند متن، تصویر، دکمه، فرم و غیره، و همچنین قابلیت‌ های پیشرفته‌ ای مانند سیستم طراحی ، تنظیمات واکنش‌گرا برای نمایش در دستگاه‌های مختلف، و امکان استفاده از قالب‌های آماده (Templates) است علاوه بر این، ویژگی‌ هایی مانند ویرایش زنده کنترل کامل بر استایل‌ دهی و گزینه‌ های پیشرفته طرح‌ بندی، المنتور را به ابزاری قدرتمند برای طراحان وب تبدیل کرده است.

بخش css سفارشی (Custom CSS) در ویجت جعبه تلنگر 

در بخش پیشرفته(Advanced) المنتور، گزینه CSS سفارشی یک ویژگی بسیار قدرتمند است که به کاربران امکان می‌ دهد کدهای استایل‌ دهی دلخواه خود را مستقیماً به یک ویجت، ستون، کانتینر یا سکشن خاص اضافه کنند این ویژگی برای طراحانی مفید است که نیاز به کنترل دقیقی فراتر از تنظیمات پیش‌فرض المنتور دارند، مانند اعمال جلوه‌های بصری منحصر به فرد یا رفع مشکلات جزئی چیدمان . با استفاده از این قابلیت، کد CSS نوشته شده تنها بر روی همان عنصر خاص اعمال می‌ شود و بدون نیاز به دسترسی به فایل‌ های اصلی قالب یا نصب افزونه‌های اضافی، امکان شخصی‌ سازی بی‌ نهایت ظاهر وب‌ سایت را فراهم می‌ کند .

ویژگی مهم جعبه تلنگر المنتور

یکی از مزایای مهم این ویجت واکنش‌گرا بودن آن است. جعبه‌های تلنگر به صورت خودکار روی موبایل، تبلت و دسکتاپ بهینه نمایش داده می‌شوند و کاربران می‌توانند بدون مشکل با محتوا تعامل داشته باشند. علاوه بر این، تنظیم سرعت حرکت و نوع افکت‌ها به طراحان اجازه می‌دهد کنترل کاملی روی تجربه کاربری داشته باشند.

ویجت flip box همچنین امکان لینک‌دهی مستقیم به صفحات داخلی یا خارجی سایت را فراهم می‌کند. این قابلیت باعث افزایش تعامل کاربران و هدایت آن‌ها به بخش‌های مهم سایت می‌شود. استفاده از جعبه‌های تلنگر برای معرفی محصولات، خدمات، ویژگی‌ها و نکات آموزشی، ارزش محتوایی سایت را افزایش می‌دهد و کاربران را به کشف بیشتر سایت تشویق می‌کند.

ویجت جعبه تلنگر در المنتور از نظر سئو

 استفاده از ویجت flip box به بهبود تجربه کاربری کمک می‌کند و باعث افزایش مدت زمان حضور کاربران در سایت می‌شود. طراحی منظم و تعاملی جعبه‌ها همچنین باعث می‌شود موتورهای جستجو محتوای سایت را راحت‌تر بررسی و ایندکس کنند و ساختار سایت بهینه‌تر شود.

ویجت flip box در المنتور ابزاری حرفه‌ای و منعطف برای ایجاد محتوای تعاملی و جذاب است. امکانات گسترده، طراحی بصری و قابلیت‌های واکنش‌گرا آن را به یکی از عناصر مهم در طراحی وب‌سایت‌های مدرن تبدیل کرده است.

 

اشتراک گذاری :
مریم گوهرزاد
نویسنده

مریم گوهرزاد

مدرس و بنیانگذار هلدینگ آرتا رسانه. برنامه نویس و محقق حوزه بلاکچین

نظر خودتون رو با ما در میون بزارید

فیلدهای ستاره دار الزامی هستند . ایمیل شما منتشر نمیشود.

https://t.me/artarasaneh
tel:09193426251
https://wa.me/+989193426251
https://instagram.com/artarasaneh_com