سلام دوستان! پیشنهاد میکنم در موردش صحبت کنیم ایجاد پنجره های مدال در وردپرس. پنجره های پاپ آپ (مدال) به طور قابل توجهی قابلیت های سایت را گسترش می دهند. آیا پیام یا تبلیغی دارید که هر بازدید کننده وب سایت باید آن را ببیند؟ آیا باید کمپین خود را قابل مشاهده کنید؟ آیا می خواهید یک فرم ثبت نام پاپ آپ در وب سایت خود ایجاد کنید یا فرمی برای اشتراک گذاری محتوا در شبکه های اجتماعی؟ یک پنجره مودال ایجاد کنید!

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

توجه!از طولانی بودن این درس نترسید - هیچ مشکلی در ایجاد پنجره های مدال وجود ندارد (آن را بخوانید و خودتان ببینید)، من فقط هر مرحله را با جزئیات شرح می دهم.

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

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

1. نصبافزونه Popup Maker. فعال کنیدخود. اجازه دهید یادآوری کنم: ما نحوه نصب افزونه ها را یاد گرفتیم.
   
2. بخش را در منوی کناری سمت چپ پنل مدیریت پیدا کنید پاپ آپ سازو به زیربخش آن بروید پاپ آپ را اضافه کنید.
3. ویرایشگر پنجره مودال باز می شود. نام پنجره را در قسمت بالای صفحه وارد کنید (نام فقط در پنل مدیریت نمایش داده می شود - کاربران آن را نمی بینند).
4. رسیدن به عنوان پنجره(برای کاربران قابل مشاهده خواهد بود) و آن را در قسمت بالای دکمه وارد کنید افزودن فایل رسانه ای.
5. در بلوک شرایطاز منوی کشویی صفحات (دسته ها) که پنجره در آنها ظاهر می شود را انتخاب کنید. اگر افزونه باید کار کند در تمام صفحات سایت، انتخاب کنید فرمت: همه.
6. به فیلد بزرگ زیر نوار ابزار اضافه کنید متن، تصاویر، ویدئو یا صدا- هر محتوایی که در پنجره پاپ آپ نشان داده می شود. در مثال مورد بررسی، کد یک ویدیو را از یوتیوب اضافه کردم (ما در مورد افزودن ویدیو به سایت وردپرس مطالعه کردیم).
   
7. در بلوک محرک هاتنظیماتی برای باز کردن دستی یا خودکار (فعال سازی خودکار) پنجره پاپ آپ وجود دارد. در مثال ما، مقدار را انتخاب کردم روی Open کلیک کنید.
8. لطفا در زیر ذکر کنید اندازه پاپ آپ(بر حسب پیکسل یا درصد). هنگام انتخاب یک گزینه خودکاراین افزونه به طور خودکار اندازه پنجره مودال را تغییر می دهد.
9. کادر موجود در خط را علامت بزنید غیر فعال کردن پس زمینهبه طوری که صفحه سایت پشت پنجره پاپ آپ قابل مشاهده باشد (توصیه می کنم).
10. برپایی نوع و سرعت انیمیشن(لازم نیست: مقادیر بهینه قبلاً به طور پیش فرض تنظیم شده است).
    
11. موقعیت پنجره را روی صفحه تنظیم کنید. در ابتدا، افزونه آن را در مرکز بالا قرار می دهد.
12. ارزش ملک z-index، به طور پیش فرض تنظیم شده است، معمولاً نیازی به تغییر ندارد.
    
13. گزینه هایی را برای بستن پنجره پاپ آپ انتخاب کنید. چک باکس های موجود در خطوط با "birds" را علامت بزنید برای بستن روی Overlay کلیک کنید(وقتی روی پس‌زمینه اطراف آن کلیک کنید، پنجره بسته می‌شود)، F4 را برای بستن فشار دهید(پنجره با کلید بسته می شود F4), ESC را برای بستن فشار دهید(پنجره با کلید بسته می شود خروج). برای اینکه بازدیدکنندگان سایت را با معمای بستن پنجره مودال آزار ندهید، توصیه می کنم تمام کادرها را علامت بزنید.
    
14. کلیک انتشار.تبریک می گوییم، پنجره مودال شما ایجاد شده است!

درباره سفارشی کردن طراحی پنجره بازشو

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

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

نحوه راه اندازی یک پنجره پاپ آپ

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

