آموزش طراحی منو کاربری در سربرگ با استفاده از المنتور

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

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

پیش نیاز ها

همچنین برای اجرای این آموزش به افزونه های زیر نیاز داریم:

• افزونه المنتور پرو
• افزونه Element Pack
• افزونه Elementor Extras

طراحی منو کاربری در سربرگ

ویرایش سربرگ طراحی شده با المنتور

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

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

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

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

طراحی محتوای داخلی منو کاربری

ایجاد قالب جدید

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

طراحی محتوای داخلی

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

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

قرار دادن محتوای منو در سربرگ

حالا باید به سربرگ خود بازگردید و این الگو را به ویجت دراپ بار اختصاص دهید.

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

سفارشی سازی دکمه منو

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

سپس از بین لیست، گزینه اطلاعات کاربر را انتخاب کنید.

روی آیکون آچار کلیک کرده تا منو تنظیمات باز شود، در ادامه روی گزینه نام نمایش کلیک کنید.

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

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

صحبت نهایی + دانلود فایل های اجرایی

در نهایت با انجام مراحل بالا، منوی کاربر به شکل زیر نمایش داده خواهد شد.

در ادامه می توانید فایل قالب محتوای منو کاربری را از طریق لینک زیر دانلود کنید.

دانلود فایل اجرایی

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