کیوان صفری
کیوان صفری
خواندن ۴ دقیقه·۱ سال پیش

ساخت برگه اصلی با ویژوال کامپوزر

ویرایشگر کلاسیک فقط برای ویرایش صفحات به کار می‌رود و المان‌های محدودی دارد که اگر بخواهید یک صفحه را از ابتدا و به دلخواه طراحی کنید با این ویرایشگر امکان پذیر نیست. اما صفحه‌سازها برای ساخت و طراحی صفحات حرفه‌ای انتخاب مناسبی هستند. از آنجایی که صفحه اصلی در جذب کاربران تاثیر بالایی دارند و بیش از 30%کاربران با مشاهده یک صفحه که کاربرپسند نیست آن را ترک می‌کنند طراحی جذاب صفحه اصلی اهمیت پیدا می‌کند.

در این مقاله نحوه طراحی صفحه اصلی را با ویژوال کامپوزر توضیح می‌دهیم. ابتدا ساخت هدر و سپس بقیه المان‌های صفحه را توضیح می‌دهیم.

چرا طراحی صفحه اصلی به صورت حرفه‌ای اهمیت دارد؟

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

ساخت برگه صفحه اصلی با افزونه ویژوال کامپوزر

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

طراحی بخش های مختلف صفحه اصلی با المان‌های افزونه ویژوال کامپوزر

شما باید طرح صفحه اصلی خود را بدانید و اینکه می خواهید عناصر چگونه چیده شوند؟ اگر از ظاهر یک سایت خوشتان آمده است و حالا می خواهید عناصر صفحه اصلی را بر اساس آن بسازید با ویژوال کامپوزر شدنی است. طراحی صفحات با ویژوال کامپوزر را می توان از طریق ویرایشگرهای Back-end و Front-end این افزونه انجام داد. در این آموزش ساخت صفحه اصلی را از طریق back-end اعمال می کنیم. در ادامه نحوه ایجاد عناصر مختلف صفحه اصلی با این صفحه ساز را به شما آموزش می دهیم.

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

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

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

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

المان های ویژوال کام\وزر برای طراحی صفحه اصلی سایت
المان های ویژوال کام\وزر برای طراحی صفحه اصلی سایت

منوی سایت

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

بخش خدمات صفحه اصلی

بعد از ایجاد هدر و منو نوبت به المان‌های دیگر می‌رسد. برای معرفی خدمات شرکت از آیکن باکس یا آیکن و بلوک متنی استفاده کنید. به این منظور یک ردیف ایجاد کرده و 4 ستون به آن اضافه کنید. تظیمات آیکن و بلوک متنی یعنی استایل و رنگ آنها را می‌توانید تغییر دهید.

تنظیم صفحه طراحی شده به عنوان صفحه اصلی

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

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

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

https://www.rtl-theme.com/category/wordpress-plugin/

نشانی: شهرکرد، خیابان کاشانی، کوچه 85

تلفن: 03833234567

پست الکترونیک: info@rtl-theme.com

افزونه ویژوال کامپوزرافزونه وردپرسوردپرسطراحی سایت وردپرسویژوال کامپوزر
شاید از این پست‌ها خوشتان بیاید