افزونه Popup Make هر پنجره را اختصاص می دهد دو کلاس CSS منحصر به فرد. اگر هر یک از این کلاس ها را به یک عنصر صفحه وب اضافه کنید، با کلیک بر روی این عنصر، یک پنجره مودال باز می شود.

کجا و چگونه کامنت های اینستاگرام را تقویت کنیم – همه روش ها. پرتال Pricemm.com متوجه شد چه چیزی ارزان تر و بهتر است: افزایش نظرات در اینستاگرام خود، با برنامه ها، دریافت در ازای آن یا سفارش سرویس در سرویس SMM. مزایا و معایب هر روش.

نمونه هایی از افزودن کد CSS پنجره معین به پیوند، تصویر و دکمه:

< a href = "#" class = >پنجره مودال را باز کنید< / a >

وقتی روی تصویر کلیک می کنید یک پنجره مودال ظاهر می شود

< img src = "popup-primer.jpg" class = "popmake-obrazets-modalnogo-okna"/ >

پنجره Modal پس از کلیک دکمه فعال می شود

< button class = "popmake-obrazets-modalnogo-okna"> پنجره مودال را باز کنید< / button >

بعد از افزودن کلاس CSS به عنصر HTML روی آن کلیک کنید popmake-obrazets-modalnogo-okna. یک پنجره مودال شبیه به این باید ظاهر شود:

ظاهر شده است؟ عالی! اکنون می توانید پنجره های پاپ آپ را پیکربندی کنید. اگر پنجره باز نشد، مشکل را در نظرات توضیح دهید - ما آن را با هم راه اندازی می کنیم!

با سلام خدمت خوانندگان محترم سایت وبلاگ. آیا در برخی از وب سایت ها به پنجره های بازشو توجه می کنید؟ سؤالاتی مطرح شد: آنها چگونه ساخته می شوند و چرا حتی مورد نیاز هستند؟ من دارم بله

پس دوستان امروز دقیقا در مورد آنها به شما می گویم. ولی! بیایید ابتدا دریابیم که چرا اصلاً به آنها نیاز داریم؟ چه چیزی می توانید از آنها دریافت کنید و چه نتیجه ای حاصل خواهد شد؟ من جواب میدم.

از طریق چنین پنجره های بازشو، اثر ضربه بسیار زیاد است. می گویند گاهی پیش می آید که تعداد مشترکان 4 برابر می شود. سرد! مگه نه؟ استفاده از پنجره های پاپ آپ (popunders) یک راه بسیار موثر برای جذب تعداد زیادی بازدید کننده است. آنها معمولا برای موارد زیر استفاده می شوند:

• خبرنامه؛
• روابط عمومی دوره های آموزشی پولی؛
• تبلیغ گروه ها در شبکه های اجتماعی شبکه های؛

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

ولی! اگر پنجره پاپ آپ به درستی پیکربندی شود، می توان همه این مشکلات را دور زد.

پس بیایید به سوال اصلی خود برگردیم.

پاپ آپ ها در وردپرس

1.WP-MK

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

• تبلیغات (به عنوان مثال، Google Adsense)؛
• روابط عمومی برای گروه های خود در رسانه های اجتماعی. شبکه های؛
• فرم اشتراک ساده

می توانید افزونه را از . سپس به روش معمول آن را نصب و فعال می کنیم. به تنظیمات سمت چپ بروید؟ پنجره پاپ آپو موارد زیر را می بینیم:

به نظر من، همه چیز در اینجا ساده است. اگر سوالی دارید می توانید در نظرات بپرسید.

2. پنجره های نینجا.

اگر می‌خواهید کاربران وقتی از سایت شما بازدید می‌کنند و یک پنجره پاپ‌آپ می‌بینند، «Wow» را انتخاب کنند، این افزونه مگا جالب را نصب کنید. Ninja Popups یک هیولای پاپ آپ در . در مقایسه با WP-MK، از نظر عملکرد بسیار برتر است. من متوجه شدم که نینجا پاپ آپ توسط استادان هنر خود استفاده می شود. چرا؟ این افزونه پولی است و همه نمی توانند آن را بپردازند. از خودم می‌توانم بگویم که قیمت‌هایشان مناسب است، چیز زیادی نمی‌خواهند. می توانید در مورد هزینه بیشتر بدانید اینجا.

خوب، بیایید دریابیم که دقیقاً چه چیزی از این افزونه دریافت خواهیم کرد:

