SHET22

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

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

اگه می‌خواید صفحه اصلی، صفحه تماس، نوشته‌ها یا دسته‌های سایتتون هرکدوم تصویر سربرگ مخصوص خودشون رو داشته باشن، اول باید بدونید قالبتون بلوکیه یا کلاسیک. در قالب‌های بلوکی می‌تونید بدون افزونه چند هدر بسازید و هرکدوم رو به قالب دلخواهتون اختصاص بدید. برای قالب‌های کلاسیک هم تنظیمات خود قالب یا افزونه Unique Headers به کارتون میاد.

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

آنچه در این مقاله می‌خوانید

قبل از شروع؛ قالب سایتتون کلاسیکه یا بلوکی؟

قالب بلوکی بخش‌هایی مثل هدر، فوتر و قالب نوشته رو با بلوک‌های وردپرس می‌سازه. برای اینکه نوع قالبتون رو تشخیص بدید، وارد پیشخوان بشید و منوی «نمایش» رو باز کنید:

منوی نمایش در پیشخوان وردپرس که گزینه ویرایشگر قالب بلوکی رو نشون می‌ده
منوی نمایش در پیشخوان وردپرس که گزینه ویرایشگر قالب بلوکی رو نشون می‌ده
  • اگه گزینه «ویرایشگر» رو می‌بینید، به احتمال زیاد قالبتون بلوکیه.
  • اگه گزینه «سفارشی‌سازی» رو می‌بینید ولی گزینه «ویرایشگر» ندارید، معمولاً قالبتون کلاسیکه.
  • اگه از صفحه‌سازی مثل المنتور یا سیستم اختصاصی قالبتون استفاده می‌کنید، ممکنه مدیریت هدر داخل همون ابزار باشه.

اگه هنوز تفاوت این دو نوع قالب براتون روشن نیست، راهنمای قالب وردپرس چیست کمکتون می‌کنه. قبل از دست‌کاری هدر هم حتماً از سایتتون نسخه پشتیبان بگیرید؛ چون تغییر اشتباه در قالب یا بخش‌های الگو ممکنه ظاهر چند صفحه رو با هم عوض کنه.

روش اول: افزودن تصویر هدر متفاوت در قالب‌های بلوکی

قالب‌های بلوکی از ویرایشگر سایت وردپرس استفاده می‌کنن. هدر در این قالب‌ها یک «بخش الگو» یا Template Part هست؛ یعنی بخشی که یک‌بار می‌سازید و می‌تونید اون رو در چند قالب مختلف به کار ببرید.

ساخت هدرهای جدا در ویرایشگر سایت

  1. از پیشخوان وردپرس وارد «نمایش > ویرایشگر» بشید.
  2. بخش «طراحی» و بعد «الگوها» رو باز کنید. ممکنه ترجمه نام گزینه‌ها در نسخه‌های مختلف وردپرس یا بسته ترجمه قالبتون کمی فرق کنه.
  3. بخش مدیریت «بخش‌های الگو» رو پیدا کنید و یک هدر تازه بسازید. اسم مشخصی مثل «هدر صفحه تماس» براش بذارید تا بعداً اون رو با هدرهای دیگه اشتباه نگیرید.
  4. اگه فقط یک عکس ساده می‌خواید، بلوک «تصویر» رو اضافه کنید. برای گذاشتن نوشته یا دکمه روی عکس، از بلوک «پوشش» کمک بگیرید.
  5. چیدمان، ارتفاع و فاصله‌های هدر رو تنظیم کنید و دکمه «ذخیره» رو بزنید.
بخش مدیریت هدرها در قسمت الگوهای ویرایشگر سایت وردپرس
بخش مدیریت هدرها در قسمت الگوهای ویرایشگر سایت وردپرس

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

بلوک پوشش و تنظیمات تصویر پس‌زمینه هدر در ویرایشگر سایت
بلوک پوشش و تنظیمات تصویر پس‌زمینه هدر در ویرایشگر سایت

نمایش هر هدر در صفحه موردنظر

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

  1. در ویرایشگر سایت وارد بخش «قالب‌ها» بشید و اگه گزینه ساخت قالب تازه رو می‌بینید، اون رو انتخاب کنید.
  2. اگه وردپرس امکان انتخاب یک برگه مشخص رو بهتون می‌ده، همون برگه رو انتخاب کنید. اگه این گزینه رو ندارید، یک قالب سفارشی بسازید.
  3. هدر پیش‌فرض رو انتخاب و حذف کنید، بعد بخش الگوی هدر جدید رو جای اون بذارید.
  4. قالب رو ذخیره کنید. اگه یک قالب سفارشی عمومی ساختید، برگه موردنظرتون رو باز کنید و از تنظیمات برگه، نام همون قالب رو انتخاب کنید.
  5. صفحه رو در یک پنجره تازه باز کنید و ظاهر هدر رو هم در موبایل و هم در دسکتاپ ببینید.
