publikacja: 27 października 2011, autor: , komentarzy 15 http://wpninja.pl/artykuly/oblewanie-obrazkow-tekstem-w-kanale-rss/

Oblewanie obrazków tekstem w kanale RSS

Oblewanie obrazków tekstem w kanale RSS

Poprawne oblewanie tekstem obrazków nie jest trudne z poziomu dodawania wpisu. Problemy pojawiają się najczęściej na poziomie kanału RSS. Jak zapewnić poprawne formatowanie i w przeglądarce internetowej, i czytniku RSS?

Co może mnie zniechęcić do dodania kanału RSS do czytnika?

Mam zwyczaj dodawać do czytnika RSS (używam Google Readera) wszystkie administrowane przeze mnie strony. Dzięki temu szybko dowiaduję się o ewentualnych problemach i mogę im odpowiednio wcześnie zaradzić. Właśnie w ten sposób odkryłem błąd, który jest dość powszechny, a na który wiele osób nie zwraca uwagi: oblewanie obrazków tekstem w kanale RSS bloga.

Problem pojawia się wtedy, kiedy korzystamy z  biblioteki mediów. Po wstawieniu obrazka możemy go wyrównać względem tekstu – wygenerowany przez WordPressa kod HTML wygląda wówczas następująco:

<img class="alignleft" src="http://img.wpninja.pl/sample.gif" />

Z poziomu panela administratora wszystko jest w porządku. To samo po publikacji.

Wpis "Narzędzia social media: Bizo Switchboard" na blogu Pawła Tkaczyka. Jeśli się uczyć - to od najlepszych :)

Narzędzia social media: Bizo Switchboard” Pawła Tkaczyka. Jeśli się uczyć – to od najlepszych :)

Niestety, lektura w Google Readerze zaczyna się od nieprzyjemnego zgrzytu…

Tenże wpis w czytniku RSS. Jeśli się uczyć - to na błędach najlepszych.

Tenże wpis w czytniku RSS. Jeśli się uczyć – to na błędach najlepszych.

Dlaczego tak się dzieje? Kanał RSS nie jest w stanie poprawnie interpretować wskazanego wyżej kodu, ponieważ

class="alignleft"

odwołuje się on do arkusza CSS. Wpis w czytniku nie ma do niego dostępu, co powoduje, że obrazki wyświetlane są domyślnie (bez wyrównania).

Rozwiązanie: wtyczka Align RSS Images

Są dwa rozwiązania tego problemu:

  1. Ręcznie uzupełniać kod każdego obrazka o odpowiedni fragment, np:
    style="float:left"
  2. Zainstalować wtyczkę Align RSS Images.

Po instalacji wtyczki należy odczekać parę godzin – wszystko zmieni się automatycznie po włączeniu pluginu.

 

Komentarze

  1. Jakub Milczarek 5 lat temu:

    Używam wtyczki Align RSS Images już od jakiegoś czasu zawsze i wszędzie :)
    Swoją drogą masz jednak niestety rację – bardzo wiele osób zupełnie olewa to jak wyglądają ich kanały RSS, a szkoda!

    odpowiedz
  2. marsjaninzmarsa 5 lat temu:

    Myślę, że warto zamienić adres na ten prowadzący do oficjalnego repozytorium WP.

    odpowiedz
    1. Szymon Skulimowski 5 lat temu:

      Podmieniłem odnośnik. Dzięki za informację.

      odpowiedz
  3. Łukasz Więcek - myDIY.pl 5 lat temu:

    Ja u siebie wrzucam w RSS tylko ikonę wpisu, która w przypadku mojego myDIY jest prostokątem, którego oblewanie tekstem nie miałoby większego sensu. Jedynie wrzuciłem grafikę w osobny akapit, żeby wisiała całkiem osobno, a nie z pierwszą linią tekstu przyklejoną z prawej strony (jak na powyższym zrzucie:)

    odpowiedz
  4. Piotr Sajnog 5 lat temu:

    Ja też stosuję tę wtyczkę, ale niestety nie działa ona dla obrazków wstawionych jako ikony wpisów za pomocą funkcji the_post_thumbnail(). Czy jest jakaś metoda, żeby obrazki wstawiane za pomocą tej funkcji też były oblewane tekstem w czytnikach RSS?

    odpowiedz
    1. Szymon Skulimowski 5 lat temu:

      Nie korzystam z tej wtyczki, ale zajrzałem do kodu i wychodzi na to, że dodaje ona style dla elementów, które mają odpowiednie klasy.

      Spróbuj dodać klasę „alignleft” lub „alignright”:

      the_post_thumbnail('thumbnail',array('class'=>'alignleft'));
      odpowiedz
  5. Krzysztof Trynkiewicz z SukcesStrony.pl 5 lat temu:

    Dzieki za info, brzmi ciekawie. Minus taki, ze to kolejna wtyczka, spowalniajaca troche bloga i bedaca okazja na wlam, a absolutnie niezbedna nie jest. Takze ja chyba wole recznie dodawac style…
    Czy ta wtyka:
    – zmienia kod wewnatrz wpisu w bazie danych
    – zmienia kod tylko podczas przekazywania wpisu do RSS
    – zmienia kod podczas pobierania wpisu z bazy danych
    ?
    Dodatkowo obawiam sie, co by bylo, gdybym do grafiki i tak dodal wlasny atrybut style. Zgaduje, ze wtyczka by dorzucila swoj i by wyszly dwa, co by wywalalo list w wiekszosci czytnikow, a i zgodne z w3 by nie bylo.

    odpowiedz
    1. Szymon Skulimowski 5 lat temu:

      Wtyczka zmienia tylko kod HTML kanału RSS/Atom w momencie pobierania danych z bazy. Co do nakładania się stylów to nie pomogę, musisz to sam sprawdzić.

      odpowiedz
  6. Krystian Piątek 5 lat temu:

    Dla osób nietechnicznych lub nie lubiących grzebać w kodzie wtyczka na pewno interesująca

    odpowiedz
  7. Sylwia 5 lat temu:

    Witam, pan Szymon jak widzę zapomniał o mojej sprawie w której obiecał pomóc mi kilka miesięcy temu :( szkoda.

    odpowiedz
    1. Szymon Skulimowski 5 lat temu:

      Pan Szymon wysłał maila w tej sprawie.

      odpowiedz
  8. Paweł Tkaczyk 5 lat temu:

    Winny ;-) Pytanie: czy ta wtyczka sformatuje mi też feed, który podaję do Google Feedburnera? Bo tego używam do generowania feedów…

    odpowiedz
    1. Jakub Milczarek 5 lat temu:

      Tak, bez problemu – możesz zobaczyć to np. na moim feedzie: http://feeds2.feedburner.com/JakubMilczarek

      odpowiedz
    2. Łukasz Więcek - myDIY.pl 5 lat temu:

      Bez problemu. Feedburner pobiera sobie ten normalny, WordPressowy feed, więc nie ma to żadnego znaczenia. Tak samo z Feedburnerem we własnej domenie będzie śmigać bez problemu: http://rss.mydiy.pl/posty

      Pozdrawiam!

      odpowiedz

Dodaj własny komentarz

Odnośniki z innych stron

Lista innych stron, które w jakiś sposób odnoszą się do opublikowanej tutaj treści:

  1. Oblewanie obrazków tekstem w kanale RSS | Blog Adama Klimowskiego

    […] Oblewanie obrazków tekstem w kanale RSS | WPNinja […]