• سهولت تنظیمات؛
• بیش از 100 قالب آماده برای اشتراک و سایر انواع تبلیغات (مسابقه، تبلیغات، دوره های آموزشی و غیره)؛
• آمار؛
• نسخه موبایل پنجره پاپ آپ؛
• تنظیم پیشرفته زمان نمایش؛
• و خیلی بیشتر.

اگر می خواهید با تمام مزایای افزونه آشنا شوید، به ادامه مطلب بروید اینارتباط دادن.

چگونه افزونه را برای خود شخصی سازی کنیم؟پیشنهاد می کنم مطلب زیر را ... به جای متن آزار دهنده بهتر است فیلم آموزشی را مشاهده کنید:

دوستان در مورد تنظیمات همین. اما باز هم اگر سوالی دارید در نظرات بپرسید.

3. Popup Maker (پنجره مودال)

افزونه ای که وظیفه ایجاد یک پنجره پاپ آپ مدال را دارد. در مورد ما، با کلیک بر روی موارد زیر، پنجره‌های بازشو نمایش داده می‌شوند:

• ارتباط دادن؛
• دکمه؛
• تصویر

پس چگونه آن را تنظیم می کنید؟

1. دانلودافزونه;

2. نصب و فعال کنید.

3. در سمت چپ منو به دنبال: Pupup Maker -> افزودن جدید.

4. صفحه ای مانند این در مقابل ما ظاهر می شود:

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

بیایید با جزئیات بیشتری به آنها نگاه کنیم.

پنجره بازشو (نام)- هیچ جا نمایش داده نخواهد شد، در اینجا ما به popunder خود در افزونه یک نام می دهیم.

عنوان پنجره را در اینجا وارد کنید- نام را بنویسید (به عنوان مثال: اشتراک در اخبار).

شرایط هدف گذاری- کادری که پنجره ما نمایش داده می شود را علامت بزنید.

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

کد - آنچه در پنجره نمایش داده می شود. در مورد ما، ویدیو از YouTube:

در زیر، تنظیمات دیگری در انتظار ما هستند (اندازه پنجره، شفافیت، زمان نمایش و غیره). هیچ چیز پیچیده ای وجود ندارد. امیدوارم بتونی از پسش بر بیای اگر سوالی دارید، در نظرات بپرسید.

پس از انجام تمام تنظیمات، تنها کاری که باید انجام دهیم این است که پنجره پاپ آپ را منتشر کنیم.

اما دوستان همه چیز نیستند. به بخش بروید Pupup Maker -> All Popups. ما به دنبال کلاس های CSS هستیم. ما به کدهایی مانند این علاقه مندیم: popmake-xxx.

ما به این کد نیاز داریم تا هنگام کلیک بر روی لینک، تصویر یا دکمه، یک پنجره نمایش داده شود (در ابتدا گفتم).

باز کردن پنجره با کلیک بر روی تصویر:

باز کردن با فشار دادن یک دکمه:

< button class = "popmake-xxx" >باز کردن پنجره

این کد را می توان در هر جایی درج کرد (مثلاً در یک مقاله یا ویجت). فرقی ندارد. اگر مشکل یا سوالی دارید، در نظرات بپرسید، خوشحال می شوم کمک کنم.

در این یادداشت شاد، لیست پلاگین های بازشو برای وردپرس به پایان می رسد. امیدوارم از بین این سه مورد مورد علاقه خود را پیدا کنید. ممنون که تا آخر با من بودید

برای به روز رسانی، شرکت کنید. به زودی میبینمت. خداحافظ همه!

با احترام، مغیش ایوان

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

در این مقاله به ایجاد پنجره های پاپ آپ پاپ آپ برای وردپرس می پردازیم.

این نوع پنجره های پاپ آپ را می توان برای اهداف مختلفی استفاده کرد: می توانید فرم اشتراک، نوعی پیام اطلاعاتی، تصویر، فرم تماس و غیره را در این پنجره وارد کنید.

به عنوان ابزاری برای ایجاد پنجره های پاپ آپ در این مقاله افزونه ای مخصوص وردپرس را به نام در نظر خواهم گرفت پاپ آپ وردپرس.

افزونه پاپ آپ وردپرس برای ایجاد پاپ آپ

این افزونه در دایرکتوری افزونه درست در قسمت مدیریت وردپرس موجود است، بنابراین نصب آن آسان است.

