✅ Nowości, motywy, wtyczki WEB i WordPress. Tutaj dzielimy się wskazówkami i najlepszymi rozwiązaniami dla stron internetowych.

Dodawanie niestandardowych atrybutów obrazu WordPress

18

Jeśli chodzi o pracę z the_content, jest to proste.

  1. Skonfiguruj filtr podpięty do the_content,
  2. zdefiniować funkcję akceptującą treść przychodzących postów,
  3. dokonaj zmian,
  4. zwrócić zmodyfikowaną zawartość.

I przez większość czasu to wszystko, co jest potrzebne. Ale są chwile, w których możesz chcieć robić bardziej zaawansowane rzeczy.

Na przykład, być może będziesz chciał dołączyć treść z zewnętrznego szablonu. A może zechcesz dodać atrybuty do obrazów, które znajdziesz w poście.

Może to być trudne przy użyciu wyrażenia regularnego (ponieważ HTML nie jest językiem regularnym), ale z pomocą DOMDocument PHP nie jest tak źle.

Idea tego kodu, który zamierzam pokazać, jest następująca:

  1. poszukaj tagów img w poście,
  2. przejdź przez wszystko, co zostanie znalezione,
  3. dodaj atrybuty,
  4. zapisz kod HTML,
  5. zwróć wynik.

Pamiętaj, że może być konieczne dostosowanie tego do własnych potrzeb, ale podstawowy kod , którego będziesz potrzebować, to :

<?php

private function addImageAttributes($content)
{

  $content  = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
  $document = new DOMDocument();

  libxml_use_internal_errors(true);
  $document->loadHTML(utf8_decode($content));

  $images = $document->getElementsByTagName('img');
  foreach ($images as $image) {
      $image->setAttribute('data-example', 'true');
  }

  return $document->saveHTML();
}

Dla tych, którzy nie są zaznajomieni z DOMDocument i tym, co dzieje się w powyższym kodzie (np. dlaczego niektóre funkcje są wywoływane przed przetworzeniem znaczników), oto krótkie podsumowanie:

  • mb_convert_encode. To zajmie kodowanie znaków przychodzących danych i przekonwertuje je na UTF-8 (na podstawie powyższego kodu, ale może to być coś innego).
  • libxml_use_internal_errors. Spowoduje to wyłączenie raportowania o błędach, a my, jako programista, będziemy mogli samodzielnie odzyskać błędy.
  • utf8_decode. To dekoduje informacje w ciągu od UTF-8 do ISO-8859-1. Powodem, dla którego to robimy, jest to, że większość stron będzie miała zestaw znaków zdefiniowany jako drugi i potrzebujemy go zakodować do pierwszego, aby go przetworzyć.

To powiedziawszy, polecam również przeczytać na DOMDocument, aby uzyskać więcej informacji o wszystkim, co dzieje się powyżej.

Niemniej jednak, gdy użyjesz funkcji takiej jak powyżej, będziesz mieć niestandardowy  atrybut przykład danych z wartością true na obrazach w całym poście.

Źródło nagrywania: tommcfarlin.com

Ta strona korzysta z plików cookie, aby poprawić Twoje wrażenia. Zakładamy, że nie masz nic przeciwko, ale możesz zrezygnować, jeśli chcesz. Akceptuję Więcej szczegółów