ایجاد قالب موبایل در وردپرس با افزونه WPtouch

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

• بهینه‌سازی سایت‌ها برای گوشی
• معرفی چند افزونه حرفه‌ای برای ایجاد اسلایدرهای واکنش‌گرا در وردپرس
• آموزش ایجاد مگامنو در وردپرس با افزونه Max Mega Menu

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

• بررسی چند نکته کاربردی برای بهبود تجربه کاربری (UX)

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

افزونه WPtouch

افزونه WPtouch یک افزونه حرفه‌ای و کاربردی برای وردپرس می‌باشد که توسط آن قادر به ایجاد سایت وردپرسی ریسپانسیو خواهید بود. این افزونه در دو نسخه رایگان و تجاری ارائه شده است که در این مقاله قصد داریم نسخه رایگان آن را بررسی کنیم. این افزونه رایگان توانسته است از میان +۲۰۰,۰۰۰ نصب خود امتیاز ۳/۶ از ۵ را به خود اختصاص دهید که نشان از رضایت کاربران و کاربردی بودن این افزونه حرفه‌ای است.

برخی از ویژگی‌های افزونه WPtouch

• کارایی بالای افزونه
• طراحی هوشمند بودن
• عملکرد اتوماتیک و صحیح متناسب با رزلوشن کاربران
• محیط کاربری ساده و آسان
• بهینه سازی سایت برای سیستم عامل انواع موبایل و تبلت
• ارائه نسخه بهینه و سئو برای موبایل
• وجود ۴ قالب متفاوت نسخه موبایل
• وجود ۳ کامپوننت جهت گسترش کارایی
• امکان استفاده از Cache در نسخه موبایل
• پشتیبانی از زبان فارسی
• امکان ارائه قالب یکسان با نسخه‌ی اصلی
• امکان قرار دادن تبلیغات از Google AdSense و AppStores
• امکان تغییر آیکون‌های پیشفرض
• امکان طراحی دستی قالب اختصاصی
• پشتیبانی از API Key و ضد اسپم
• امکان نوشتن در Footer message به صورت دستی و بدون نیاز به کد نویسی

نصب و راه‌اندازی افزونه WPtouch

برای استفاده از این افزونه ابتدا اقدام به نصب و فعال‌سازی افزونه از طریق مخزن وردپرس و یا بخش افزودن افزونه در پیشخوان وردپرس کنید. پس از نصب بخشی در منوی پیشخوان به نام WPtouch ظاهر می‌شود. با استفاده از این بخش می‌توانید استایل قالب موبایل و تنظیمات افزونه را شخصی‌سازی کنید.

General

از طریق این بخش می‌توانید تنظیمات اصلی و تنظیمات مربوط به کارایی افزونه را شخصی‌سازی کنید.

WPtouch site title: در این بخش باید عنوانی را برای سایت خود جهت نمایش در نسخه موبایل بنویسید تا در صورت بازدید کاربران از سایت این عنوان در سایت نمایش داده شود.

Display WPtouch for mobile visitors: با استفاده از این گزینه می‌توانید حالت ریسپانسیو را برای کاربرانی که با موبایل از سایت شما بازدید می‌کنند را فعال کنید.

Landing Pages: با استفاده از این گزینه می‌توانید مشخص کنید کاربرانی که با موبایل از سایت شما بازدید می‌کنند به چه صفحه‌ای منتقل شوند.

Theme switch toggle: با استفاده از این گزینه می‌توانید تعیین کنید تا کاربران بتوانند از دو نسخه موبایل و دسکتاپ برای نمایش قالب سایت استفاده کنند.

Page Zoom: با فعال‌سازی این گزینه امکان زوم بر روی سایت برای کاربران سایت وردپرسی شما فعال می‌شود.

WPtouch Love: با فعال‌سازی این گزینه لینک افزونه در فوتر سایت شما نمایش داده می‌شود تا با اینکار از توسعه‌دهنده افزونه نیز حمایت کرده باشید.

Theme Language: از طریق این بخش می‌توانید زبان مربوط به قالب خود را انتخاب کنید؛ همچنین زبان وبسایت شما را نیز شامل می‌شود که با توجه به آن قالب موبایل راستچین یا چپ‌چین نمایش داده می‌شود.

Devices

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

• مزیت‌های طراحی ریسپانسیو یا واکنش‌گرای یک سایت

iOS (iPod, iPhone): با استفاده از این گزینه در صورت بازدید کاربران با مرورگر گوشی‌های IOS به صورت خودکار به حالت موبایل منتقل می‌شوند.

Android Stock & Chrome Browsers: با استفاده از این گزینه در صورت بازدید کاربران با مرورگر گوشی‌های اندرویدی و گوگل‌کروم به صورت خودکار به حالت موبایل منتقل می‌شوند.

Firefox OS & Mobile Browser: با استفاده از این گزینه در صورت بازدید کاربران با مرورگرهای موزیلا فایرفاکس و مرورگر اصلی گوشی به صورت خودکار به حالت موبایل منتقل می‌شوند.

BlackBerry Browser: با استفاده از این گزینه در صورت بازدید کاربران با مرورگر گوشی‌های BlackBerry به صورت خودکار به حالت موبایل منتقل می‌شوند.

Windows Phone (IE): با استفاده از این گزینه در صورت بازدید کاربران با مرورگر گوشی‌های ویندوزفون به صورت خودکار به حالت موبایل منتقل می‌شوند.

Opera Browser: با استفاده از این گزینه در صورت بازدید کاربران با مرورگر اپرا به صورت خودکار به حالت موبایل منتقل می‌شوند.

Menu Setting

در این بخش تنظیمات مربوط به منوها در دسترس هستند که می‌توانید نوع نمایش آن را مشخص کنید.

Enable parent items as links: با استفاده از این گزینه منو‌های مورد استفاده در سایت شما در قالب خاصی نمایش داده می‌شوند.

Use menu icons: با استفاده از این گزینه آیکن‌ها در کنار متن منوها نمایش داده می‌شوند و با رزلوشن‌های مختلف تغییر سایز می‌دهند.

Show login in menu: با فعال‌سازی این گزینه در سایت لینک ورود به سایت در منو قرار داده می‌شود.

Customize Theme

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

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