آن را از طریق فرم جستجو پیدا کنید و کلیک کنید نصب:

یک مورد جدید در منوی مدیریت در دسترس خواهد بود پاپ آپ:

این مورد به شما امکان می دهد افزونه را پیکربندی کنید و عملکرد آن را مدیریت کنید. بیایید همه موارد فوق را با جزئیات بیشتری در نظر بگیریم.

در زیر پاراگراف پنجره های باز شونقطه پاپ آپتمام پنجره های پاپ آپ موجود و مدیریت آنها در دسترس است. از آنجایی که هنوز پنجره ای ایجاد نشده است، مورد خالی است:

بیایید این وضعیت را اصلاح کنیم و اولین پنجره پاپ آپ خود را ایجاد کنیم، برای این کار به زیر آیتم می رویم جدید اضافه کنو دکمه ای به همین نام را فشار دهید:

یک پنجره جدید ایجاد شده است. بیایید بلافاصله تصمیم بگیریم که محتوای این پنجره چه خواهد بود، مثلاً یک فرم اشتراک باشد.

بیایید راه اندازی پنجره پاپ آپ ایجاد شده را با نوشتن نام آن، یا بهتر است بگوییم یک شناسه خاص شروع کنیم که در صورت وجود، این پنجره را در میان سایر پنجره ها پیدا می کنیم.

این شناسه در ستون نوشته شده است نام پاپ آپ (در پاپ آپ نمایش داده نمی شود)، و از آنجایی که حدس زدن نام این ستون هنگام ترجمه به روسی دشوار نیست، در خود پنجره پاپ آپ نمایش داده نمی شود:

این عنوان و زیرنویس در بالای پنجره پاپ آپ نمایش داده می شود.

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

اینجا، کمی به سمت راست، در بخش تصویر ویژگی پاپ آپ (اختیاری)می توانید هر تصویری را در پنجره پاپ آپ درج کنید:

من تصویری درج نمی کنم.

کمی پایین تر، در بخش دکمه Call To Action (اختیاری)این امکان وجود دارد که یک دکمه با فراخوانی به برخی از عملکردها به پنجره ایجاد شده اضافه کنید:

ساخت چنین دکمه ای بسیار ساده است - شما باید نام دکمه را در ستون بنویسید برچسب دکمه، و در نمودار لینک دکمهپیوندی را قرار دهید که عمل مورد نیاز را فعال می کند.

باقی مانده است که برخی از پارامترهای ایجاد شده را تعیین کنیم پاپ آپپنجره بیایید نگاهی دقیق تر به آنها بیندازیم.

تنظیم گزینه های پاپ آپ

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

بیایید به ترتیب با بخش شروع کنیم ظاهر:

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

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

حالا بیایید به بخش نگاه کنیم رفتار - اخلاق، تنظیماتی که در آن رفتار پنجره پاپ آپ را تعیین می کند:

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

• زمان نمایش پاپ آپ:- زمان (بر حسب ثانیه یا دقیقه، اختیاری) از لحظه باز شدن صفحه سایت تا زمانی که پنجره پاپ آپ ظاهر شود.
• تنظیمات "دیگر این پیام را نبینم":— تنظیماتی که به بازدیدکننده اجازه می‌دهد هنگام باز کردن صفحات این منبع، روی دکمه خاصی کلیک کند تا نمایش یک پنجره بازشو در آینده را مسدود کند. فقط یک چک باکس در اینجا موجود است پیوند «دیگر این پیام را نبینم» اضافه کنید، علامتی است که در آن ظاهر یک پیوند با یک لنگر فعال می شود دیگر هرگز این پیغام را نبینید، با کلیک بر روی آن که نمایش بیشتر یک پنجره بازشو به این کاربر در صفحات این منبع را مسدود می کند.

بیایید به بخش تنظیمات برویم شرایط نمایش (اختیاری)مسئول شرایط نمایش یک پنجره پاپ آپ سفارشی است:

در اینجا تعداد قابل توجهی از نکات وجود دارد، اجازه دهید آنها را به ترتیب بررسی کنیم:

