در طراحی سایت با قالب وودمارت یکی از مواردی که طراحان سایت با آن مواجه میشوند، نمایش عنوان صفحه یا برگه در بالای صفحه است. در بسیاری از مواقع این عنوان پیشفرض موجب بههم ریختگی طراحی، اختلال در تجربه کاربری یا تضاد با طرح های سفارشی میشود. به همین دلیل یادگیری روشهای حذف عنوان برگه در قالب وودمارت یکی از موارد ضروری برای طراحی صفحات حرفهای است.
در این مقاله از سری مقالات آموزش ترفندهای وودمارت به شما نشان میدهیم چگونه بهصورت صحیح و حرفهای عنوان برگه را در قالب وودمارت حذف کنید بدون اینکه طراحی سایت شما خراب شود یا سئو صفحه آسیب ببیند.
عنوان صفحه چیست و چرا بعضی وقتها باید حذفش کنیم؟
عنوان برگه در وردپرس معمولاً همان متنی است که در قسمت نام برگه وارد میکنید. این عنوان در قالبهای وردپرس، از جمله وودمارت به عنولن محبوب ترین قالب چندفروشندگی، بهطور پیشفرض در بالای صفحه نمایش داده میشود. اما گاهی لازم است این عنوان نمایش داده نشود؛ مثل زمانی که:
- از صفحههای طراحیشده با المنتور استفاده میکنید و در بخش هِدر یا بنر عنوان دیگری جایگزین کردهاید.
- صفحه شامل لندینگ فروش یا تبلیغ محصول است که نمایش عنوان پیشفرض باعث حواسپرتی کاربر میشود.
- ساختار طراحی سایت شما مینیمال باشد و نمایش عنوان بههمریختگی بصری ایجاد کند.
در این شرایط حذف عنوان برگه در قالب وودمارت میتواند ظاهر صفحه را تمیز، حرفهای و مطابق با استانداردهای طراحی کند.
آموزش حذف عنوان برگه در قالب وودمارت
در ابتدا برای شروع و حذف عنوان برگه در وودمارت به عنوان بهترین قالب ووکامرس برای فروشگاه آنلاین، ابتدا از بخش تنظیمات قالب وارد قسمت عنوان برگه شوید.
سپس در قسمت طراحی عنوان برگه میتوانید آن را غیرفعال و یا به دلخواه خود تغییر دهید؛ همچنین در این بخش میتوانید اندازه عنوان برگه، پس زمینه صفحات و رنگ متن برای عنوان برگه را به دلخواه خود سفارش سازی کنید.
همچنین در بخش بعدی یعنی بخش سئو، میتوانید عنوان تگ، نمایش نوار آدرس، نوار آدرس یواست سئو برای فروشگاه و همینطور نوار آدرس یواست برای برگهها را به دلخواه خود سفارش سازی کنید.
حذف عنوان برگه در قالب وودمارت با CSS
اگر در تنظیمات صفحه چنین گزینهای وجود ندارد یا میخواهید عنوان تمام صفحات را حذف کنید، میتوانید از CSS سفارشی استفاده کنید. CSS این امکان را میدهد که عنوان بهصورت ظاهری حذف شود، بدون اینکه ساختار دادهای صفحه را تغییر دهید.
برای این کار:
- به نمایش > سفارشیسازی بروید.
- بخش CSS اضافی را باز کنید.
- کد زیر را اضافه نمایید:
.page-title {
display: none !important;
}
با این کد عنوان برگه در تمامی صفحات مخفی میشود.
اگر میخواهید عنوان فقط در صفحات خاص مانند صفحه فروشگاه یا صفحات طراحیشده با المنتور حذف شود، میتوان از کلاسهای خاص صفحه استفاده کرد تا CSS فقط در آن صفحات اعمال شود.
حذف عنوان در صفحات فروش ووکامرس با وودمارت
در فروشگاههایی که با ووکامرس ساخته شدهاند، صفحات فروشگاه اصلی، آرشیو محصولات و حتی صفحات تکی محصول نیز عنوان دارند. اگر قصد دارید عنوان این صفحات را حذف کنید، روش کار بسیار شبیه به برگههاست. در صورتی که قالب شما امکان غیرفعال کردن عنوان صفحه فروشگاه را از تنظیمات قالب داشته باشد، آن را خاموش کنید. در غیر این صورت کافی است CSS زیر را در بخش CSS سفارشی قرار دهید:
.woocommerce-page .page-title {
display: none !important;
}
این کد فقط عنوان صفحات فروش ووکامرس را مخفی میکند و عنوان سایر صفحات بدون تغییر باقی میماند.
جمع بندی
حذف عنوان برگه در قالب وودمارت یکی از کارهای رایج در طراحی صفحات حرفهای وردپرس است. اگر این کار به درستی انجام شود، نهتنها ظاهر سایت بهبود مییابد، بلکه از لحاظ سئو نیز مشکلی به وجود نمی آید.
اصل ماجرا این است که حذف عنوان قالب بهتنهایی تاثیری در رتبه صفحه ندارد، اما باید مطمئن شوید که صفحه دارای یک عنوان H1 مناسب و مرتبط باشد تا موتورهای جستجو بتوانند هدف و محتوای صفحه را بهدرستی درک کنند.
همه دیدگاه ها
3 دیدگاه ثبت شدهسلام، ممنون از مطلب کاربردیتون. من همیشه با نمایش عنوان برگه در صفحاتی که با المنتور میساختم مشکل داشتم و مجبور میشدم با کدهای پیچیده مخفیش کنم. روشی که با تنظیمات قالب گفتید خیلی سادهتر و اصولیتر بود. واقعاً آموزشهای وودمارت شما عالی و دقیق هستند.
سلام کاربر عزیز، خوشحالیم که این آموزش برای شما مفید واقع شده است. دقیقا همینطور است که فرمودید؛ استفاده از تنظیمات داخلی قالب همیشه اولویت دارد تا ساختار سایت تمیزتر بماند. اگر در پیادهسازی تنظیمات یا شخصیسازیهای دیگر قالب وودمارت سوالی داشتید، حتماً در بخش کامنتها مطرح کنید تا راهنماییتان کنیم.
واقعاً ممنون بابت این آموزش کاربردی. من همیشه با این عنوانهای پیشفرض در وودمارت مشکل داشتم و نمیدونستم چطور باید حذفشون کنم بدون اینکه به سئو سایت لطمه بخوره. روش CSS که توضیح دادید خیلی سریع و ساده بود. خسته نباشید.
سلام و درود، خوشحالیم که این مقاله برای شما مفید بوده است. بله، استفاده از روشهای استاندارد باعث میشود هم ظاهر سایت شما حرفهایتر شود و هم به ساختار سئوی صفحات آسیبی وارد نشود. اگر در پیادهسازی این کدها سوال یا ابهام دیگری داشتید، در خدمت شما هستیم.
سلام، ممنون بابت آموزش خوبتون. من همیشه برای طراحی صفحات با المنتور با نمایش عنوان پیشفرض مشکل داشتم و مجبور بودم دستی حذفش کنم. این روش تنظیمات قالب خیلی تمیزتره و باعث میشه طراحی سایت خیلی حرفهایتر به نظر برسه. مرسی از اشتراکگذاری این ترفند کاربردی.
سلام وقت بخیر، خوشحالیم که این آموزش برای شما مفید واقع شده است. دقیقا همینطور است که فرمودید؛ استفاده از تنظیمات داخلی قالب وودمارت برای این کار، استانداردهای طراحی را بهتر رعایت میکند و به مدیریت بهینه کدهای سایت نیز کمک میکند. موفق باشید.