Come cambiare l’SRC dell’immagine in Data-SRC per il Lazy Load utilizzando il filtro image_send_to_editor

Stai cercando un modo per cambiare l’SRC dell’immagine in Data-SRC per il lazy load utilizzando il filtro image_send_to_editor? Anche se probabilmente esiste un plugin per questo, abbiamo creato un rapido snippet di codice che puoi utilizzare per cambiare l’SRC dell’immagine in Data-SRC per il lazy load.

Istruzioni:

Tutto quello che devi fare è aggiungere questo codice al file functions.php del tuo tema o in un plugin specifico per il sito:

function example_lazy_load($html, $id, $caption, $title, $align, $url) {
  $src  = 'src="'.get_template_directory_uri().'/i/thumb.png"';
  $html = str_replace( "<img src", "<img {$src} data-src", $html );
  return $html;
}
add_filter( 'image_send_to_editor', 'example_lazy_load', 10, 9 );

Questo snippet utilizza image_send_to_editor e filtrerà l’output HTML sostituendo src con data-src, quindi aggiungerà un nuovo attributo src con una miniatura dell’immagine predefinita. Questa è una soluzione piuttosto semplice, ma ti consente di controllare l’output creato all’interno dell’editor del tuo post per garantire che le immagini aggiunte dai clienti vengano caricate in modo pigro. Assicurati di aggiornare la variabile $src con l’URL della tua immagine in miniatura predefinita.

Nota: Se questa è la prima volta che aggiungi snippet di codice in WordPress, consulta la nostra guida su come aggiungere correttamente snippet di codice in WordPress, in modo da non compromettere accidentalmente il tuo sito.

Se ti è piaciuto questo snippet di codice, prendi in considerazione la lettura dei nostri altri articoli sul sito come: I 50+ migliori temi WooCommerce per il tuo negozio online e I 7 migliori plugin WordPress per la conformità GDPR.