• بازدید کننده وارد شده است- نمایش یک پنجره پاپ آپ برای کاربرانی که در سایت احراز هویت شده اند (به شرط در دسترس بودن چنین گزینه ای).
• بازدید کننده وارد نشده است- نمایش یک پنجره پاپ آپ برای کاربرانی که در سایت احراز هویت نشده اند.
• پاپ آپ کمتر از- نمایش یک پنجره پاپ آپ تا زمانی که کاربر آن را چند بار مشاهده کند (تنظیم شده در ستون پاپ آپ را اغلب به این صورت نمایش دهید:);
• فقط در دستگاه های تلفن همراه- نمایش یک پنجره پاپ آپ فقط برای بازدیدکنندگان از دستگاه های تلفن همراه؛
• نه در دستگاه های تلفن همراه- نمایش یک پنجره پاپ آپ فقط برای بازدیدکنندگان از رایانه یا لپ تاپ (نه از دستگاه های تلفن همراه)؛
• از یک ارجاع دهنده خاص- اگر کاربر با استفاده از یک پنجره خاص آمده است، یک پنجره بازشو نمایش دهید ارجاع دهنده
• نه از ارجاع دهنده خاصی- پنهان کردن پنجره پاپ آپ در صورتی که کاربر با استفاده از یک برنامه خاص آمده است ارجاع دهنده(ارجاع دهندگان در اینجا تنظیم شده اند)؛
• نه از لینک داخلی- اگر کاربر از طریق یک پیوند داخلی از صفحه دیگری از همان منبع آمده باشد، پنجره پاپ آپ نمایش داده نخواهد شد.
• از یک موتور جستجو- نمایش یک پنجره پاپ آپ برای بازدیدکنندگانی که از موتورهای جستجو به سایت آمده اند.
• در URL خاص- نمایش یک پنجره پاپ آپ برای بازدیدکنندگان واقع در معین URL URL های کامل;
• نه در URL خاص- نمایش یک پنجره پاپ آپ برای بازدیدکنندگان، به استثنای آنهایی که در برخی موارد وجود دارند URL، که لیست آن در اینجا در ستون مشخص شده است URL های کامل;
• بازدید کننده قبلا نظر داده است- نمایش یک پنجره پاپ آپ برای کاربرانی که در سایت نظر گذاشته اند. این حالت را می توان با شرط ترکیب کرد بازدید کننده وارد شده استیا بازدید کننده وارد نشده است;
• بازدید کننده هرگز نظر نداده است- نمایش یک پنجره پاپ آپ برای کاربرانی که در سایت نظری نگذاشته اند. این حالت را می توان با شرط ترکیب کرد بازدید کننده وارد شده استیا بازدید کننده وارد نشده است.

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

اینها پاداش هایی هستند که با نسخه پولی افزونه مورد نظر ارائه می شود که اتفاقاً با قیمت 19 دلار ارائه می شود.

هنگامی که تمام مراحل لازم برای ایجاد و پیکربندی یک پنجره بازشو را انجام دادید، باید نتیجه را ذخیره کنید (دکمه صرفه جویی) و با استفاده از پیش نمایش (دکمه) ببینید چه اتفاقی افتاده است پیش نمایش پاپ آپ):

اگر نتیجه برای شما مناسب است، می توانید پنجره پاپ آپ (لغزنده وضعیتحرکت به موقعیت فعال).

در نهایت، پس از تمام مراحل بالا، به نتیجه زیر رسیدم:

معلوم شد که بررسی کاملی از این افزونه است. پاپ آپ وردپرس، که به شما امکان می دهد با استفاده از موتور وردپرس پنجره های پاپ آپی برای منابع اینترنتی ایجاد کنید.

پس از مطالعه مقاله، به راحتی می توانید از عملکرد افزونه به نفع خود در وب سایت خود استفاده کنید.

اخیراً، برای یک سایت، از من خواسته شد که یک فرم بازخورد برای وردپرس در یک پنجره مودال ایجاد کنم. یعنی هنگام کلیک بر روی پیوند "نوشتن برای ما" به جای رفتن به صفحه مربوطه، کاربر باید یک پنجره پاپ آپ جدید باز کند که عملکرد ارسال پیام در آن قرار دارد. این یک راه حل تعاملی تر است، اگرچه همه آن را دوست ندارند. من شخصاً اجرای کلاسیک را با صفحه تماس ترجیح می دهم ، اما فرم های موجود در سایت ها متفاوت است - بنابراین در نظر گرفتن راه حل برای این مشکل مفید خواهد بود. در کارم از 2 افزونه استفاده کردم: فرم تماس معروف 7 و ماژول Easy Modal برای ایجاد یک پنجره مودال در وردپرس.

