نحوه فعال کردن صفحه تصاویر هدر سفارشی در وردپرس 3.0

اگر شما تاکنون فرصتی برای آزمایش وردپرس 3.0 نداشته اید ، دیگر این کار را از دست می دهید. ما پستهای زیادی در مورد عکسهای صفحه وردپرس 3.0 نیز. یکی از به روزرسانی های قابل توجه در این نسخه ، موضوع پیش فرض جدیدی به نام Twenty Ten است. این تم دارای بسیاری از ویژگی های فوق العاده فعال است ، اما یکی از ویژگی هایی که بسیاری از کاربران می خواهند صفحه Headers Panel است. در این مقاله ، ما با شما به اشتراک خواهیم گذاشت که چگونه می توانید هدرهای سفارشی را با یک پنل مدیریت back-end در WordPress 3.0 فعال کنید.

این ویژگی دقیقاً چه کاری انجام خواهد داد؟ h4>

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

Custom Header in WordPress 3.0

پخش صفحه را تماشا کنید h2>

چگونه این را اضافه کنیم؟ h4>

ما کد را مستقیماً از پرونده Twenty Ten’s functions.php برداشتیم. باید کدهای زیر را در پرونده functions.php طرح زمینه خود وارد کنید.

  آرایه (
'url' => '٪ s / images / headers / berries.jpg'،
'thumbnail_url' => '٪ s / images / headers / berries-thumbnail.jpg'،
'description' => __ ('توت' ، 'yourtheme')
) ،
'cherryblossom' => آرایه (
'url' => '٪ s / images / headers / cherryblossoms.jpg'،
'thumbnail_url' => '٪ s / images / headers / cherryblossoms-thumbnail.jpg'،
'description' => __ ('شکوفه های گیلاس' ، 'yourtheme')
) ،
'مقعر' => آرایه (
'url' => '٪ s / images / headers / concave.jpg'،
'thumbnail_url' => '٪ s / images / headers / concave-thumbnail.jpg'،
'description' => __ ('مقعر' ، 'yourtheme')
) ،
'fern' => آرایه (
'url' => '٪ s / images / headers / fern.jpg'،
'thumbnail_url' => '٪ s / images / headers / fern-thumbnail.jpg'،
'description' => __ ('سرخس' ، 'yourtheme')
) ،
'forestfloor' => آرایه (
'url' => '٪ s / images / headers / forestfloor.jpg'،
'thumbnail_url' => '٪ s / images / headers / forestfloor-thumbnail.jpg'،
'description' => __ ('طبقه جنگل' ، 'yourtheme')
) ،
'inkwell' => آرایه (
'url' => '٪ s / images / headers / inkwell.jpg'،
'thumbnail_url' => '٪ s / images / headers / inkwell-thumbnail.jpg'،
'description' => __ ("Inkwell" ، "yourtheme")
) ،
'path' => آرایه (
'url' => '٪ s / images / headers / path.jpg'،
'thumbnail_url' => '٪ s / images / headers / path-thumbnail.jpg'،
'description' => __ ('مسیر' ، 'yourtheme')
) ،
'sunset' => آرایه (
'url' => '٪ s / images / headers / sunset.jpg'،
'thumbnail_url' => '٪ s / images / headers / sunset-thumbnail.jpg'،
'description' => __ ('غروب خورشید' ، 'yourtheme')
)
))
}
endif
if (! function_exists ('yourtheme_admin_header_style')):
/ **
* تصویر سرصفحه نمایش داده شده در صفحه مدیریت Appearance> Header را سبک می کند.
*
* از طریق add_custom_image_header () در yourtheme_setup () ارجاع داده می شود.
*
* @ از 3.0.0
* /
تابع yourtheme_admin_header_style () {
؟>

این برای من آزار دهنده است. لطفاً توضیح دهید h4>

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

توجه: ما از / images / headers / به عنوان دایرکتوری استفاده می کنیم که تصاویر هدر پیش فرض خود را در آن ذخیره می کنید.

  • با ایجاد یک تابع yourtheme_setup () کد را شروع می کنید.
  • در خط 21 ، تصویر پیش فرض هدر را تعریف می کنیم. توجه داشته باشید که یک متغیر٪ s وجود دارد که اساساً یک مکان نگهدارنده برای URI فهرست موضوع است.
  • خط 25 و 26 جایی است که شما عرض و ارتفاع تصویر را تعریف می کنید. به طور پیش فرض روی 940px عرض و 198px ارتفاع تنظیم شده است. با ویرایش آن دو خط می توانید آن را تغییر دهید.
  • از خط 42 شروع به ثبت هدرهای پیش فرض می کنیم. این تصاویری است که به عنوان گزینه دکمه رادیویی در پنل مدیریت شما نشان داده می شود. اگر به گزینه های بیشتری نیاز دارید ، به سادگی قالب مورد استفاده را دنبال کنید.
  • در خط 95 ، ما یک ظاهر طراحی را انتخاب می کنیم. نیازی به تغییر این تنظیمات نیست زیرا قبلاً آنها را در خط 25 و 26 اصلاح کرده اید.

این همان کاری است که شما برای فایل functions.php موضوع انجام می دهید. در مرحله بعدی می خواهیم چگونگی افزودن این موضوع را به موضوع خود بررسی کنیم.

کد برای اضافه کردن در طرح زمینه خود h4>

این کد به احتمال زیاد در پرونده header.php موضوع قرار دارد. می توانید به هر شکلی که دوست دارید آن را سبک کنید.

  ID) و &
(/ * $ src ، $ width ، $ height * / $ image = wp_get_attachment_image_src (get_post_thumbnail_id ($ post-> ID) ، 'post-thumbnail')) &&
$ image [1]> = HEADER_IMAGE_WIDTH):
// ما یک تصویر هدر جدید داریم!
echo get_the_post_thumbnail ($ post-> ID ، 'post-thumbnail') ؛
دیگری:؟>
" width="" height="" alt="">

این کد چه کاری انجام می دهد؟

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

امیدواریم این آموزش مفید واقع شده باشد. چند ایمیل دریافت کردیم که در مورد این آموزش می پرسند ، بنابراین کد را از موضوع Twenty Ten شکستیم. اگر سوالی دارید ، در صورت تمایل می توانید در نظرات آن را بپرسید.

منبع:
https://www.wpbeginner.com/wp-themes/how-to-enable-custom-header-images-panel-in-wordpress-3-0/.

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