Den komplette guiden til utvalgte miniatyrbilder og bildestørrelser i WordPress

Et bilde er verdt tusen ord - med mindre det er blitt endret på feil måte, i så fall er det verdt negativt ett hundre ord. Okay - så kanskje det er en mindre kjent versjon av et gammelt ordtak eller noe jeg bare har gjort opp, men poenget er: WordPress er veldig kraftig når det gjelder miniatyrer og bildestørrelser - du trenger bare å vite hvordan du skal håndtere dem. Les videre for alt du trenger å vite om bildestørrelser i WordPress og administrering av kjente bilder.

Merk: dette innlegget er ganske tungt med PHP - ingenting er for komplisert, men du vil kanskje lese vår gratis PHP-krasjbane før du prøver noen endringer på temaet ditt.

Grunnleggende først

I WordPress admin-dashbordet vet du sannsynligvis allerede innstillinger -> Media.

Dette er de tre standardbildestørrelsene, som WordPress samtaler: thumbnail, medium, og stor. Miniatyrstørrelsen har en spesiell innstilling som skal beskjæres med den nøyaktige dimensjonen du angir her. Dette trenger ikke å være en 1: 1-dimensjon - du kan angi det uansett - men bildene vil bli sentrert og beskåret, noe som betyr at en del av bildet ditt som ikke passer disse dimensjonene etter å være nedskalert, vil bare bli kuttet ut.

Den middels og store innstillingen fungerer litt annerledes, ved at du spesifiserer maksimum dimensjoner for både bredde og høyde, og bildene skaleres ned tilsvarende. Hvis bildet er for lite, vil disse bildestørrelsene ganske enkelt ikke bli opprettet. Når du laster opp et nytt bilde, blir originalen lagret og tilgjengelig for å sette inn i et innlegg i full størrelse, og de andre registrerte bildestørrelsene blir automatisk opprettet.

Disse tre bildestørrelsene, samt originalen full størrelse, er de eneste tilgjengelige når du redigerer et innlegg og legger inn medier, så jeg pleier å sette stor som den absolutte bredden av temaet mitt for sidebredder og innlegg i full bredde, og medium som bredden på den typiske innholdskolonnen.

Å gjøre flere størrelser

Når du redigerer tema eller lager widgets, er de tre størrelsene som er definert i medieinnstillingene, kanskje ikke nok. Jeg forlater alltid disse alene for innhold - definer deretter noen nye bildestørrelser i functions.php fil, slik:

add_image_size ('min-miniatyrbildet', 400, 200, sant);

Hver ny bildestørrelse trenger et navn, bredde og høyde dimensjoner, og om bilder skal beskjæres til akkurat denne størrelsen (sant eller usant). For strukturelle deler av et tema eller en widget, vil du generelt ønske å beskjære, slik at den ikke bryter opp layoutet.

Utvalgte bilder

Siden versjon 2.9 har WordPress tillatt oss å sette et bestemt bilde som “kjennetegnet bilde” for et innlegg. Dette bildet er ikke satt inn i postens kropp (med mindre du setter det selv inn), men i stedet kan brukes strukturelt gjennom temaet ditt - som et miniatyr ved siden av posttittelen, eller kanskje i overskriften når du ser det aktuelle innlegget. Ikke inkludert et kjennetegnet bilde, bare virker lat når mange temaer og widgets stole på dem - lim inn denne koden i functions.php for å minne deg om når du lagrer et innlegg hvis du har glemt å angi en (kilde):

 add_action ('save_post', 'wpds_check_thumbnail'); add_action ('admin_notices', 'wpds_thumbnail_error'); funksjon wpds_check_thumbnail ($ post_id) // endre til hvilken som helst egendefinert innleggstype hvis (get_post_type ($ post_id)! = 'post') returnere; hvis (! har_post_tumbnail ($ post_id)) // angi en forbigående for å vise brukerne en admin melding set_transient ("has_post_thumbnail", "no"); // avkople denne funksjonen slik at den ikke løser uendelig remove_action ('save_post', 'wpds_check_thumbnail'); // oppdatere innlegget sett det til utkast wp_update_post (array ('ID' => $ post_id, 'post_status' => 'utkast')); add_action ('save_post', 'wpds_check_thumbnail');  annet delete_transient ("has_post_thumbnail");  funksjon wpds_thumbnail_error () // kontroller om forbigående er satt, og vis feilmeldingen hvis (get_transient ("has_post_thumbnail") == "no") echo "
Du må velge Utvalgt bilde. Innlegget ditt er lagret, men det kan ikke publiseres.
"; delete_transient (" has_post_thumbnail ");

WordPress gir en praktisk funksjon for å få det kjente bildet og bruke det i temaer:

the_post_thumbnail ( 'min-miniatyr', array ( 'klasse' => 'my_post_thumbnail_css_class'));

Funksjonen tar 2 parametere: den navngitte størrelsen du leter etter, og eventuelle attributter du vil passere inn, som en egendefinert CSS-klasse (Merk: Du kan ikke overstyre alt-attributtet). Hvis du endrer et virkelig gammelt tema, kan du også legge til følgende i dine funksjoner.php:

