Share
Som temat utvecklare av WordPress kan vi skapa ett tema - eller teman - som kräver att bilderna har en viss specifik storlek (dimensioner). Samtidigt kan vi inte ansvara för att skapa sådana dimensionspecifika bilder på slutanvändarna av våra teman.
Så vad är lösningen? Det bästa sättet att ta itu med detta problem är att inom våra tema (er) integrera funktionaliteten för att skapa anpassade bilder i flygningen.
I den här handledningen ska jag visa dig hur du använder BFI Thumb PHP-biblioteket för att uppnå det.
Enligt WordPress Codex:
En aktuell bild är en bild som är vald som representativ bild för inlägg, sidor eller anpassade inläggstyper. Visningen av den här bilden är upp till temat. Detta är särskilt användbart för teman "magazine-style" där varje inlägg har en bild.
Utvalda bilder heter Miniatyrer innan namnet byttes. Så du kommer att hitta dessa två termer som används utbytbart.
Teman måste förklara sitt stöd för postminimbilder innan gränssnittet för att tilldela dessa bilder kommer att visas på skärmen Lägg till / redigera inlägg.
För att aktivera efter miniatyrstöd i ditt tema lägger du till följande rad i din functions.php fil:
För att visa miniatyrbilder i ditt tema klistra in följande kod på en lämplig plats i din specifika mallfil:
Ovanstående kod kontrollerar om posten har en miniatyrbild innan du ringer funktionen för att visa den.
De add_image_size () funktionen kan du registrera nya bildstorlekar för post miniatyrer.
Som standard skapar WordPress följande bildstorlekar när en användare lägger till en bild i mediebiblioteket:
För att registrera nya bildstorlekar använder vi add_image_size () funktion så här:
Accentsconagua
$ name - (sträng) (nödvändig) Det nya bildstorleknamnet. Standard: Ingen $ bredd - (int) (frivilligt) Postens miniatyr bredd i pixlar. Standard: 0 $ höjd - (int) (valfritt) Posten miniatyrbild höjd i pixlar. Standard: 0 $ gröda - (boolean / array) (valfritt)För att visa de nyregistrerade bildstorlekarna i ditt tema, skicka helt enkelt namnet på din anpassade inläggets tumstorleksstorlek till the_post_thumbnail () funktion, så här:
BFI Thumb är en PHP-klass eller ett bibliotek som fungerar som en on-the-fly bildreserator / cropper / gråskalare / colorizer / opacitor för WordPress utvecklad av Benjamin Intal.
1. Ladda ner BFI-tummen från GitHub och spara den i ditt temas rotkatalog.
2. Inkludera i ditt tema genom att lägga till följande rad i din functions.php fil:
3. Använd följande funktion var du än vill visa din bild i anpassad storlek:
400, 'höjd' => 300); bfi_thumb ("URL-to-image.jpg", $ params); ?> Om du tittar på ovanstående funktion ( bfi_thumb () ) kommer du att märka att det tar URL-adressen för bilden som ska ändras som en första parameter, följt av de andra parametrarna (bilddimensioner). Så du måste fråga dig själv, hur bestämmer vi webbadressen till vår postminimatyr?
För att bestämma webbadressen till en miniatyrbild, använder vi en funktion som heter wp_get_attachment_image_src () som tar bifogad ID, storlek och en valfri ikon som parametrar.
Så vi passerar get_post_thumbnail_id () fungera som den första parametern. Det tar Post-ID som en parameter och returnerar ID av den presenterade bilden som bifogas posten.
Den andra parametern är storlek som kan vara antingen ett strängord (miniatyr, medium, stort eller fullt), alla anpassade bildstorlekar som du lagt till med hjälp av add_image_size () funktion eller en tvåpunktsgrupp som representerar bredd och höjd i pixlar. Men för att säkerställa att vår anpassade bild har högsta kvalitet, kommer vi att använda originalstorleken - full.
Nu ska vår kod se ut så här:
400, 'höjd' => 300); $ imgsrc = wp_get_attachment_image_src (get_post_thumbnail_id ($ post-> ID, "), $ thumb_size); bfi_thumb ($ imgsrc [0], $ params);
wp_get_attachment_image_src () returnerar en ordnad array med värden som motsvarar storleken (0) url, (1) bredd, (2) höjd och (3) av en bildbilaga (eller en ikon som representerar en bilaga).
Men vi är bara intresserade av den första returnerade parametern - URL. Vi skickar det till bfi_thumb () funktion, tillsammans med våra andra parametrar (bredd och höjd) för att få vår anpassade bild.
Eftersom vi sannolikt kommer att använda den här koden om och om igen i vårt tema - eller teman - låt vi lägga den i en funktion.
$ image_width, 'height' => $ image_height); $ imgsrc = wp_get_attachment_image_src (get_post_thumbnail_id ($ post-> ID, "), $ thumb_size); $ custom_img_src = bfi_thumb ($ imgsrc [0], $ params); returnera $ custom_img_src;?>
Spara den här filen till din functions.php fil.
För bilder:
Eller för bakgrundsbilder:
...
Skräddarsydda bilder skapade på flyga med ett bibliotek som BFI Thumb har följande fördelar jämfört med egna miniatyrbilder skapade / tillagda med hjälp av add_image_size () fungera:
;?>)
the_post_thumbail () funktioner echos ut en bild tagg. Ibland är det du vill ha bildens webbadress. Ett exempel är var du vill använda bilden som bakgrund.add_image_size () gäller inte äldre bilder som laddades upp innan bildstorleken var registreradI denna snabba tips tittade vi på utvalda bilder - vad de är och hur vi kan använda dem i våra teman. Vi tittade också på add_image_size () funktion för att se hur vi kan använda den för att lägga till anpassade bildstorlekar när en bild laddas upp i mediebiblioteket.
Vi introducerade BFI THumb PHP-biblioteket och illustrerade hur vi kan använda den för att skapa en bild i en anpassad storlek från en miniatyrbild eller en bild.
Vi tittade då på användningsbegränsningarna add_image_size () för att skapa anpassade bildstorlekar och de fördelar som BFI Thumb har över den.
Lägg till den här funktionen i din functions.php fil och använd den när du behöver skapa en bild i anpassad storlek från en miniatyrbild.