قالب برگه در ویرایشگر سایت و محل جایگزین کردن بخش الگوی هدر
قالب برگه در ویرایشگر سایت و محل جایگزین کردن بخش الگوی هدر

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

تنظیم هدر متفاوت برای چند گروه از صفحات

قرار نیست برای تک‌تک صفحه‌ها هدر جدا بسازید. اگه چند صفحه ظاهر مشابهی دارن، یک هدر و یک قالب مشترک براشون کافیه. مثلاً می‌تونید چنین ساختاری داشته باشید:

  • یک هدر برای برگه‌های ثابت مثل درباره ما و تماس با ما
  • یک هدر برای همه نوشته‌های وبلاگ
  • یک هدر برای صفحه دسته‌ها، برچسب‌ها و بقیه بایگانی‌ها

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

روش دوم: افزودن تصویر هدر متفاوت در قالب‌های کلاسیک

در قالب کلاسیک، اول باید مطمئن بشید که قالبتون از قابلیت داخلی «سربرگ سفارشی» وردپرس پشتیبانی می‌کنه. افزونه Unique Headers فقط وقتی نتیجه می‌ده که قالب، تصویر هدر رو با همین قابلیت داخلی نمایش بده.

بررسی پشتیبانی قالب از سربرگ سفارشی

از پیشخوان وارد «نمایش > سفارشی‌سازی» بشید و دنبال گزینه‌هایی مثل «تصویر سربرگ»، «رسانه سربرگ» یا Header Image بگردید. اگه این گزینه رو می‌بینید و با انتخاب عکس، هدر سایت تغییر می‌کنه، احتمال زیادی هست که افزونه با قالبتون سازگار باشه.

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

نصب و فعال‌سازی افزونه Unique Headers

Unique Headers برای انتخاب تصویر سربرگ جدا در نوشته‌ها، برگه‌ها و بعضی صفحه‌های بایگانی ساخته شده. چون وضعیت انتشار، سازگاری و آخرین به‌روزرسانی افزونه‌ها ممکنه عوض بشه، قبل از نصب حتماً صفحه رسمی افزونه رو ببینید و سازگاری اون با نسخه وردپرس و قالبتون رو بررسی کنید. برای نصب افزونه این مراحل رو انجام بدید:

  1. وارد «افزونه‌ها > افزودن افزونه تازه» بشید.
  2. عبارت «Unique Headers» رو در کادر جست‌وجو بنویسید.
  3. نام و سازنده افزونه رو با صفحه رسمی اون تطبیق بدید، بعد روی گزینه نصب و بعد فعال‌سازی کلیک کنید.
نصب و فعال‌سازی افزونه Unique Headers
نصب و فعال‌سازی افزونه Unique Headers

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

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

انتخاب تصویر هدر برای هر نوشته یا برگه

  1. از منوی «نوشته‌ها» یا «برگه‌ها»، محتوای موردنظرتون رو برای ویرایش باز کنید.
  2. در صفحه ویرایش دنبال بخشی با نام Custom Header بگردید. این عبارت یعنی «سربرگ سفارشی». جای این کادر به نوع ویرایشگر و چیدمان صفحه بستگی داره و ممکنه پایین ویرایشگر باشه، نه داخل نوار کناری.
  3. گزینه انتخاب تصویر هدر رو بزنید و عکس رو از کتابخانه رسانه بردارید یا یک عکس تازه بارگذاری کنید.
  4. نوشته یا برگه رو به‌روزرسانی کنید و نتیجه رو در صفحه نهایی ببینید.

اگه باکس Custom Header رو پیدا نمی‌کنید، تنظیمات پنل کناری و بخش ترجیحات ویرایشگر رو هم ببینید. گاهی این پنل‌ها مخفی می‌شن.

انتخاب تصویر هدر برای دسته‌ها و برچسب‌ها

  1. برای دسته‌ها وارد «نوشته‌ها > دسته‌ها» و برای برچسب‌ها وارد «نوشته‌ها > برچسب‌ها» بشید.
  2. دسته یا برچسب موردنظرتون رو ویرایش کنید.
  3. اگه بخش مربوط به تصویر سربرگ رو می‌بینید، عکس دلخواهتون رو انتخاب کنید.
  4. تغییرات رو ذخیره کنید و صفحه بایگانی همون دسته یا برچسب رو باز کنید.