به روز رسانی 1396/05/18: با قضاوت بر اساس آخرین بررسی های موجود در مخزن، در برخی موارد ممکن است مشکلاتی در عملکرد آن وجود داشته باشد. اگر شما نیز تحت تأثیر این موضوع هستید، راه حل جدیدی از توسعه دهندگان به نام Popup Maker را امتحان کنید. می توان جایگزین دیگری را در نظر گرفت.

من به جزئیات در مورد نصب و پیکربندی فرم تماس 7 نمی پردازم. این وبلاگ همچنین مقاله ای در مورد آنچه ممکن است مفید باشد داشت.

بیایید مستقیماً به ماژول Easy Modal برویم. او را خواهید یافت. توسعه دهندگان ادعا می کنند که این بهترین راه حل برای ایجاد پنجره های مدال در یک وب سایت با گزینه های مختلف جالب برای ارائه محتوا است.

بیش از 10 هزار بارگیری، امتیاز 4.6. نسخه های معتبر 3.4 4.0.8 هستند، اگرچه من آن را با موفقیت در WP 4.3.1 اجرا کردم. علیرغم این واقعیت که افزونه اکنون به یک راه حل جدید Popup Maker تبدیل شده است، در وب سایت wordpress.org و هنگام جستجوی افزونه ها در داخل پنل مدیریت، هنوز هم می توانید نسخه معمول Easy Modal 2.0.17 را پیدا کنید. با استفاده از مثال او، در مورد ایجاد یک پنجره بازخورد مودال در وردپرس به شما خواهم گفت.

پس از نصب، بخشی به همین نام ظاهر می شود که در آن چندین مورد وجود دارد. ما به اولین آنها نیاز خواهیم داشت - مدال ها. در آنجا روی دکمه افزودن جدید کلیک کنید.

این عمل یک پنجره مودال جدید برای سایت وردپرس شما ایجاد می کند. تنظیمات عنصر دارای 4 تب خواهد بود:

• پارامترهای عمومی - عمومی
• گزینه های نمایش - گزینه های نمایش.
• بستن گزینه ها - تنظیمات برای بستن پنجره (با استفاده از یک کلیک یا دکمه Esc).
• مثال ها - نمونه هایی از کد برای استفاده.

تنظیمات عمومی شامل نام پنجره (در سایت نمایش داده نمی شود)، عنوان، محتوا و نوع دانلود آن است. در بلوک محتوا، با تغییر به حالت HTML، کد کوتاه فرم بازخورد خود را در پنجره مودال اضافه کنید.

نوع بار 2 گزینه دارد:

• بارگذاری Sitewide (برای کل سایت).
• در هر صفحه/پست (برای پست ها و صفحات خاص).

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

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

تب دوم پارامترهای ماژول است گزینه های نمایش.

در اینجا شما نشان می دهید:

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

نمونه هایی از نمایش خروجی یک پنجره مودال در وردپرس با استفاده از افزونه Easy Modal را می توانید در آخرین تب مشاهده کنید.

شما باید این کد را از طریق یک ویجت در نوار کناری یا در یک ویرایشگر متن وارد کنید. هیچ تفاوتی با کدهای HTML دیگر ندارد، تنها چیزی که وجود دارد این است که کلاس یک پنجره معین خاص (eModal-1) در اینجا نشان داده شده است. برای عنصر دومی که ایجاد کردید، کلاس eModal-2 و غیره خواهد بود. برای اینکه هنگام درج کد اشتباه نکنید، ساده ترین راه این است که آن را از این صفحه کپی کنید.

ویرایش تم یک پنجره مودال

در افزونه Easy Modal علاوه بر تنظیمات یک عنصر خاص، می توانید تم هایی را برای پنجره های پاپ آپ (Theme) تعریف کنید. نسخه رایگان اصلی ماژول تنها یک الگو دارد، اما این بیش از حد کافی است.

این ابزار دارای 6 تب است:

• عمومی - نام موضوع را مشخص کنید.
• پوشش - پس زمینه (در اینجا می توانید رنگ و شفافیت پس زمینه فرم را انتخاب کنید).
• کانتینر - تنظیمات مختلف خود پنجره معین (بالشتک، قاب، سایه)؛
• عنوان - پارامترهای عنوان پنجره بازشو (فونت، سایه).
• محتوا - فونت و رنگ متون در بلوک.
• Close - عنصر بسته شدن فرم (متن و طرح).

