افزونه های وردپرس

ساخت منو موبایل در وردپرس با افزونه WP Mobile Menu

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

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

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

ساخت منو موبایل منحصر بفرد و زیبا در وردپرس

افزونه ای که در این آموزش برای ساخت منو موبایل در وب سایت وردپرسی معرفی می کنیم، با عنوان WP Mobile Menu در مخزن وردپرس به ثبت رسیده است.

این افزونه که دارای دو نسخه تجاری و رایگان می باشد، تا کنون با بیش از 50.000 نصب فعال توانسته است امتیاز 4.7 را از کاربران خود به دست بیاورد.

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

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

دانلود افزونه WP Mobile Menu

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

این مطلب را از دست ندهید :
استفاده از شورت کدها در وردپرس با افزونه بی نهایت شورت کد
تنظیمات عمومی افزونه ساخت منو موبایل
تنظیمات عمومی افزونه

همانطور که مشاهده می نمایید، تنظیمات این افزونه شامل 5 تب اصلی می باشد که در ادامه به توضیح هر کدام می پردازیم.

تب General Options

در این تب می توانید تنظیمات عمومی افزونه و منو وب سایت خود را پیکربندی نمایید.

Mobile Menu Display Rules: در این گزینه می توانید تعیین نمایید که با ساخت منو موبایل در وردپرس، این منو در چه نمایشگرهای نمایش داده شود. برای مثال اگر این مقدار را برابر با ۱۰۲۴px قرار دهید، منو موبایل ساخته شده برای صفحه نمایش های پایین تر از رزولوشین ۱۰۲۴px  قابل نمایش خواهد بود.

Enable Left Menu: با فعال کردن این گزینه، منوی چپ در سایت شما فعال می شود.

Enable Right Menu: با فعال سازی این گزینه نیز منوی راست در سایت شما فعال می شود.

Hide Original Menu/header: در این بخش می توانید بخش هایی که تمایل دارید در هنگام ساخت منو موبایل در وردپرس نمایش داده نشوند، وارد کنید. برای مثال کلاس های CSS یا بخش هایی که نمی خواهید نمایش داده شوند.

Menu Display Type: در این گزینه می توانید شیوه باز شدن منوی موبایل را انتخاب کنید.

Menu Items Border Size: در این گزینه نیز اندازه دلخواه خود را برای میزان حاشیه ی اطراف هر گزینه منوی موبایل بر حسب پیکسل، وارد کنید.

Close Icons: با کمک این گزینه می توانید آیکونی دلخواه را برای بستن منوی موبایل انتخاب کنید و در گزینه Close Icon Font Size نیز اندازه دلخواهی را برای آن وارد نمایید.

Submenu Open Menu: با کمک این گزینه می توانید آیکون دلخواه خود را برای باز شدن زیر منوها هنگام ساخت منو موبایل در وردپرس انتخاب کنید.

این مطلب را از دست ندهید :
نحوه ریدایرکت 301 لینکها در وردپرس

Submenu Close Icon: در این گزینه نیز آیکون دلخواه خود را برای بستن زیرمنوها انتخاب نمایید و سپس در گزینه Submenu Icon Font Size اندازه دلخواهی برای آن ها وارد نمایید.

Advanced Options: در نهایت در این بخش نیز می توانید کدهای CSS و یا JavaScript دلخواه خود را برای نمایش منوی موبایل در گزینه های تعیین شده، وارد نمایید.

تنظیمات هدر در ساخت منو موبایل
تنظیمات هدر

تب Header

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

Sticky Header: با فعال کردن این گزینه قابلیت هدر چسبان به منوی موبایل شما اضافه می شود.

Naked Header: با فعال کردن این گزینه پس زمینه هدر شما از بین می رود و به صورت شفاف نمایش داده می شود.

Disable Logo/Text: با فعال کردن این گزینه، لوگو و یا متن مورد نظر شما در هدر نمایش داده نخواهد شد.

Logo options: در این بخش تنظیمات مربوط به لوگو و عنوان سایت شما برای ایجاد و ساخت منو موبایل در وردپرس در دسترس هستند.

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

منوی موبایل راست و چپ
تنظیمات منوی راست و چپ

تب های Left Menu و Right Menu

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

Right Menu: در این گزینه از بین منوهای ساخته شده در بخش نمایش >> فهرست ها، منوی دلخواه خود را برای نمایش در سمت راست انتخاب نمایید.

این مطلب را از دست ندهید :
بک آپ اتوماتیک با backwpup

Parent Link open submenu: با فعال کردن این گزینه، زیرمنو ها با کلیک روی منوی والد باز خواهند شد.

Parent Link open submenu(2nd Level): مانند حالت قبل با فعال کردن این گزینه پس از ساخت منو موبایل در وردپرس، با کلیک روی منوی والد زیر منو ها تا سطح دوم باز خواهند شد.

Menu Icon: در این بخش می توانید آیکون دلخواه خود را برای نمایش در منوی راست یا چپ انتخاب کرده و اندازه، محل قرار گیری، فونت و … آن را شخصی سازی کنید.

Right Panel Options: در این بخش نیز می توانید تنظیمات مربوط به پس زمینه و اندازه منو را پیکربندی کنید. برای مثال در گزینه Panel Background Gradient Css با استفاده از کدزیر می توانید خاصیت گرادیانت را به منوی موبایل خود اضافه نمایید.

background-image: linear-gradient(#e74c3c, #e67e22);
تنظیمات رنگ در ساخت منوی موبایل
تنظیمات رنگ ها

تب Colors

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

پیش نمایش WP Mobile Menu
منو موبایل در وردپرس

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

عاطفه نوربخش

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

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دوره آموزش وردپرس در اصفهانثبت نام رایگان (کد تخفیف : WpNarenji)
+
بستن