تنظیم تصویر سربرگ اختصاصی در صفحه افزودن دسته وردپرس
تنظیم تصویر سربرگ اختصاصی در صفحه افزودن دسته وردپرس

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

نمایش تصادفی تصاویر هدر در قالب‌های کلاسیک

بررسی پشتیبانی قالب از سربرگ تصادفی

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

افزودن چند تصویر و فعال کردن نمایش تصادفی

  1. وارد «نمایش > سفارشی‌سازی» بشید.
  2. بخش «تصویر سربرگ» یا «رسانه سربرگ» رو باز کنید.
  3. چند تصویر با اندازه و نسبت یکسان اضافه کنید.
  4. اگه گزینه‌ای شبیه «نمایش تصادفی سربرگ‌های بارگذاری‌شده» رو می‌بینید، اون رو فعال کنید و تغییرات رو ذخیره کنید.

تفاوت هدر تصادفی با هدر اختصاصی هر صفحه

در هدر تصادفی، عکس بر اساس شانس تغییر می‌کنه و به صفحه مشخصی تعلق نداره. در هدر اختصاصی، خودتون تعیین می‌کنید هر نوشته، برگه یا بایگانی دقیقاً چه تصویری داشته باشه. اگه می‌خواید عکس هدر با موضوع هر صفحه هماهنگ باشه، هدر اختصاصی انتخاب بهتریه.

تنظیم درست اندازه و ظاهر تصویر هدر

  • ابعاد هماهنگ با قالب انتخاب کنید: برای همه عکس‌ها یک اندازه ثابت و مناسب در نظر بگیرید. اگه قالبتون اندازه پیشنهادی نشون می‌ده، همون اندازه نقطه شروع خوبیه.
  • فضای برش رو در نظر بگیرید: بخش مهم عکس رو نزدیک مرکز بذارید تا در موبایل از کادر بیرون نره. بهتره نوشته مهم رو داخل خود تصویر نذارید؛ چون ممکنه در نمایشگرهای کوچک بریده یا ناخوانا بشه.
  • حجم فایل رو کم کنید: پیش از بارگذاری، عکس رو با اندازه‌ای که واقعاً لازم دارید خروجی بگیرید و فشرده کنید. فایل‌های بزرگ سرعت بارگذاری بالای صفحه رو پایین میارن.
  • متن جایگزین مناسبی بنویسید: متن جایگزین یا Alt، توضیح کوتاهی درباره محتوای مفید عکسه. اگه تصویر فقط برای تزئین استفاده شده و اطلاعاتی منتقل نمی‌کنه، خالی گذاشتن متن جایگزین می‌تونه انتخاب بهتری باشه.

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

رفع مشکلات رایج تصویر هدر

تصویر انتخاب‌شده نمایش داده نمی‌شه

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

گزینه Custom Header دیده نمی‌شه

مطمئن بشید افزونه فعاله و صفحه ویرایش یک نوشته یا برگه رو باز کردید. تنظیمات نمایش پنل‌ها رو هم بررسی کنید. اگه باز هم این گزینه رو نمی‌بینید، احتمالاً نوع محتوا یا قالبتون با قابلیت افزونه سازگار نیست.

تصویر در موبایل بریده یا کشیده می‌شه

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

یک هدر روی همه صفحه‌ها دیده می‌شه

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

تغییرات هدر بعد از ذخیره نمایش داده نمی‌شن

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

کدوم روش برای سایت شما بهتره؟

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

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

سؤال‌های رایج درباره تصویر هدر متفاوت در وردپرس

آیا بدون افزونه هم می‌شه برای هر صفحه هدر متفاوت ساخت؟

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

آیا Unique Headers با همه قالب‌ها کار می‌کنه؟

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

چطور برای نوشته‌ها و برگه‌ها هدر جدا بسازیم؟

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

چطور تصویر هدر رو فقط در یک صفحه تغییر بدیم؟

یک قالب یا هدر جدا بسازید و اون رو فقط به همون برگه اختصاص بدید. در قالب کلاسیک سازگار هم تصویر اختصاصی رو از تنظیمات Custom Header همون برگه انتخاب کنید. هدر اصلی و مشترک رو ویرایش نکنید.

بهترین اندازه برای تصویر هدر چقدره؟

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

جمع‌بندی

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

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

نظر شما در این مورد چیه؟

    پشتیبانپشتیبانپشتیبانپشتیبانپشتیبان
    تیم میهن وردپرس
    پشتیبانپشتیبانپشتیبانپشتیبانپشتیبان
    تیم میهن وردپرسآنلاین و پاسخگوی شما هستیم.آنلاین

    در حال بارگذاری...

    هر سوالی دارید بپرسید.پاسخگوی شما هستیم.