آموزش غیرفعال کردن افکت لایت باکس برای پست های شورتکد وردپرس

این آموزش به شما نشون میده چطور افکت لایت باکس رو برای پستهای بارگذاری شده از طریق شورتکدها در قالب های وردپرس غیرفعال کنین.

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

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

[posts_grid type="team" columns="5" rows="1" order_by="date" order="DESC" thumb_width="205"

1

[posts_grid type="team" columns="5" rows="1" order_by="date" order="DESC" thumb_width="205"

در این شورتکد باید custom_class=”profiles” رو پیدا کنین. شما از value کلاس سفارشی در اسکریپت جدید استفاده خواهید کرد:

توجه: اگر ویژگی کلاس سفارشی (custom class attribute) رو در شورتکد ندارین، اون رو با هر value اضافه کنین. فراموش نکنین برای ذخیره تغییرات در صفحه روی دکمه Update کلیک کنین.
حالا باید اسکریپت اضافی رو اضافه کنین که افکت لایت باکس رو برای این کلاس سفارشی غیرفعال کنه. لطفا حساب FTP رو وصل کنین یا File Manager رو باز کنین و به پوشه /wp-content/themes/themeXXXXX/js برین (که XXXXX عدد پوسته شماست). فایل my_script.js رو اونجا پیدا میکنین. این فایل رو از طریق هر ویرایشگر کد مثل Notepad++ باز کنین.
مهم: همیشه یک کپی از فایلی که می خواهین ویرایش کنین تهیه کنین. در صورت نیاز بهتون کمک میکنه که تغییرات رو به راحتی برگردونین.
اسکریپت زیر رو به انتهای فایل قبل از تگ closing })(jQuery) اضافه کنین:

پست پیشنهادی : نحوه استایل دادن به پلاگین Contact Form 7 در وردپرس

jQuery(document).ready(function(){
  jQuery('.posts-grid.posts-grid-two figure a[rel*="prettyPhoto"]').attr('rel','');
  jQuery('.posts-grid.posts-grid-two figure a').click(function(e) {
    e.preventDefault();
  });
});

jQuery(document).ready(function(){

jQuery('.posts-grid.posts-grid-two figure a[rel*="prettyPhoto"]').attr('rel','');

jQuery('.posts-grid.posts-grid-two figure a').click(function(e) {

e.preventDefault();

});

در این اسکریپت باید کلاس posts-grid.posts-grid-two رو به کلاس سفارشیتون از کلاس shortcode, “profiles” در مثال ما، تغییر بدین. اسکریپت ویرایش شده به شکل زیر خواهد بود:

jQuery(document).ready(function(){
    jQuery('.profiles figure a[rel*="prettyPhoto"]').attr('rel','');
    jQuery('.profiles figure a').click(function(e) {
        e.preventDefault();
    });
});

jQuery(document).ready(function(){

jQuery('.profiles figure a[rel*="prettyPhoto"]').attr('rel','');

jQuery('.profiles figure a').click(function(e) {

e.preventDefault();

});

تغییرات در این فایل رو ذخیره کنین. صفحه رو ریفرش کنین تا تغییرات سایتتون رو بررسی کنین. میبینیم که افکت لایت باکس با موفقیت غیرفعال شد.
برای حذف zoom style از تصاویرتون، باید قوانین زیر رو به انتهای فایل wp-content/themes/themeXXXXX/style.css اضافه کنین:

.profiles .zoom-icon {
background: none!important;
}
 
.profiles .zoom-icon:before {
background: none!important;
}

.profiles .zoom-icon {

background: none!important;

}

.profiles .zoom-icon:before {

background: none!important;

}

کلاس “.profiles” رو به کلاس سفارشی خودتون در قوانین CSS تغییر بدین. فراموش نکنین که تغییرات رو در فایل ذخیره کنین.

آموزش غیرفعال کردن افکت لایت باکس برای پست های شورتکد وردپرس

شبنم داوودی زاده 525