رفتن به مطلب

ریسپانسیو کردن عکس پستها؟


پست های پیشنهاد شده

سلام

من میخوام زمانیکه در صفحه سینگل مطلب یک عکی میزارم اون عکس ریسپانسیو باشه

الان اینکار رو به صورت دستی انجام میدم

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

class="img-thumbnail"

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

ممنون میشم راهنمایی کنید

لینک به ارسال

سلام

منظورتون از ریسپانسیو چیه؟ و ربطش به این کد چیه؟


class="img-thumbnail"

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

تنها کافی به کلاس مورد نظر استفاده شده در تصاویر عرض ۱۰۰٪ و طول آیتو بدید


img{
width:100%;
height:auto
}

لینک به ارسال

سلام

منظورتون از ریسپانسیو چیه؟ و ربطش به این کد چیه؟


class="img-thumbnail"

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

تنها کافی به کلاس مورد نظر استفاده شده در تصاویر عرض ۱۰۰٪ و طول آیتو بدید


img{
width:100%;
height:auto
}

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

دوست عزیز

این

class="img-thumbnail"

کلاسی هستش که خود سایت

getbootstrap.com

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

مشکل من اینه که من برای اینکار هر سری میرم تو فسمت منابع کد نوشته مورد نظر و به صورت دستی این کلاس رو به عکس اضافه میکنم

حالا میخوام اینکار به صورت اتومات انجام بشه یعنی هر وقت عکس توی پستم گذاشتم خودش ریسپانسیو باشه

لینک به ارسال

الان متوجه منظورتون شدم با جی‌کوئری کلاس بدید


$('body').find('img').each(function (){
if ( !$(this).hasClass("img-thumbnail") ) {
$(this).addClass("img-thumbnail");
}
});

لینک به ارسال

الان متوجه منظورتون شدم با جی‌کوئری کلاس بدید


$('body').find('img').each(function (){
if ( !$(this).hasClass("img-thumbnail") ) {
$(this).addClass("img-thumbnail");
}
});

داداش مرسی ولی من اصلا جکوئری بلد نیستم

میشه بگی دقیقا این کد رو کجا باید بزارم؟

لینک به ارسال

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

از اینجا آخرین نسخه jquery رو دریافت کنید

یک notpade باز کنید و کد گفته شده رو با نام custom.js ذخیره کنید

در نهایت این دو کد زیر رو قبل از بسته شدن body در فایل footer.php قالب‌تون اضافه کنید


<script src='<?php echo get_template_directory_uri(); ?>/js/jquery-1.11.1.js'></script>
<script src='<?php echo get_template_directory_uri(); ?>/js/custom.js'></script>

توجه داشته باشید در صورتی نیاز به فایل اصلی جی‌کوئری دارید که قبلا در قالب‌تون این کد فراخوانی نشده باشه

لینک به ارسال

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

از اینجا آخرین نسخه jquery رو دریافت کنید

یک notpade باز کنید و کد گفته شده رو با نام custom.js ذخیره کنید

در نهایت این دو کد زیر رو قبل از بسته شدن body در فایل footer.php قالب‌تون اضافه کنید


<script src='<?php echo get_template_directory_uri(); ?>/js/jquery-1.11.1.js'></script>
<script src='<?php echo get_template_directory_uri(); ?>/js/custom.js'></script>

توجه داشته باشید در صورتی نیاز به فایل اصلی جی‌کوئری دارید که قبلا در قالب‌تون این کد فراخوانی نشده باشه

داداش خیلی ممنونتم ولی مشکل حل نشد

من دقیقا این کار رو کردم

فوتر رو باز کردم و این رو اضافه کردم

<script src="<?php echo get_template_directory_uri(); ?>/js/custom.js"></script>

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

<script src="<?php bloginfo('template_url'); ?>/js/custom.js"></script>

خلاصه بعدش

custom.js رو ساختم و این کدها رو درونش نوشتم


if ( !$(this).hasClass("img-thumbnail") ) {
$(this).addClass("img-thumbnail");
}
});
$('body').find('img').each(function (){

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

خلاصه اوکی نشد

لینک به ارسال

قالب‌تون کد زیر رو داره؟


<script src='<?php echo get_template_directory_uri(); ?>/js/jquery-1.11.1.js'></script>

کد خیلی ساده هست، چیزه خاصی نداره که بگم مثلا یه طور دیگه‌ای تست کنید؛ البته قبل از این‌که کد رو اینجا قرار بدم خودم تستش کردم و کار هم می‌کرد

در هر صورت اول این‌که مطمئن شید هسته اصلی جی‌کوئری لود شده باشه و کد رو هم به صورت زیر تست کنید


$(document).ready(function() {
$('body').find('img').each(function (){
if ( !$(this).hasClass("img-thumbnail") ) {
$(this).addClass("img-thumbnail");
}
});
});

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...