در این مطلب از سری مقالات آموزش قالب وودمارت خیلی خلاصه و مستقیم، از معرفی قالب تا مراحل کامل طراحی هدر در قالب وودمارت را توضیح میدهیم تا در کوتاهترین زمان به نتیجه برسید.
هدر ساز قالب وودمارت چیست؟
قالب وودمارت یک قالب فروشگاهی تخصصی برای وردپرس و ووکامرس است که تمرکز آن روی سرعت، تجربه کاربری و امکانات آماده برای فروشگاه اینترنتی است. یکی از مهمترین امکانات قالب وودمارت، بخش اختصاصی ساخت هدر در قالب وودمارت است؛ جایی که دقیقا برای طراحی و مدیریت سربرگ سایت ساخته شده و به شما اجازه میدهد:
-
از هدرهای آماده استفاده کنید یا از صفر هدر بسازید
-
المانهایی مثل لوگو، منو، آیکون حساب کاربری و سبد خرید را فقط با کشیدن و رها کردن جابهجا کنید
-
برای دسکتاپ و موبایل طراحی مناسب و جداگانه داشته باشید
آموزش طراحی هدر در قالب وودمارت
در ادامه به بررسی مراحل ساخت هدر در قالب وودمارت خواهیم پرداخت به طوری هیچ گونه سوالی برای ما نماند:
-
ورود به پیشخوان وردپرس: وارد پنل مدیریت وردپرس شوید و از منوی سمت راست، روی گزینه وودمارت پلاس کلیک کنید. بعد از ورود به وودمارت پلاس، وارد بخش هدرساز / سربرگساز شوید.
-
مشاهده هدر پیشفرض: در صفحه هدرساز، یک هدر به صورت پیشفرض برای شما ساخته شده است. اگر همین ساختار کلی مورد قبولتان است، روی همان هدر کلیک کنید و وارد ویرایش شوید.
-
ایجاد هدر جدید (در صورت نیاز): اگر میخواهید هدر تازهای بسازید، روی گزینه «هدر جدید اضافه کنید» کلیک کنید.
-
انتخاب طرح از کتابخانه نمونهها
بعد از زدن «هدر جدید»، کتابخانهای از نمونه هدرها برای شما باز میشود. در این مرحله باید طرح هدر موردنظر خود را از بین نمونهها انتخاب کنید.
-
انتخاب بین هدر خالی و هدر آماده: اگر هدر خالی را انتخاب کنید، خودتان میتوانید بر اساس نیاز، عناصر مختلف را به سه بخش Top Bar، Main Header و Header Bottom اضافه کنید. اگر یکی از هدرهای آماده را انتخاب کنید، هدر به همراه عناصر پیشفرض آن ساخته میشود و شما فقط لازم است آنها را تنظیم و ویرایش کنید.
-
افزودن عناصر دلخواه به هدر: برای اضافه کردن هر عنصر (مثلاً لوگو، منو، جستجو، سبد خرید و…)، روی آیکون + در بخش موردنظر کلیک کنید تا لیست عناصر قابل استفاده به شما نمایش داده شود.
- انتخاب عنصر از پنجره باز شده: از پنجرهای که باز میشود، عنصر موردنظر خود را انتخاب کنید تا به همان بخش از هدر اضافه شود.
-
جابجایی المانها با روش درگ اند دراپ: پس از اضافه شدن عناصر، میتوانید آنها را با کشیدن و رها کردن (درگ اند دراپ) در تبها و موقعیتهای مختلف جابجا کنید تا به چیدمان دلخواه برسید.
-
تنظیمات هر ردیف (Top Bar، Main Header، Header Bottom): کنار نام هر بخش (Top Bar، Main Header، Header Bottom) یک آیکون چرخدنده وجود دارد.
با کلیک روی آن، وارد تنظیمات آن قسمت میشوید.
در تب عمومی میتوانید موارد زیر را تنظیم کنید:
-
ارتفاع ردیف در دسکتاپ
-
ارتفاع ردیف در موبایل
-
نمایش یا مخفی بودن آن ردیف در دستگاههای مختلف
-
چسبنده بودن یا نبودن ردیف (نمایش ثابت در بالای صفحه هنگام اسکرول)
-
-
فعال کردن هدر طراحیشده (مرحله آخر):در انتها، حتما ستاره کنار هدر موردنظر را فعال کنید تا همان هدر به عنوان هدر اصلی سایت شما شناخته و روی سایت اعمال شود.
در نهایت
برای اینکه هدر شما فقط قشنگ نباشد و واقعا برای فروش و سئو هم مفید باشد، این چند نکته را در نظر بگیرید، اول اینکه هدر را شلوغ نکنید. کاربر باید در چند ثانیه بداند کجا کلیک کند؛ منوی واضح، جستجوی در دسترس و سبد خرید قابل دیدن از همه چیز مهمتر است. دوم اینکه رنگها و فونتهای هدر را با لوگو و کلیت سایت هماهنگ کنید. سوم اینکه حتما بعد از طراحی هدر در قالب وودمارت، به سراغ طراحی فوتر بروید تا ساختار بالا و پایین سایت، یکپارچه و حرفهای باشد.
سوالات متداول
۱. برای طراحی هدر در قالب وودمارت لازم است کدنویسی بلد باشم؟
نه. یکی از مزیتهای اصلی طراحی هدر در قالب وودمارت این است که همه چیز به صورت گرافیکی و بدون کدنویسی انجام میشود. فقط وارد پیشخوان وردپرس میشوید، به بخش تنظیمات هدر میروید و با چند کلیک و درگ اند دراپ، المانها را جابهجا و تنظیم میکنید.
۲. تفاوت هدر خالی و هدر آماده در قالب وودمارت چیست؟
در ساخت هدر در قالب وودمارت اگر هدر خالی را انتخاب کنید، باید خودتان بهصورت دستی عناصر را به Top Bar، Main Header و Header Bottom اضافه کنید و چیدمان را از صفر بسازید. اما در هدر آماده، یک ساختار پیشفرض شامل لوگو، منو، جستجو و… در اختیار شماست و فقط لازم است آن را ویرایش و شخصیسازی کنید.
۳. چرا بعد از طراحی هدر در قالب وودمارت، هدر جدید روی سایت نمایش داده نمیشود؟
اگر هدر را طراحی کردهاید ولی در سایت نمیبینید، معمولا دو دلیل دارد: یا هدر را ذخیره نکردهاید، یا در صفحه لیست هدرها، ستاره کنار هدر موردنظر را فعال نکردهاید. برای فعال شدن نهایی، حتما بعد از اتمام طراحی، ستاره هدر را روشن کنید تا به عنوان هدر اصلی سایت انتخاب شود. گاهی هم نیاز است کش قالب یا افزونه کش را خالی کنید.
۴. چطور میتوانم نسخه موبایل هدر را در قالب وودمارت تنظیم و بهینه کنم؟
در هنگام طراحی هدر در قالب وودمارت، از بخش پیشنمایش، حالت موبایل را انتخاب کنید. سپس ارتفاع ردیفها را برای موبایل تنظیم کنید، در صورت نیاز برخی المانهای اضافی را مخفی کنید و مطمئن شوید منو، جستجو و سبد خرید بهراحتی قابل لمس هستند. تمام این تنظیمات از همان بخش تنظیمات عمومی و استایل برای هر ردیف (Top Bar، Main Header، Header Bottom) در دسترس است.
۵. آیا طراحی هدر در قالب وودمارت روی سئو سایت هم تأثیر دارد؟
بهصورت غیرمستقیم بله. وقتی ساخت هدر در قالب وودمارت اصولی انجام شود و کاربر سریع به منو، جستجو و سبد خرید دسترسی پیدا کند، تجربه کاربری بهتر میشود، نرخ پرش کاهش پیدا میکند و کاربر زمان بیشتری در سایت میماند. همه اینها سیگنالهای مثبتی برای موتورهای جستجو هستند و میتوانند به بهبود سئو کمک کنند.
نظری برای این وجود ندارد.