add_theme_support ( 'post-miniatyr');

Hvis du heller vil bare få den faktiske nettadressen til det kjente bildet i stedet for å sende den nødvendige HTML-en, kan du prøve dette i stedet (får den midtre bildestørrelsen i dette eksemplet):

$ thumbnail = wp_get_attachment_image_src (get_post_thumbnail_id (), 'medium'); ekko $ miniatyrbilde [0];

Regenerere bilder

Når du endrer standardbildestørrelser eller oppretter en ny størrelsesdefinisjon, gjelder den bare for ny opplastinger. Alle dine eksisterende bilder forblir som de opprinnelige dimensjonene. Ikke vær redd skjønt, det er et flott plugin som vil gå tilbake gjennom innleggene dine og regenerere disse nye bildestørrelsene for deg. AJAX Thumbnail Rebuild lar deg velge hvilke størrelser som skal regenerere, og vil sakte fungere gjennom arkivet ditt. Dette vil ikke endre størrelsen på bilder som er lagt inn i innlegg - de er festet ved innsettingspunktet. Regenerering av bilder vil gjøre den nye størrelsen tilgjengelig for bruk i dine temaer eller i fremtidige innlegg, men du kan ikke automatisk redigere størrelsen på eksisterende bilder som allerede er satt inn.

Du finner to ulemper for å lage nye bilder. For det første, selv om bildestørrelsen du har laget, bare brukes til det kjente bildet som en del av et tema, opprettes en ny versjon av hvert enkelt bilde du noensinne har lastet opp - ikke bare det kjente bildet. Dette er en begrensning av WordPress; et kjennetegnet bilde er akkurat som alle andre, og du kan ikke spesifikt målrette det med add_image_size () funksjon. Heldigvis lar Thumbnail Rebuild-plugin deg faktisk begrense dette til bare kjente bilder fra arkivet - men alle fremtidige bildeopplastinger blir administrert av WordPress, og det vil skape den nye bildestørrelsen for alt. Nå vil det være en flott tid å også lære forskjellen mellom JPG og PNG. Know When to Use Hvilket filformat: PNG vs. JPG, DOC vs. PDF, MP3 vs. FLAC Vet når du skal bruke hvilket filformat: PNG vs. JPG, DOC vs PDF, MP3 vs. FLAC Vet du forskjellene mellom JPG og PNG, eller MP3 og FLAC? Hvis du ikke vet hvilke filformater som skal brukes, la oss veilede deg gjennom sine forskjeller. Les mer så du vet at du bruker det optimale formatet i fremtiden.

For det andre, selv om du ikke lenger bruker en viss størrelse, forblir de på serveren - WordPress vil ikke slette ubrukte bilder for deg. På et nettsted som MakeUseOf med hundretusener av bilder, betyr dette et par gigabyte bortkastet. For mindre nettsteder hjelper Image Cleanup-plugin ved å skanne og gir deg muligheten til å slette; men større nettsteder må lære litt kommandolinje og regex fu (se vår hurtige guide tilKomme i gang med Linux-kommandolinjen En rask guide for å komme i gang med Linux-kommandolinjen En rask guide for å komme i gang med Linux-kommandolinjen Du kan gjøre mange fantastiske ting med kommandoer på Linux, og det er egentlig ikke vanskelig å lære. Les mer ). Ta alltid en full backup først, bare hvis det sletter noe det ikke burde ha.

Temaet mitt endres ikke

Så du har redigert et tema med de nye bildestørrelsene, og riktig regenerert alle eksisterende kjente bilder - men den riktige størrelsen vises fortsatt ikke? Du har sikkert fått noen CSS brukt på bildet, eller det er rundt DIV da. Bruk nettleserens feilsøkingsmodus Finn ut nettsideproblemer med Chrome Developer Tools eller Firebug Finn ut websideproblemer med Chrome Developer Tools eller Firebug Hvis du har fulgt mine jQuery-opplæringsprogrammer så langt, kan det hende du allerede har kjørt inn noen kodeproblemer og ikke vet hvordan å fikse dem. Når du står overfor en ikke-funksjonell bit av kode, er det veldig ... Les mer for å finne den fornærmende CSS og tweak tilsvarende. Og husk, du kan bare endre størrelsen hvis kildebildet er stort nok - WordPress og generering av miniatyrplugin vil ikke oppskalere bilder på grunn av tap av kvalitet.

WordPress er nesten 11 år gammel, så det er et bevis på sin kraft og fleksibilitet at det er en av de få webappene som har blitt holdt i live så lenge og ikke erstattet. Funksjoner som post miniatyrer er nå allestedsnærværende på nettet, og for sin kreditt har WordPress alltid holdt opp med designtrender. Tenk deg, Ghost ser bra ut på Wordpress Killer? Velkommen til Ghost (og hvordan du installerer den på en Raspberry Pi) Wordpress Killer? Velkommen til Ghost (og hvordan du installerer den på en Raspberry Pi) Les mer .

Har du problemer med kjente bilder? Legg inn i kommentarene og jeg vil se om jeg kan hjelpe deg.

Utforsk mer om: Wordpress.