Filtro per rimuovere gli attributi della dimensione dell'immagine?


35

Sto lavorando su un sito basato su un modello css di larghezza fluida che imposta una larghezza massima sulle immagini alla larghezza della colonna che le contiene e ho bisogno di rimuovere gli attributi di dimensione in larghezza e altezza incorporati che WordPress aggiunge alle immagini.

Lo sto facendo con le mie immagini in primo piano con questo filtro:

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10, 3 );

function remove_thumbnail_dimensions( $html, $post_id, $post_image_id ) {
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}

So di poter applicare lo stesso filtro a the_content , se necessario. Ma c'è un modo migliore per farlo?


Prima di tutto, grazie per il codice molto utile. Funziona perfettamente per rimuovere gli attributi di larghezza e altezza dal tag img, ma per qualche motivo sembra anche rimuovere lo shortcode della didascalia se ce n'è uno. Qualcuno sa perché questo è e come correggerlo?
Dominic P

1
Forse dovresti pubblicare questo come una sua domanda? Sembra sufficientemente distinto dal mio da meritare una sua risposta. Tuttavia, proverò a rispondere ... per chiunque trovi questa risposta e abbia lo stesso problema: il tuo problema è che la funzione img_caption_shortcode, che elabora lo shortcode della didascalia, richiede che sia specificata una larghezza negli attributi dello shortcode della didascalia. Altrimenti, salta del tutto la didascalia e restituisce semplicemente il contenuto racchiuso tra i [caption]tag shortcode.
goldenapples,

Se vuoi essere in grado di utilizzare i codici funzione della didascalia senza una larghezza definita, dovrai definire il markup della didascalia in una funzione agganciata al filtro img_caption_shortcode. Scrivere il codice per una funzione del genere è più di quello che posso inserire nei commenti qui, però.
goldenapples,

@goldenapples, grazie per la tua utile risposta. Ho fatto come hai suggerito e fatto una nuova domanda qui: wordpress.stackexchange.com/questions/32931/… . Qualsiasi input su questo sarebbe molto apprezzato. Come spiego nella domanda, non sono sicuro che il filtro img_caption_shortcodesia sufficiente per risolvere il problema.
Dominic P

1
Forse mi sto perdendo il quadro generale di ciò che stai cercando di fare senza vedere i tuoi contenuti reali, ma non è possibile rimediare usando solo CSS? Se stai usando una larghezza massima sulle tue immagini, dovresti riuscire a superare il problema dell'altezza aggiungendo un'altezza: auto; alle tue immagini di contenuti.
binaryorganic,

Risposte:


36

Ringrazia tutti!

Il filtro image_send_to_editor era quello che stavo cercando ... grazie @ t31os per averlo sottolineato.

Ecco le mie funzioni ora.

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10 );
add_filter( 'image_send_to_editor', 'remove_thumbnail_dimensions', 10 );

function remove_thumbnail_dimensions( $html ) {
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}

Ciò rimuove gli attributi di dimensione incorporati dalle immagini recuperate con the_post_thumbnail()e impedisce che tali attributi vengano aggiunti a nuove immagini aggiunte all'editor. Non li rimuove dalle immagini recuperate tramite wp_get_attachment_imageo da altre funzioni correlate (non ci sono hook), ma questi casi possono essere elaborati nei file dei modelli quando necessario.


1
Ho dovuto rimuovere \ s dal regex. Dopo ciò, ha funzionato bene. Penso che sia stato perché non avevo uno spazio finale dopo l'ultima doppia virgoletta sull'impostazione dell'altezza.
MattSlay,

1
@MattSlay Sono solo io ad avere un problema con la modifica permanente del contenuto del sito? Un tema reattivo non dovrebbe modificare il contenuto del sito Web per formattarlo correttamente. Voto per rimuovere il filtro image_send_to_editore invece aggiungerlo a the_content- come questo post del blog . Ciò separa la logica di presentazione dal contenuto.
BFT,

1
@BFTrick - Mi sembra una questione di contesto. Per un tema reattivo, sarei d'accordo con te perché non puoi dipendere dal fatto che il contenuto esistente sia stato elaborato in questo modo e non sai se il prossimo tema installato avrà bisogno di quegli attributi di dimensione. Nel mio caso, stavo costruendo un'app in cui il tema era parte integrante del contenuto, quindi ho scelto il metodo meno elaborativo per l'elaborazione delle immagini quando sono state aggiunte per la prima volta. Ma fai un buon punto.
goldenapples,

2
Attenzione: questa risposta rompe i sottotitoli delle immagini in WordPress 3.5.1.
cablato il

5

Modificato un po 'questo script. Grazie per l'aiuto!

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10 );
add_filter( 'image_send_to_editor', 'remove_thumbnail_dimensions', 10 );
// Genesis framework only
add_filter( 'genesis_get_image', 'remove_thumbnail_dimensions', 10 );
// Removes attached image sizes as well
add_filter( 'the_content', 'remove_thumbnail_dimensions', 10 );
function remove_thumbnail_dimensions( $html ) {
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}

5
Attento, però. Il filtro di the_content filtrerà anche i video di YouTube e qualsiasi altro attributo larghezza / altezza.
MikeNGarrett,

1
Vero, ma potrebbe essere una buona cosa in un sito reattivo. Se uno ha bisogno di farlo per le immagini, probabilmente uno deve farlo anche per altri media.
BFT,

1

se imposti la dimensione dell'immagine in function.php come una "galleria"

add_image_size( 'gallery', 200, 120, true );

puoi rimuovere la larghezza e l'altezza di dimensioni specifiche dell'immagine come "gallery":

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10, 4 );

function remove_thumbnail_dimensions( $html, $post_id, $post_image_id,$post_thumbnail) {
    if ($post_thumbnail=='gallery'){
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    }
    return $html;
}

0

L'applicazione a quel filtro lo the_contentattiverà per tutto il contenuto. Questo sarà efficace, ma potrebbe influire sulle prestazioni e sui tempi di caricamento del tuo sito. Sarebbe meglio se dici a WordPress di non inserire i tag di larghezza e altezza in linea quando inserisci le immagini in primo luogo.

Sfortunatamente, gli script che inseriscono effettivamente l'immagine sono creati in JavaScript e interagiscono con l'editor wysiwyg di TinyMCE. Potrebbe esserci un modo per collegarlo direttamente, ma non usando le add_filter()chiamate standard .


1
Un filtro non image_send_to_editorfunzionerebbe qui?
t31os,

@ t31os - Penso che sia quello che stavo cercando! Non so perché non ho visto quel gancio prima.
goldenapples,

Beh, spero sicuramente che aiuti, sembra che potrebbe fare il trucco ... riferiscici e facci sapere. :)
t31os,

@ t31os Sì, quello ha funzionato! Grazie! Lo posterò come risposta, a meno che tu non ci arrivi prima.
goldenapples,

2
Ci
provi amico
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.