19 października 2014 | WordPress

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.

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

stat4u