وب درسی

آموزش افزودن تصویر شاخص به پوسته وردپرس | وب درسی

ضمانت بازگشت
فایل های تست شده
پرداخت آنلاین
تضمین کیفیت
دانلود فوری

سورس تاکسی انلاینجهت سفارش تبلیغات ثابت تماس بگیرید

سورس تاکسی انلاین

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

thumbnail-hamyarwp

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

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

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

 

1
add_theme_support( ‘post-thumbnails’ );

البته همونطور که میدونین کد بالا یک کد php هست و حتما باید بین دو تگ

1
<?php     ?>

قرار بگیره وگرنه عمل نمیکنه.

با اضافه شدن این کد به فایل function.php قالبتون،در قسمت ارسال نوشته شما(معمولا در زیر قسمت برچسب ها) یک فیلد جدید ایجاد میشه که از طریق اون میتونید برای مطلبتون تصویر شاخص یا بند انگشتی (thumbnail) قرار بدین.

 

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

خب حالا قالب شما از تصویر شاخص پشتیبانی میکنه  به همین راحتی

ولی حالا مسئله اینجاست که چطوری میشه این تصویر شاخصی که برای مطالب انتخاب شده رو درون قالب استفاده کرد؟

برای قرار دادن تصویر شاخص درون پوسته باید از کد زیر استفاده کنیم

 

1
<?php the_post_thumbnail(); ?>

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

البته باید دقت کنیم که نمایش تصویر شاخص باید درون حلقه مطالب وردپرس باشه.

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

نمایش تصویر شاخص در صورت وجود

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

 

1
2
3
4
5
<? if ( has_post_thumbnail() ) { ?>
<? the_post_thumbnail(); ?>
<? } else { ?>
<img src=“linke-ax-pishfarz”>
<? } ?>

به جای linke-ax-pishfarz میتونید لینک تصویری که میخواین به عنوان تصویر شاخص پیشفرض قرار داده بشه رو بذارین.

با این کد ما داریم تعیین میکنیم که

اگر مطلب مورد نظر تصویر شاخص (thumbnail) داشت => تصویر شاخص نمایش داده بشه.

اما اگر مطلب مورد نظر تصویر شاخص نداشت => تصویر پیشفرضی که لینکش رو دادیم نمایش داده بشه.

تعیین سایز تصویر شاخص

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

۱- تغییر سایز تصویر شاخص به سایز مورد نظر

 

1
set_post_thumbnail_size( 50, 50 );

در این صورت سایز تصویر شاخصی که برای مطالب قرار میدیم به صورت یک عکس ۵۰ در ۵۰ در میاد(۵۰ اولی عرض تصویر و ۵۰ دومی ارتفاع تصویر رو تعیین میکنه)

برای تغییر سایز مورد نظرتون کافیه که اعداد بالا رو تغییر بدین.

۲- تغییر سایز تصویر شاخص با برش

 

1
2
3
set_post_thumbnail_size( 50, 50, true ); // عکس با نسبت 50 در 50 بریده میشه
set_post_thumbnail_size( 50, 50, array( ‘top’, ‘left’)  ); // عکس با نسبت 50 در 50 از گوشه بالا سمت چپ بریده میشه
set_post_thumbnail_size( 50, 50, array( ‘center’, ‘center’)  ); // عکس با نسبت 50 در 50 از وسط بریده میشه

به همین صورت در مورد دوم میتونید از right و bottom برای راست و پایین هم استفاده کنید.

استایل دهی به تصویر شاخص در قالب

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

 

1
.wp-post-image

مثلا برای افزودن حاشیه (border) به تصویر شاخص کافیه کد زیر رو درون فایل style.css قالب قرار بدیم:

 

1
2
3
.wp-post-image{
border:1px solid #000;
}

امیدوارم که مفید بوده باشه…

دو زبانه زیر، محتوای زیر را تغییر می دهد.
محمد رضا
سلام من رضا هستم 22 سالمه و از 17 سالگی علاقه ی شدیدی به برنامه نویسی و وردپرس دارم و دوست دارم همیشه تو این زمینه بروز باشم این وب رو هم برای انتشار مطالبی که باعث پیشرفت خودم شدن ایجاد کردم
به این مطلب امتیاز دهید.
5 / 0
[ 0 رای ]
بازدید : 13 views بار دسته بندی : اموزش وردپرس تاريخ : 2 آبان 1395 به اشتراک بگذارید :
دیدگاه کاربران
    • دیدگاه ارسال شده توسط شما ، پس از تایید توسط مدیران سایت منتشر خواهد شد.
    • دیدگاهی که به غیر از زبان فارسی یا غیر مرتبط با مطلب باشد منتشر نخواهد شد.