

سلام
استفاده از صفحات پاپ آپ کاربرد های فراوانی در وب سایت دارد. می توان گفت در امر طراحی سایت یکی از موارد مهم ، استفاده از صفحات پاپ آپ است. برای آشنایی با افزونه ای کاربردی در ساخت این صفحات با ما همراه باشید.
صفحه پاپ آپ چیست؟
صفحه پاپ آپ به صفحاتی گفته می شود که هنگام ورود به سایت به بازدیدکننده نمایش داده می شود و پیام خاصی را منتقل می کند. این صفحه روی همه صفحات دیگر قرار می گیرد و بازدیدکننده برای مشاهده سایت ابتدا باید آن را ببندد. همانطور که گفته شد این صفحات کاربرد های فراوانی در یک سایت دارند. از آن جمله می توان به : ساخت صفحات فرود (Landing Page) ، نمایش پیامی خاصی هنگام ورود به سایت و یا هنگام خروج از سایت ، نمایش پیامی خاص هنگام کلیک روی قسمت تعیین شده و … اشاره کرد.
چگونه می توان آن را ایجاد کرد؟
برای ایجاد این صفحات می توان از افزونه استفاده کرد. افزونه های مختلفی وجود دارند که برای شما صفحه پاپ آپ ایجاد می کنند. برخی از این افزونه ها حتی طرح های از پیش آماده نیز دارند و فقط کافی است شما متن مورد نظر خود را به آنها بدهید تا صفحه پاپ آپ شما را بسازند. افزونه ای که امروز قصد معرفی آن را داریم ITRO Popup Plugin نام دارد. افزونه ای منعطف که در نهایت آسانی می توانید صفحه پاپ آپ خود را به کمک آن ایجاد کنید.
آموزش کار با ITRO Popup Plugin
کار با این افزونه خیلی ساده و راحت است. پس از نصب آن به قسمت تنظیمات رفته و روی ITRO Popup Plugin کلیک می کنیم. بخش تنظیمات افزونه ، نمایش داده می شود. در سمت راست ابتدا می توانید متن مورد نظر خود را قرار دهید و یا از کد های HTML استفاده کنید.
در سمت چپ با زدن تیک SHOW ADVANCED SETTINGS (نمایش تنظیمات حرفه ای) تنظیمات بیشتری نیز نمایش داده می شود.
در ادامه به توضیح قسمت های مختلف این تنظیمات می پردازیم:
DECIDE WHERE POPUP WILL BE DISPLAYED
این گزینه همانطور که از معنی آن پیداست ، مشخص می کند صفحه پاپ آپ ، کجا (در چه صفحاتی) نمایش داده شود. گزینه های پیش رو : “هیچ صفحه ای” ، “همه صفحات” ، “فقط صفحات انتخاب شده” و “صفحه اصلی” هستند که شما می توانید یکی از این موارد را انتخاب کنید. برای نمایش در صفحه اصلی گزینه “blog homepage” را انتخاب کنید.
GENERAL SETTINGS
این قسمت شامل تنظیمات عمومی است.
“Disable ESC Key” صفحه پاپ آپ با زدن دکمه اسکیپ در صفحه کلید بسته می شود.
“Disable on Mobile Device” باعث می شود صفحه پاپ آپ در موبایل نمایش داده نشود.
“Popup Seconds” تعیین می کند صفحه پاپ آپ برای چند ثانیه نمایش داده شود. همچنین “Popup Delay” تعیین می کند که صفحه پاپ آپ پس از چند ثانیه مکث نمایش داده شود.
“Countdown font color” تعیین میکند از رنگ های پیشفرض برای رنگ فونت ها استفاده شود و یا میتوانید رنگ فونت ها را به صورت دستی تعیین کنید.
POPUP ASPECT
این قسمت مربوط به تنظیمات ظاهری صفحه است.
“Popup Width” و “Popup height” به ترتیب مربوط به عرض و ارتفاع صفحه است که شما می توانید آن را به پیکسل تعیین کنید و یا در حالت اتوماتیک قرار دهید.
“Popup border color” و “Popup background color” مربوط به تعیین رنگ کادر دور صفحه و پشت زمینه صفحه هستند. (برای تعیین این کد ها می توانید از فتوشاپ کمک بگیرید)
” Popup border radius ” مربوط به میزان گردشدن صفحه در گوشه ها آن است.
” Popup border width ” ضخامت کادر دور صفحه را مشخص می کند.
” Popup padding ” میزان فضای اشغالی توسط صفحه را بیشتر می کند. (فضای صفحه بزرگتر می شود)
” Background Image ” برای صفحه عکس پس زمینه قرار می دهد.
” Popup position ” تعیین می کند که مکان صفحه پاپ آپ با اسکرول کردن صفحه ثابت بماند و یا به بالا برود.
“Automatic top margin” فاصله صفحه پاپ آپ را از بالای پنجره مرورگر حفظ می کند.
“Background opacity” میزان وضوح تصویر پس زمینه را مشخص می کند.
“Opaque background color” بر روی تصویر پس زمینه یک لایه رنگ ایجاد میکند و تصویر مات می شود. در اینجا می تواند آن رنگ را تعیین کنید.
در پایان تنظیمات خود را ذخیره کرده و حاصل کار را مشاهده می کنیم.
یک نمونه ساده از کار با این افزونه را مشاهده می کنید. با صرف وقت بیشتر ، صفحات پاپ آپ زیبا تری میتوان ساخت. امیدواریم توانسته باشیم شما را در فرآیند طراحی سایت کمی کمک کنیم.
موفق باشید.
منبع: hamyarwp