جلسه 25 : طراحی سایت وردپرس بدون کدنویسی

جلسه 25 : طراحی سایت وردپرس بدون کدنویسی

طراحی سایت وردپرس بدون کدنویسی :

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

ویدیو آموزش طراحی سایت وردپرسی شما بدون کد نویسی :

طراحی سایت با المنتور چگونه است :

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

شروع آموزش طراحی سایت با المنتور :

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

طراحی سایت وردپرس بدون کدنویسی

طراحی سایت وردپرس بدون کدنویسی

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

المنت های کنار یکی را انتخاب کنید :

المنت های کنار یکی را انتخاب کنید

المنت های کنار یکی را انتخاب کنید

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

کانتینر های صفحه ساز :

کانتینر های صفحه ساز

کانتینر های صفحه ساز

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

کانتینر داری سه تب می باشد که دو تب آن در همه المنت های صفحه ساز به صورت مداوم می باشد و تغییر آنچنانی نمی کنند ولی در تنظیمات این المنت فقط بخش طرح بندی افزوده شده است که به صورت زیر می باشد :

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

به فرض مثال اکنون من برای شما ویجت یا ابزارک سربرگ ها معرفی می کنم :

ویجت یا ابزارک سربرگ ها در المنتور

ویجت یا ابزارک سربرگ ها در المنتور

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

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

تغییر رنگ در المنتور :

تغییر رنگ در المنتور

تغییر رنگ در المنتور

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

ریسپانسیو بودن قالب طراحی شده به صورت خودکار :

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

موفق و پیروز باشید.

مهران حسینی راد وب‌سایت
من مهران حسینی راد هستم ! از سال 94 در زمینه طراحی سایت با وردپرس در حال فعالیت هستم و با تیم های محبوب زیاد فعالیت داشته ام تا اینکه تصمیم گرفتم میهن آکادمی راه اندازی کنم و تجربه این 9 سال فعالیتم را با شما به اشتراک بگذارم

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