Share
Som WordPress-temautviklere kan vi lage et tema - eller temaer - som krever at bildene har en viss bestemt størrelse (dimensjoner). Samtidig kan vi ikke legge ansvaret for å lage slike dimensjonsspesifikke bilder på sluttbrukere av våre temaer.
Så hva er løsningen? Den beste måten å håndtere dette problemet på er å inkorporere funksjonaliteten i våre tema (er) for å generere tilpassede bilder i fly.
I denne opplæringen skal jeg vise deg hvordan du bruker BFI Thumb PHP-biblioteket for å oppnå det.
I følge WordPress Codex:
Et utvalgt bilde er et bilde som er valgt som det representative bildet for innlegg, sider eller egendefinerte innleggstyper. Visningen av dette bildet er opp til temaet. Dette er spesielt nyttig for temaer i "magasinstil" der hvert innlegg har et bilde.
Utvalgte bilder ble kalt miniatyrer før navnet ble endret. Så du vil finne disse to begrepene blir brukt om hverandre.
Temaer må deklarere sin støtte for innleggsminiatyr før grensesnittet for å tilordne disse bildene vil vises på Legg til / Rediger innlegg.
For å aktivere etter miniatyrstøtte i temaet, legg til følgende linje i din functions.php fil:
For å vise miniatyrbilder i temaet ditt, lim inn følgende kode på et passende sted i din spesifikke malfil:
Ovennevnte kode sjekker for å se om innlegget har en miniatyrbilde før du ringer funksjonen for å vise den.
De add_image_size () funksjonen gjør det mulig å registrere nye bildestørrelser for miniatyrer etter innlegg.
Som standard oppretter WordPress følgende bildestørrelser når en bruker legger til et bilde i mediebiblioteket:
For å registrere nye bildestørrelser bruker vi add_image_size () fungere som dette:
Accentsconagua
$ name - (string) (nødvendig) Det nye bildeformatnavnet. Misligholde: Ingen $ bredde - (int) (valgfritt) Innleggets miniatyrbredde i piksler. Standard: 0 $ høyde - (int) (valgfritt) Post miniatyrbildets høyde i piksler. Standard: 0 $ crop - (boolean / array) (valgfritt)For å vise de nyregistrerte bildestørrelsene i temaet ditt, send bare navnet på egendefinert innleggets tommelbildestørrelse til the_post_thumbnail () funksjon, slik:
BFI Thumb er en PHP-klasse eller et bibliotek som fungerer som en on-the-fly bilde resizer / cropper / gråtoner / colorizer / opacitor for WordPress utviklet av Benjamin Intal.
1. Last ned BFI-tommelen fra GitHub og lagre den i temaets rotkatalog.
2. Inkluder i temaet ditt ved å legge til følgende linje i din functions.php fil:
3. Bruk følgende funksjon hvor du vil vise bildet ditt i egendefinert størrelse:
400, 'høyde' => 300); bfi_thumb ("URL-to-image.jpg", $ params); ?> Hvis du ser på funksjonen ovenfor ( bfi_thumb () ), vil du legge merke til at det tar URL-adressen til bildet som skal endres som en første parameter, etterfulgt av de andre parameterne (bildedimensjoner). Så du må spørre deg selv, hvordan bestemmer vi nettadressen til vår innleggsminiatyr?
For å bestemme nettadressen til et innleggsminiatyr, bruker vi en funksjon som kalles wp_get_attachment_image_src () som tar vedleggs-ID, størrelse og et valgfritt ikon som parametere.
Så vi passerer get_post_thumbnail_id () fungere som den første parameteren. Det tar Post-ID som en parameter og returnerer ID av det fremhevede bildet som er festet til innlegget.
Den andre parameteren er størrelse som kan være enten et strengordord (miniatyr, medium, stort eller fullt), noen egendefinerte bildestørrelser du har lagt til ved hjelp av add_image_size () funksjon eller en topunkts-array som representerer bredde og høyde i piksler. Men for å sikre at bildet vårt på tilpasset størrelse har den høyeste kvaliteten, bruker vi den opprinnelige størrelsen - full.
Nå må vår kode se slik ut:
400, 'høyde' => 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 () returnerer et ordnet utvalg med verdier som svarer til (0) url, (1) bredde, (2) høyde og (3) skala for et bildevedlegg (eller et ikon som representerer et vedlegg).
Men vi er bare interessert i den første returnerte parameteren - the URL. Vi sender det til bfi_thumb () funksjon, sammen med våre andre parametere (bredde og høyde) for å få vårt tilpassede bilde.
Fordi vi sannsynligvis vil bruke denne koden igjen og igjen i vårt tema - eller temaer - la vi pakke det opp i en funksjon.
$ 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); return $ custom_img_src;?>
Lagre denne filen til din functions.php fil.
For bilder:
Eller for bakgrunnsbilder:
...
Egendefinerte bilder som er opprettet på-fly med et bibliotek som BFI Thumb, har følgende fordeler i forhold til egendefinerte miniatyrer opprettet / lagt til ved hjelp av add_image_size () funksjon:
;?>)
the_post_thumbail () funksjoner ekko ut et bildemerke. Noen ganger er det du vil ha bildets URL. Et eksempel er hvor du vil bruke bildet som bakgrunn.add_image_size () gjelder ikke for eldre bilder som ble lastet opp før bildestørrelsen ble registrertI dette raske tipset så vi på utvalgte bilder - hva de er og hvordan vi kan bruke dem i våre temaer. Vi så også på add_image_size () funksjon for å se hvordan vi kan bruke den til å legge til egendefinerte bildestørrelser når et bilde lastes opp i mediebiblioteket.
Vi introduserte BFI THumb PHP biblioteket og illustrert hvordan vi kan bruke den til å lage et egendefinert størrelse bilde fra et innlegg miniatyrbilde eller utvalgt bilde.
Vi så på begrensningene ved bruk av add_image_size () å skape tilpassede bildestørrelser og fordelene som BFI Thumb har over det.
Legg denne funksjonen til din functions.php fil og bruk den når du trenger å lage et egendefinert bilde fra en miniatyrbilde.
