{"id":230114,"date":"2022-12-02T18:06:00","date_gmt":"2022-12-02T15:06:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=230114"},"modified":"2022-11-09T20:09:16","modified_gmt":"2022-11-09T17:09:16","slug":"aendra-storlek-paa-bilder-programmatiskt-i-wordpress","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/sv\/aendra-storlek-paa-bilder-programmatiskt-i-wordpress\/","title":{"rendered":"\u00c4ndra storlek p\u00e5 bilder programmatiskt i WordPress"},"content":{"rendered":"\n

Om du n\u00e5gonsin har beh\u00f6vt arbeta med att \u00e4ndra storlek p\u00e5 bilder programmatiskt i WordPress, kan du ha st\u00f6tt p\u00e5 funktionen image_resize<\/a><\/strong>.<\/p>\n

Dessutom kanske du vet att det har fasats ut (med tanke p\u00e5 att detta visas h\u00f6gst upp p\u00e5 sk\u00e4rmen):<\/p>\n

\n

Denna funktion har f\u00f6r\u00e5ldrats. Anv\u00e4nd wp_get_image_editor()<\/a><\/strong> ist\u00e4llet.<\/p>\n<\/blockquote>\n

Och med dess utfasning, som \u00e4r sant f\u00f6r alla dem som g\u00f6r ett bra jobb med att avskaffa funktionalitet, \u00e4r den inte utan att den ers\u00e4tts.<\/p>\n

I det h\u00e4r fallet pratar vi om WP Image Editor. Detta \u00e4r en klass i WordPress som vi kan anv\u00e4nda f\u00f6r att utf\u00f6ra samma operationer f\u00f6r att \u00e4ndra storlek p\u00e5 bilder programmatiskt som vi en g\u00e5ng kunde med den ursprungliga funktionen.<\/p>\n

F\u00f6r att vara tydlig \u00e4r det h\u00e4r inl\u00e4gget inte en fullst\u00e4ndig handledning om hur man anv\u00e4nder WP_Image_Editor<\/code><\/a><\/strong>.<\/p>\n<\/p>\n

Ist\u00e4llet \u00e4r det en enkel guide f\u00f6r hur man anv\u00e4nder den f\u00f6r att \u00e4ndra storlek p\u00e5 bilder ist\u00e4llet f\u00f6r en f\u00f6r\u00e5ldrad funktion tillsammans med n\u00e5gra f\u00f6rklaringar p\u00e5 v\u00e4gen om hur man hanterar fall d\u00e4r det kan finnas fel.<\/p>\n

Hitta bilden att anv\u00e4nda<\/h3>\n

Beroende p\u00e5 vad du g\u00f6r kan du kanske h\u00e4mta filens filnamn fr\u00e5n sj\u00e4lva WordPress; Men f\u00f6r det h\u00e4r exemplet ska jag helt enkelt h\u00e5rdkoda s\u00f6kv\u00e4gen till en fil.<\/p>\n

Det h\u00e4r \u00e4r det enklaste s\u00e4ttet att f\u00f6rklara hur man anv\u00e4nder klassen kontra att g\u00e5 iv\u00e4g p\u00e5 en tangent f\u00f6r hur man programmatiskt h\u00e4mtar en bild, f\u00e5r dess s\u00f6kv\u00e4g, skickar den till editorklassen och s\u00e5 vidare.<\/p>\n

S\u00e5 l\u00e5t oss anta att den givna v\u00e4gen till bilden \u00e4r ungef\u00e4r s\u00e5 h\u00e4r:<\/a><\/strong><\/p>\n

<?php\n\n$filename = '\/Users\/tommcfarlin\/Projects\/acme\/wp-content\/uploads\/2018\/06\/original-image.jpg';\nif (!file_exists($filename)) {\n  return;\n}<\/code><\/pre>\n
Med det kommer vi att lagra den i en variabel som vi kan \u00f6verf\u00f6ra till en annan funktion om vi vill anv\u00e4nda originalfilen flera g\u00e5nger.<\/p>\n
H\u00e4mta en instans av bildredigeraren<\/h3>\n
D\u00e4refter m\u00e5ste du skaffa en instans av bildredigeringsklassen s\u00e5 att du kan arbeta p\u00e5 bilden som ligger p\u00e5 v\u00e4gen ovanf\u00f6r. I sin mest grundl\u00e4ggande form \u00e4r det inget annat \u00e4n att skicka ett filnamn till en funktion och sedan en rad argument.<\/p>\n
I det h\u00e4r inl\u00e4gget \u00e4r jag inte bekymrad \u00f6ver m\u00e4ngden argument \u2013 \u200b\u200bbara med att f\u00e5 en instans av redigeraren som jag kan anv\u00e4nda f\u00f6r att \u00e4ndra storlek p\u00e5 en bild.<\/p>\n
F\u00f6r att ta tag i en instans av n\u00e4mnda editor, g\u00f6r helt enkelt s\u00e5 h\u00e4r:<\/a><\/strong><\/p>\n
<?php\n\n\/\/ Grab the editor for the filename of the image. \n$filename = '\/Users\/tommcfarlin\/Projects\/acme\/wp-content\/uploads\/2018\/06\/original-image.jpg';\nif (!file_exists($filename)) {\n  return;\n}\n\n$editor = wp_get_image_editor( $filename, array() );<\/code><\/pre>\n
Detta kommer att returnera antingen en instans av redigeraren av en instans av **[WP_Error](https:\/\/developer.wordpress.org\/reference\/classes\/wp_error\/)**<\/code>(tillsammans med ett felmeddelande och annan information som du kan anv\u00e4nda f\u00f6r att fastst\u00e4lla problemet). Det \u00e4r alltid bra att kontrollera om v\u00e4rdet som returneras \u00e4r ett fel och stoppa eventuella framtida operationer.<\/a><\/strong><\/p>\n
<?php\n\n\/\/ Grab the editor for the file and the size of the original image.\n$filename = '\/Users\/tommcfarlin\/Projects\/acme\/wp-content\/uploads\/2018\/06\/original-image.jpg';\nif (!file_exists($filename)) {\n  return;\n}\n\n$editor = wp_get_image_editor( $filename, array() );\nif (is_wp_error($editor)) {\n   \/\/ handle the problem however you deem necessary.\n}<\/code><\/pre>\n
F\u00f6rutsatt att det inte finns n\u00e5got fel kan du dock b\u00f6rja arbeta med att \u00e4ndra storlek p\u00e5 bilden.<\/p>\n
\u00c4ndra storlek p\u00e5 bilden<\/h3>\n
Lyckligtvis \u00e4r detta n\u00e5got som \u00e4r l\u00e4tt att g\u00f6ra. Du beh\u00f6ver tre uppgifter:<\/p>\n
    \n
  1. bredd,<\/li>\n
  2. h\u00f6jd,<\/li>\n
  3. och om du vill besk\u00e4ra bilden eller inte.<\/li>\n<\/ol>\n
    Enligt min erfarenhet \u00e4r det n\u00e4stan alltid b\u00e4ttre att besk\u00e4ra bilden \u00e4n inte eftersom det undviker n\u00e5gon konstig str\u00e4ckning eller f\u00f6rvr\u00e4ngning vid udda bildf\u00f6rh\u00e5llanden.<\/p>\n
    N\u00e4r jag \u00e4ndrar storlek p\u00e5 bilden vill jag alltid f\u00e5 bildens nuvarande storlek och sedan anv\u00e4nda en multiplikator f\u00f6r att skapa de nya dimensionerna som jag vill \u00e4ndra storlek p\u00e5 bilden med.<\/p>\n
    L\u00e5t oss till exempel s\u00e4ga att jag har en bild och jag vill \u00e4ndra storleken p\u00e5 bredden med 40 % och h\u00f6jden med 30 %. F\u00f6r att g\u00f6ra detta m\u00e5ste jag:<\/p>\n
      \n
    1. f\u00e5 storleken p\u00e5 den aktuella bilden,<\/li>\n
    2. anv\u00e4nd den nya bredden och h\u00f6jden f\u00f6r att \u00e4ndra storlek p\u00e5 bilden.<\/li>\n<\/ol>\n
      Programm\u00e4ssigt skulle du g\u00f6ra s\u00e5 h\u00e4r:<\/a><\/strong><\/p>\n
      <?php\n\n\/\/ Grab the editor for the file and the size of the original image.\n$filename = '\/Users\/tommcfarlin\/Projects\/acme\/wp-content\/uploads\/2018\/06\/original-image.jpg';\nif (!file_exists($filename)) {\n  return;\n}\n\n$editor = wp_get_image_editor( $filename, array() );\nif (is_wp_error($editor)) {\n   \/\/ Handle the problem however you deem necessary.\n}\n\n\/\/ Get the dimensions for the size of the current image.\n$dimensions = $editor->get_size();\n$width = $dimensions['width'];\n$height = $dimensions['height'];\n\n\/\/ Calculate the new dimensions for the image.\n$newWidth = 0.4 * $width;\n$newHeight = 0.3 * $height;\n\n\/\/ Resize the image.\n$result = $editor->resize($newWidth, $newHeight, true);<\/code><\/pre>\n
      L\u00e4tt nog att f\u00f6lja, eller hur?<\/p>\n
      Sparar bilden<\/h3>\n
      Slutligen \u00e4r allt som \u00e5terst\u00e5r att spara bilden. I det h\u00e4r fallet kommer bilden att skrivas ut<\/a><\/strong> till uppladdningskatalogen (och vanligtvis \u00e5r och m\u00e5nad som WordPress tillhandah\u00e5ller).<\/p>\n
      <?php\n\n\/\/ Grab the editor for the file and the size of the original image.\n$filename = '\/Users\/tommcfarlin\/Projects\/acme\/wp-content\/uploads\/2018\/06\/original-image.jpg';\nif (!file_exists($filename)) {\n  return;\n}\n\n$editor = wp_get_image_editor( $filename, array() );\nif (is_wp_error($editor)) {\n   \/\/ handle the problem however you deem necessary.\n}\n\n\/\/ Get the dimensions for the size of the current image.\n$dimensions = $editor->get_size();\n$width = $dimensions['width'];\n$height = $dimensions['height'];\n\n\/\/ Calculate the new dimensions for the image.\n$newWidth = 0.4 * $width;\n$newHeight = 0.3 * $height;\n\n\/\/ Resize the image.\n$result = $editor->resize($newWidth, $newHeight, true);\n\n\/\/ If there's no problem, save it; otherwise, print the problem.\nif (!is_wp_error($result)) {\n  $editor->save($editor->generate_filename());\n} else {\n   \/\/ Handle the problem however you deem necessary.\n}<\/code><\/pre>\n
      Du kan sedan se den slutliga versionen \u00e4ndrad storlek (och namngiven p\u00e5 l\u00e4mpligt s\u00e4tt) baserat p\u00e5 dess utdata.<\/p>\n
      Inspelningsk\u00e4lla:  tommcfarlin.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
      Det h\u00e4r inl\u00e4gget ger en kort, enkel guide om hur du anv\u00e4nder WP Image Editor f\u00f6r att \u00e4ndra storlek p\u00e5 bilder programmatiskt.<\/p>\n","protected":false},"author":1,"featured_media":163264,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[848,724,868],"tags":[1173],"class_list":["post-230114","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-handledningar","category-utvecklaren","category-wordpress-9","tag-affiai-sv"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/posts\/230114","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/comments?post=230114"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/posts\/230114\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/media\/163264"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/media?parent=230114"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/categories?post=230114"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/tags?post=230114"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}