Jak dodać tzw. ikonę wpisu?

Bardzo ładnym efektem jest umieszczanie małego zdjęcia, przeważnie 150×150 pikseli  w lewym rogu wpisu dla ilustracji treści wpisu na blogu. Zdjęcia zawsze uatrakcyjniaja wygląd bloga. Aby ułatwić wstawianie takich obrazków od WP 2.9 pojawiła się obsługa ikony wpisu.

Ikona wpisu (w oryginale featured image) jest to obrazek przypisany do wpisu, który dodaje się w formularzu wpisu – pole dodawania ikonki znajduje się w prawym dolnym rogu formularza.

Niektóre motywy i frameworki mają już dodana obsluge ikon wpisu. Np. Thematic wstawia ikonę wpisu tylko na stronie kategorii i stronie właściwego wpisu. Nie pojawiają się one na stronie głównej.

Jak dodać ikonę wpisu do motywu, który jeszcze takiej opcji nie posiada.

1. dodanie pola do formularza w panelu bloga

w pliku functions.php dodajemy następujący fragment kodu: add_theme_support(‘post-thumbnails’); – powoduje on, że w formularzu wpisu pojawia się pole do dodania ikony wpisu. Jednak ta ikona jeszcze nie pojawi się we wpisie.

2. wyświetlenie ikonki na blogu

aby ikona pojawiała się należy dodać fragment kodu:

<?php the_post_thumbnail(array(200, 200), array('class' => 'alignleft')); ?>

– w tym przypadku ikonka ma wielkość 150×150 pikeli i będzie ustawiona po lewej

Ten kod trzeba ustawić przed wpisem w plikach index.php, single.php, category.php, page.php, czyli przed wywołaniem funkcji the_content();

Niestety tak dodana ikona wpisu jest nieklikalna i nie ma mozliwości powiększenia jej. Aby to zmienić można wkleić następujący kod:

<?php
if ( has_post_thumbnail()) {
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), ‘large’);
echo ‘<a href=”‘ . $large_image_url[0] . ‘” title=”‘ . the_title_attribute(‘echo=0’) . ‘” >’;
the_post_thumbnail(‘thumbnail’, array(‘class’ => ‘alignleft’));
echo ‘</a>’;
}
?>

Zamiast opisanego poprzednio.

Jeśli chcemy określić wielkość ikonki ( w tym przypadku 200×200 pikseli) to wklejamy ponizszy kod i ustawiamy wielkość jaką chcemy:

<?php
if ( has_post_thumbnail()) {
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), ‘large’);
echo ‘<a href=”‘ . $large_image_url[0] . ‘” title=”‘ . the_title_attribute(‘echo=0’) . ‘” >’;
the_post_thumbnail(array(200, 200), array(‘class’ => ‘alignleft’));
echo ‘</a>’;
}
?>

Ten sposób tez ma wadę, gdyż nie można wygasić obrazka kliknięciem na niego. Użytkownik musi kliknąć Wstecz i może się nie zorientować i może tu nastapić chwila irytacji. Czyli trzeba znaleźć rozwiązanie tego problemu.

 

 

 
żródło: http://webhosting.pl/Udoskonalamy.motyw.dodajemy.obsluge.ikon.wpisu

Leave a reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.