همانطور که می بینید، ظاهر را می توان مطابق با نیازهای شما سفارشی کرد. من به این فرم ساده وردپرس در یک پنجره مودال رسیدم:

پس از تنظیم تمام تنظیمات، فراموش نکنید که آنها را ذخیره کنید (دکمه ذخیره را کلیک کنید).

ویدئوی افزودن فرم تماس 7 در پاپ آپ Easy Modal

به هر حال، من یک ویدیو در مورد کار با افزونه Easy Modal پیدا کردم که روند ایجاد یک پنجره بازخورد مودال در وردپرس را نشان می دهد. در آنجا، رابط ماژول کمی قدیمی است (بعضی از تنظیمات متفاوت به نظر می رسند)، اما می توانید ماهیت کلی را دریافت کنید. شاید درک این موضوع با کمک یک ویدیو برای کسی آسانتر باشد.

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

همانطور که در بالا ذکر شد، اکنون افزونه Easy Modal (با قضاوت در صفحه رسمی) به Popup Maker تبدیل شده است. من موفق شدم ماژولی به همین نام را در مخزن پیدا کنم، اما آن را آزمایش نکردم. من در این مورد به شما می گویم تا بدانید اگر Easy Modal در وردپرس در نسخه های بعدی به طور ناگهانی از کار افتاد به دنبال چه چیزی باشید.

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

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

سلام به همه!

پلاگین پاپ آپ وردپرس – پاپ آپ های لایه ای

بنابراین، پس از دانلود آن از لینک انتهای پست و نصب آن در وبلاگ یا سایت وردپرس، چه چیزی به دست می آورید؟

شما این فرصت را خواهید داشت:

ایجاد یک پنجره پاپ آپ؛

از الگوی بازشو از پیش تعیین شده استفاده کنید.

پنجره پاپ آپ خود را ایجاد کنید

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

تنظیمات افزونه پاپ آپ

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

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

اگر متنی مانند: "پیام خود را وارد کنید" می بینید - نگران نباشید، می توانید آن را با هر متن دیگری و به هر زبانی که می خواهید جایگزین کنید.

افزونه بازشو برگه ایمیل

در اینجا قبلاً به شما رسیدگی شده است، اما می توانید متن خود را به دلخواه وارد کنید.

بخش ادغام پلاگین پاپ آپ وردپرس

برای من شخصاً جالب نیست، اما شاید کسی از خدمات شخص ثالث برای ارسال ایمیل استفاده کند.

پنجره های بازشو – کمپین های A/B

در اینجا می‌توانید شرکت‌هایی ایجاد کنید و ردیابی کنید که کدام پنجره بازشو مؤثرتر است.

اگر می بینید که برخی از فرم ها مسدود شده اند، نگران نباشید، می توانید به راحتی آنها را رفع انسداد کنید، اما در بخش دیگری.

من فوراً می گویم که من به خصوص این بخش را آزمایش نکردم.

اگر بر روی دکمه "ایجاد" کلیک کنید، تنظیمات اضافی ظاهر می شود که می توانید مطابق با نیاز خود تنظیم کنید.

من مجله را هم تست نکردم، بنابراین فقط به آن اشاره می کنم و دیگر هیچ چیز..

پلاگین پاپ آپ وردپرس – پاپ آپ های لایه ای عملکردی دارد که به شما امکان می دهد پاپ آپ های اضافی را دانلود و نصب کنید، اما مشکل اینجاست که بدون کد خرید بی فایده است.

همچنین یک بخش با افزونه ها وجود دارد، اما، متأسفانه، آنها نیز هزینه دارند..

من قطعاً ابتدا به بخش تنظیمات نگاه خواهم کرد. صادقانه بگویم، برای تنظیم تمام پارامترهای لازم.

همچنین یک بخش سؤالات متداول - "سوالات متداول" وجود دارد، اما ربطی به افزونه ندارد و کاربر را به صفحه ای با پاسخ به زبان انگلیسی هدایت می کند، بنابراین ترجمه آن امکان پذیر نخواهد بود.

اکنون می‌خواهم چند نمونه از این که چه نوع پنجره‌ی بازشوی وردپرس را می‌توانید بسازید، حتی با استفاده از نمونه‌های پاپ‌آپ تعبیه‌شده در افزونه ارائه کنم: