Yalnızca Öne Çıkan Görseller için Küçük Resimler Oluşturun

Sadece özellikli resimler (index.php, archive.php, vb.) Olarak kullanmak istediğim resimler için küçük resim boyutları oluşturmak için basit bir yol (özel kod veya eklenti) olup olmadığını bilmek istiyorum , ancak resimler için değil yazılarda kullanılır (single.php). Ana hedefim, temamın asla kullanmayacağı küçük resimler oluşturmayarak sunucu alanı kullanımını azaltmak.

Küçük resimlerim aslında sadece 720px genişliğinde ve 328px genişliğinde iki boyuta sahip olacak ve 720px genişliğinde özellikli resimler (yalnızca ana sayfa) da 328px genişliğinde bir boyuta sahip olacaktı (archive.php ve sidebar.php için)

Şu anda, bildiğim tek programlı yol , her resim yüklemesi için küçük resimler oluşturmaktır , bu da istenmeyen bir durumdur, çünkü yüklemelerimin çoğu post görüntü olacak ve sunucudan çok sayıda görüntüyü manuel olarak silmem gerekecekti.

Eklentiler üzerinde özel kod tercih ederim, ancak bir eklenti kabul edilebilir. Orada bazı görüntü boyutlandırma eklentileri olduğunu biliyorum, ama onlar uzun zamandır güncelleme (TimThumb, Dynamic Image Resizer ).

Burada da Wordpress SE'de benzer bir soru buldum , ancak kabul edilen cevap gerçekten sorunumu çözmedi.

DÜZENLEME: Silmek veya özellikli resimler için değil, yazı içindeki görüntüler için küçük resimleri önlemek gerekir, yani:

(1) Öne çıkan resim : WP tarafından otomatik olarak oluşturulan ek küçük resimler sorun değil.

(2) Mesajların içinde kullanılan resimler : Orijinal resmi yükleyin ve başka boyut oluşturmayın. Resmi yüklemeden önce kırpacak, yeniden boyutlandıracak ve optimize edeceğim ve bir boyut ihtiyaçlarıma uygun olacak.

Bu işlev, geçici olarak bir görüntü boyutunu kaydederek, görüntüyü oluşturarak (gerekirse) ve boyutu kaldırarak bir görüntü oluşturur, böylece bu boyutta yeni görüntüler oluşturulmaz.

function lazy_image_size($image_id, $width, $height, $crop) {
    // Temporarily create an image size
    $size_id = 'lazy_' . $width . 'x' .$height . '_' . ((string) $crop);
    add_image_size($size_id, $width, $height, $crop);

    // Get the attachment data
    $meta = wp_get_attachment_metadata($image_id);

    // If the size does not exist
    if(!isset($meta['sizes'][$size_id])) {
        require_once(ABSPATH . 'wp-admin/includes/image.php');

        $file = get_attached_file($image_id);
        $new_meta = wp_generate_attachment_metadata($image_id, $file);

        // Merge the sizes so we don't lose already generated sizes
        $new_meta['sizes'] = array_merge($meta['sizes'], $new_meta['sizes']);

        // Update the meta data
        wp_update_attachment_metadata($image_id, $new_meta);
    }

    // Fetch the sized image
    $sized = wp_get_attachment_image_src($image_id, $size_id);

    // Remove the image size so new images won't be created in this size automatically
    remove_image_size($size_id);
    return $sized;
}

"Tembel" çünkü görüntüler ihtiyaç duyuluncaya kadar oluşturulmuyor.

Kullanım durumunuzda, lazy_image_sizeistediğiniz boyutta bir resim elde etmek için bunu yazı küçük resim kimliğiyle çağırırsınız . İlk çağrıda bir görüntü oluşturulur. Sonraki çağrılar mevcut görüntüyü getirir.

Gist: https://gist.github.com/mtinsley/be503d90724be73cdda4

Bu bağlantıyı görebilirsiniz . gibi bir örnek var

add_action( 'after_setup_theme', 'baw_theme_setup' );
function baw_theme_setup() {
  add_image_size( 'category-thumb', 300 ); // 300 pixels wide (and unlimited height)
  add_image_size( 'homepage-thumb', 220, 180, true ); // (cropped)
}

1. Gösterge Tablosu> Ayarlar> Medya seçeneğine gidin
2.Küçük resmi tam boyutlara kırp seçeneğinin işaretini kaldırın (normalde küçük resimler orantılıdır)
3.Tüm girişler için 0 girin (tüm boyutlar için 0)
4. Bunları işlevlerinize ekleyin.php

// Enable support for Post Thumbnails, and declare sizes.
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 400, 400, array("center","center") );
function fw_add_image_insert_override($sizes){
    // unset( $sizes['thumbnail']);
    unset( $sizes['small']);
    unset( $sizes['medium']);
    unset( $sizes['large']);
    return $sizes;
}
add_filter('intermediate_image_sizes_advanced', 'fw_add_image_insert_override' );

5.Fonksiyonunuzda kod satırı olmadığından emin olun . Php ile başlayın add_imge_size Not:: Küçük resminiz için 400x400 boyutunu kullandığınızı varsayalım Şimdi bir fotoğraf yüklediğinizde, en az 4 versiyon fotoğrafı yerine sadece 2 versiyon oluşturacak önceki gibi.

WordPress'in yalnızca belirli görüntüler için ek boyutlar yapmasını önlemek için, yüklemek HAKKINDA olduğunuz bir görüntünün yalnızca belirli bir amaç için kullanılacağını belirtmek için bir yolunuz olması gerekir. bu, yüklemeden ÖNCE gerçekleşmelidir.

bir yükleme eylemi sırasında bu seçenekleri belirten böyle bir arabirim (kutudan çıktığı gibi) olmadığından, bu özelliği ekleyen bir eklenti olmadığı sürece ek görüntü oluşturmayı engelleyemezsiniz.

ama neden dünyada ek görüntü boyutlarını istemiyorsunuz? herhangi bir görüntünün farklı boyutunu kullanmak istediğinizde ne zaman bir durumla karşılaşabileceğinizi asla bilemezsiniz. depolama alanından endişe duyuyor musunuz?

kendi özel boyut özelliklerinizi kullanamaz mısınız? the_post_thumbnail( array(100, 100) );

Burada okuduğum cevapların ve yorumların çoğu, WordPress ortamının görüntü boyutları için nasıl özelleştirileceğini açıklıyor, ancak hiçbiri koşullu olarak yapıldığından bahsetmiyor. ayrıca hiçbiri, bir görüntüyü yüklemeden önce kullanımını belirtmeniz gerektiği gerçeğini ele almaz.

bir yayındaki çok küçük bir görüntüyü veya çok büyük bir görüntüyü telafi etmeye çalışıyorsanız, birkaç şeyden yararlanabilirsiniz.

1. CSS: Stil sayfanıza .post-entry img { max-width:200px; max-height:300px; }, resmin kendisinin boyutuna güvenmekten daha evrensel ve etkili olduğu gibi girişler ekleyebilirsiniz - BU bir çok Photoshop zamanıdır.

2. Şablon: Yayınlar HTML çıktısının oluşturulduğu şablon dosyasını değiştirebilir ve şöyle bir görüntü boyutu belirleyebilirsiniz:

WordPress'teki bu belgelere bakın: https://codex.wordpress.org/Function_Reference/the_post_thumbnail

Merhaba - Benzer bir sorunum vardı. WooCommerce, katalog ve ilgili ürün resimleri için katalog resimleri kullanır. Bu, görüntü kalitesini veya hızını kaybetmeniz için ideal değildir. Bu yüzden ilgili ürünlerime dördüncü resim kategorisi eklemeye çalıştım. Howdy McGee sorunu çözdü. Lütfen Howdy McGees cevabına bir göz atın:

İlgili Ürünü Değiştir Resim Boyutları: kodunu okuyun !

İhtiyacım için muhteşem bir şekilde çalıştı. Sorununuz için aynı mantık uygulanabilir. Bu yardımcı olur umarım.

Saygılarımızla,

Theo

**İlave: **

İşe yarayan bir çözüm buldum.

Adım 1: İşlevlerinize yeni bir küçük resim boyutu atayın. Php. Referansı kontrol edin: wp codex !

/*add your custom size*/
add_action( 'after_setup_theme', 'your_theme_setup' );
function your_theme_setup() {
add_image_size( 'your-thumb', 123, 123, true );//insert your values
}

Not: 'baş parmağınız', bu değişken adını daha sonra kullanacaksınız

2. Adım: Ardından, öne çıkan ürünlerinizi görüntülemek istediğiniz yere aşağıdaki kodu ekleyin:

    <h1>featured products</h1> 
    <div class="woocommerce">
    <ul class= "products">

    <?php
    $args = array( 'post_type' => 'product', 'meta_key' => '_featured','posts_per_page' => 4,'columns' => '4', 'meta_value' => 'yes' );
     $loop = new WP_Query( $args );

     while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>

                    <li class="product post-<?php echo get_the_ID(); ?>">    
                        <a href="<?php echo get_permalink( $loop->post->ID ) ?>" title="<?php echo esc_attr($loop->post->post_title ? $loop->post->post_title : $loop->post->ID); ?>">

                            <?php woocommerce_show_product_sale_flash( $post, $product ); ?>
                            <?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'your-thumb'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="123px" height="123px" />'; ?></a>
                            <h3><?php the_title(); ?></h3><span class="price"><?php echo $product->get_price_html(); ?></span>

                    </li>

    <?php endwhile; ?>
    <?php wp_reset_query(); ?> 
    </ul>
    </div>

Referans ve bilgi: ( www.haloseeker.com/display-woocommerce-featured-products-without-a-shortcode/ )

Wootheme mystyle'ın index.php'sine (ana sayfam) yerleştirdim. On line 'baş parmağınızı' kullanmayı unutmayın:

<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'your-thumb'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="123px" height="123px" />'; ?></a>

3. Adım: Küçük resimleri yeniden oluşturun, https://wordpress.org/plugins/regenerate-thumbnails/ eklentisini kullanın

4. Adım: Tarayıcıyı yenileyin ve DOM'u inceleyin ve değerleri karşılaştırın

Temanıza göre işaretleme ve sınıf adlarını değiştirebilirsiniz. Yukarıdaki yöntemi test ettim ve iyi çalışıyor.

Şimdiye kadar yapamadığım tek şey, sepete ekle düğmesi kısa koduna nasıl bir değişken yazacağımı bilmediğim için sepete ekle-düğmesini eklemektir. Bu kod:

<?php echo do_shortcode('[add_to_cart id="variable number?"]'); ?>

Umarım bu yardımcı olur.

Bunu yapmanın kesinlikle daha zarif bir yolu var. Örneğin, function.php işlevinde bir işlev varsa

Saygılarımızla,

Theo