{"id":229120,"date":"2022-11-12T18:31:00","date_gmt":"2022-11-12T15:31:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=229120"},"modified":"2022-11-09T05:37:00","modified_gmt":"2022-11-09T02:37:00","slug":"laegga-till-anpassade-wordpress-bildattribut","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/sv\/laegga-till-anpassade-wordpress-bildattribut\/","title":{"rendered":"L\u00e4gga till anpassade WordPress-bildattribut"},"content":{"rendered":"

N\u00e4r det kommer till att arbeta med the_content<\/strong> \u00e4r det enkelt.<\/p>\n

    \n
  1. Konfigurera ett filter som \u00e4r anslutet till_inneh\u00e5llet,<\/strong><\/li>\n
  2. definiera en funktion som accepterar det inkommande inl\u00e4ggets inneh\u00e5ll,<\/li>\n
  3. g\u00f6r dina \u00e4ndringar,<\/li>\n
  4. returnera det \u00e4ndrade inneh\u00e5llet.<\/li>\n<\/ol>\n

    Och f\u00f6r det mesta \u00e4r detta allt som beh\u00f6vs. Men det finns tillf\u00e4llen d\u00e5 du kanske vill g\u00f6ra mer avancerade saker.<\/p>\n

    Till exempel kanske du vill inkludera inneh\u00e5ll fr\u00e5n en extern mall<\/a>. Eller s\u00e5 kanske du vill l\u00e4gga till attribut till bilder som du hittar i inl\u00e4gget.<\/p>\n

    Det kan vara sv\u00e5rt att g\u00f6ra detta med ett regulj\u00e4rt uttryck (eftersom HTML \u00e4r ett icke-vanligt spr\u00e5k) men med hj\u00e4lp av PHPs DOMDocument<\/a> \u00e4r det inte s\u00e5 illa.<\/p>\n

    Tanken bakom den koden som jag ska visa \u00e4r f\u00f6ljande:<\/p>\n

      \n
    1. leta efter img-<\/strong> taggar i inl\u00e4gget,<\/li>\n
    2. g\u00e5 igenom vad som \u00e4n hittas,<\/li>\n
    3. l\u00e4gg till attributen,<\/li>\n
    4. spara HTML,<\/li>\n
    5. returnera resultatet.<\/li>\n<\/ol>\n

      Observera att du kan beh\u00f6va justera detta baserat p\u00e5 dina egna behov, men den grundl\u00e4ggande koden som du beh\u00f6ver \u00e4r<\/a> :<\/p>\n

      <?php\n\nprivate function addImageAttributes($content)\n{\n\n  $content  = mb_convert_encoding($content, 'HTML-ENTITIES', \"UTF-8\");\n  $document = new DOMDocument();\n\n  libxml_use_internal_errors(true);\n  $document->loadHTML(utf8_decode($content));\n\n  $images = $document->getElementsByTagName('img');\n  foreach ($images as $image) {\n      $image->setAttribute('data-example', 'true');\n  }\n\n  return $document->saveHTML();\n}<\/code><\/pre>\n
      F\u00f6r de som inte \u00e4r bekanta med DOMDocument och vad som h\u00e4nder i koden ovan (som i varf\u00f6r vissa funktioner anropas innan m\u00e4rkningen bearbetas), h\u00e4r \u00e4r en snabb sammanfattning:<\/p>\n