Od ponad dekady korzystam z WordPress-a. Zapewne wiecie, że zmienianie motywu (szablonu) jest rzeczą naturalną. Już nie raz mówiłem sobie. – Ten szablon zostanie ze mną na zawsze. Ale słowo klucz „zawsze” nie jest ma miejscu w tej sprawie. Zmieniają się nasze upodobania, a szczególnie wtedy, gdy sami potrafimy zrobić sobie stronę. Zrozumiałem więc, że osadzanie obrazów we wpisach musi być tak przeprowadzone, by zmiana szablonu i ewentualna zmiana wielkości miejsca na „content” nie wymagała edycji każdego wpisu w panelu administracyjnym.
Dlatego też, ze szczególnym okrucieństwem nakładam nacisk na to, by we wpisie dodając obrazek usunąć z niego parametry width i height.
<img src="http://www.kurdu.pl/wp-content/uploads/2014/03/fb.png" alt="fb"
width=”128″ height=”128″ class="alignleft size-full wp-image-387" /></a>
Najlepiej przeprowadzić to tak, aby szerokość i wysokość nie pojawiała się podczas dodawania obrazka automatycznie. Aby tego dokonać należy w pliku functions.php dodać kod:
add_filter( 'image_send_to_editor', 'remove_width_attribute', 10 );
function remove_width_attribute( $html ) {
$html = preg_replace( '/(width|height)="d*"s/', "", $html );
return $html;
W pliku css każdego ze swoich szablonów dodaje dodatkowy parametr max-width, by obrazek automatycznie dopasował się co „contentu” czyli treści.
.alignleft {float:left; max-width:300px;}
.aligncenter {display:block; margin:0 auto; max-width:100%}
.alignright {float:right; max-width:300px;}
.alignnone {display:block}
Zauważcie, że w klasie .alignleft oraz .alignright podałem maksymalną szerokość (max-width) jaką może posiadać obrazek w tym szablonie. W klasie .aligncenter szerokość wyznaczona jest w procentach co oznacza, że jego szerokość maksymalna będzie taka jak kontener, w której zawarta jest treść. Jeśli więc zmienicie szablon i będziecie chcieli zmienić wielkość obrazka, to wystarczy zmienić je tylko w stylu zmieniając szerokość .alignleft i .alignright i sprawa będzie załatwiona bez edytowania dziesiątek albo setek wpisów. Warto podkreślić, że podanie parametru max- width sprawi, że obrazek będzie maksymalnej wielkości np., 300px, ale jeśli obrazek będzie mniejszy, to nie zostanie rozciągnięty.
Stosuję tą metodę przy każdym motywie jaki wykonuję na WordPress.