Sådan tilføjes billeder i ordtryk i 2022en Tutorial i Tilføjelse af billeder i klassiske og Gutenberg redaktører (+ reduktion af Filstørrelse)

i dag bryder vi ned, hvordan du tilføjer billeder i ordtryk og reducerer deres Filstørrelse (for at holde dine sider & indlæg indlæses så hurtigt som muligt).

når du bare lærer fundamentet for, hvordan du starter en blog, er der meget at finde ud af, jeg får det. Vi har talt om, hvordan man ændrer skriftstørrelse, ændrer skriftfarve, opretter et klikbart link og så meget mere her.

den gode nyhed er, at det i 2022 er meget nemt at lære at tilføje billeder med alle de brugervenlighedsopdateringer og forbedringer, de har set i løbet af det sidste årti.

i denne hurtige vejledning viser jeg dig, hvordan du tilføjer billeder i indlæg, både i den klassiske Editor (som jeg foretrækker at bruge) og gennem deres nyere Gutenberg Editor.

lad os nu dykke ned i at tilføje billeder til dine indlæg—samtidig med at deres Filstørrelse reduceres så meget som muligt, for at holde sig i overensstemmelse med SEO ‘ s bedste praksis og for at holde dine sider indlæst så hurtigt som muligt.

Sådan tilføjes billeder 2022

1. Tilføj billeder til indlæg i den klassiske teksteditor
2. Tilføj billeder til indlæg i Gutenberg teksteditor
3. Tilføj et fremhævet billede til et indlæg i teksteditor

nu hurtigt, før vi dykker ned i denne tutorial om tilføjelse af billeder til teksteditor, vil jeg vise dig, hvordan du reducerer et billedes Filstørrelse (hjælper dine indlæg indlæses hurtigere) i 2 nemme trin.

Installer (gratis) komprimere JPEG & PNG-billeder Plugin af Tiny PNG

du kan hente den gratis komprimere JPEG & PNG-billeder Plugin til lige her fra plugin bibliotek.

Alternativt kan du også søge efter pluginet og installere det direkte inde i din plugin-menu, der er tilgængelig i venstre side af din blogadministratorsektion her—eller tjek denne hurtige tutorial om, hvordan du installerer et plugin:

når du har installeret Compress JPEG & PNG Images Plugin, bliver hvert nyt billede, du uploader til din blog automatisk optimeret, og filstørrelsen reduceres så meget som muligt uden at gå på kompromis med kvaliteten af dit billede.

Bemærk: Dette er langt det bedste billedkomprimeringsplugin på markedet. Det giver op til 500 gratis billedkompressioner om måneden (hvilket er meget mere, end du sandsynligvis har brug for), før du skal opgradere til en betalt plan på $.009 / billede ud over din første 500 hver måned. Det er en seriøs handel, og du finder ikke et bedre komprimeringsplugin, der giver dig flere gratis kreditter.

men hvis du vil udføre billedkomprimering direkte på din egen computer (ubegrænset gratis), anbefaler jeg ImageOptim-applikationen.

Upload dine billeder

det er det! Helt seriøst, det er så nemt.

når du har installeret komprimeringspluginet på din blog—eller først har komprimeret individuelle billeder på din computer—er du klar til at uploade dem til dine indlæg eller sider.

nu, lad os grave i præcis, hvordan du tilføjer billeder til ordtryk.

1. Tilføj billeder til indlæg i den klassiske Editor

hvis du er ligesom mig og stadig foretrækker det klassiske layout til at tilføje/redigere dine indlæg, så følg med her.

på den anden side, hvis du bruger den nyere Gutenberg Editor til dit indlæg indhold, så spring ned til næste afsnit for at gennemgå. Hvis du ikke er sikker på, hvilken editor du bruger, skal du kigge på billedskærmbillederne nedenfor her og sammenligne dem med, hvordan din editor ser ud. Vil du bruge den klassiske Editor, men ikke sikker på, hvordan du får den? Brug 2 minutter på at følge Yoasts enkle vejledning om installation af den klassiske Editor på din blog.

1. Åbn det indlæg, du tilføjer billeder til (og Find det rigtige sted)

først skal du sørge for, at du er inde i det indlæg, du vil tilføje et billede til.

så vil du navigere din markør til det nøjagtige sted i dit indlæg, som du vil tilføje billedet.

2. Klik på knappen “Tilføj medier” øverst i din Editor

den knap vil se sådan ud lige her:

når du klikker på knappen “Tilføj medier”, får du vist skærmen, hvor du kan uploade din billedfil.

3. Klik på”Upload filer”

Klik på fanen for “Upload filer”, og du føres til skærmen, hvor du kan bruge vælgerværktøjet til at vælge en billedfil, hvorfra den er placeret på din computer.

Alternativt, hvis du trækker en billedfil fra dit skrivebord og uploader den—kan du springe over skærmen “Upload filer” og bare flytte direkte til at trække billedet ind og slippe det (der er en demo af dette i næste trin).

4. Upload din billedfil

jeg foretrækker at trække billedfiler fra mit skrivebord og slippe dem ind i filoverføreren (i stedet for at bruge vælgeren til at finde dem på min computer), da det er meget hurtigere.

her er en hurtig video/GIF demonstration af, hvordan du tilføjer et billede fra dit skrivebord til:

når du har uploadet dit billede, fungerer komprimeringspluginet det er magisk at hjælpe med at reducere filstørrelsen (bag kulisserne).

Bemærk: Før du afslutter dine billedindstillinger og klikker på “Indsæt i indlæg”, vil du gerne skrive en SEO—venlig Alt-tekst til dit billede-noget der beskriver arten af, hvad der foregår i dit billede, og ideelt set væve i et af de målnøgleord, du håber, at artiklen til sidst vil rangere for (i organiske søgeresultater).

5. Vælg dine billedindstillinger, og klik på “Indsæt i indlæg”

endelig har du et par muligheder for at definere for dit billede. Dette omfatter:

• styring af justeringen af, hvordan dit billede vises i dit indlæg (jeg vælger altid Centerjustering)
• Gør dit billede link til en anden side eller indlæg på din blog (eller et eksternt link, du vil lede læsere til)
• skærmstørrelse (jeg anbefaler altid at uploade som fuld størrelse for at undgå tab af billedkvalitet)

når du har valgt disse indstillinger, er du klar til at klikke på “Indsæt i indlæg”, og du er god til at gå!

denne knap vil være lige her i nederste højre hjørne af skærmen:

nu føres du tilbage til dit redigeringsvindue, og du kan se det billede, du lige har tilføjet, sidde lige der, hvor du uploadede det.

Husk, at du stadig har nogle hurtige & nemme redigeringsmuligheder, hvis du beslutter dig for at ændre noget med visningen af dit nye billede:

• du kan ændre størrelsen på det manuelt ved at gribe et af hjørnerne og trække det op eller ned i størrelse
• du kan klikke ned på midten af billedet og trække det rundt i dit indlæg for at placere det
• du kan altid slette billedet ved at klikke på “backspace” eller “Slet” på dit tastatur og starte forfra

og det er det! Du har lært, hvordan du tilføjer et billede til den klassiske Editor.

2. Tilføjelse af billeder til indlæg i Gutenberg Editor

i Gutenberg Editor vil dine indlæg redigeringsmuligheder se meget anderledes ud end hvad du vil se fra den klassiske Editor.

Gutenberg tager en tilgang til at tilføje/redigere indhold gennem et system af “blokke” som tekstblokke, headerblokke, billedblokke og så videre. Så lad os dykke ned i at tilføje billeder i Gutenberg.

1. Vælg ikonet ” Tilføj Billede “

når du har sørget for, at du tilføjer et billede på det rigtige sted i dit indlæg, skal du vælge ikonet” Tilføj Billede”. Det ser sådan ud lige her:

når du klikker på ikonet “Tilføj billede”, har du et par muligheder for, hvordan du kan tilføje et billede til dit indlæg.

2. Vælg, hvordan du tilføjer billedet

i Gutenberg har du et par hurtige muligheder for, hvordan du tilføjer et billede i ordtryk. Det omfatter:

• Upload (som åbner en vælgerskærm, der giver dig mulighed for at vælge billedfilen fra din computer)
• mediebibliotek (som fører dig til dit eksisterende billedbibliotek—hvorfra du også kan trække& drop i et billede)
• Indsæt fra URL (hvis der er et billede placeret et sted online, som du gerne vil importere, kan du indsætte det link her)

her er et øjebliksbillede af disse muligheder (personligt klikker jeg bare på “Upload” og griber hurtigt det billede, jeg vil have, fra mit skrivebord):

3. Upload dit billede

når du har valgt det billede, du vil uploade, skal du blot klikke på knappen “Åbn”, så tilføjes det til dit indlæg.

nu hvor du har tilføjet billedet, vises en mindre miniature af det som en ny blok i dit indlæg.

her er et skærmbillede af, hvordan det ser ud:

4. Billedindstillinger & hurtige redigeringsmuligheder

før du går videre, skal du ringe til dine billedindstillinger (som pr.

og ligesom med den klassiske Editor kan du definere mange forskellige indstillinger og egenskaber for et billede. Med Gutenberg er det bare gjort lidt anderledes. Dine billedindstillinger er i stedet placeret over på højre sidepanel (efter først at have klikket en gang på billedet).

Sådan ser disse indstillinger ud:

sørg for at definere dine Billedindstillinger for mindst disse to egenskaber:

• skrivning af SEO-venlig alternativ tekst, der beskriver billedet og væver i en søgeordssætning
• billedstørrelse (jeg viser altid billeder som fuld størrelse for at undgå tab af kvalitet)

du kan også klikke på” Style ” – indstillingerne for at tilføje nogle mere nuancerede styling & indbyggede beskæringsfunktioner med Gutenberg.

5. Flytning af billeder rundt i et indlæg via Gutenberg

en meget cool bivirkning af Gutenberg-Redaktørens fokus omkring at bruge “blokke” af indhold er, hvor nemt du kan flytte dine billeder (eller indholdsblokke for den sags skyld) rundt i et indlæg.

når du har klikket en gang på det billede, du vil omarrangere i dit indlæg—vil du se “op” og “ned” pile vises lige ved siden af billedet.

Klik på disse pile for at flytte dit billede op eller ned inde i dit indlæg, som så:

og det er det! Du er klar.

du har nu også lært, hvordan du tilføjer et billede til Gutenberg-editoren.

3.

fremhævede billeder er vigtige i en blog—fordi det er de billeder, der vises øverst i dine blogindlæg (og i både søgeresultater og på sociale medieplatforme, når dit indhold bliver delt).

sidst men ikke mindst, her er hvordan du tilføjer et fremhævet billede til et indlæg (eller en side).

nederst til højre i dit redigeringsvindue kan du se et afsnit for at tilføje et fremhævet billede. Klik på” Indstil fremhævet billede”, og du føres til standardbilledoverførselsskærmen, hvor du kan tilføje det billede, du vil have vist øverst i dit indlæg (også i søgeresultater og på sociale platforme).

når du har uploadet det billede, du vil bruge, og klikket på “Indstil fremhævet billede”, føres du tilbage til din redigeringsskærm, og du vil se en lille miniaturebillede af billedet vises nederst til højre (for at bekræfte, at du har tilføjet det rigtige billede) som sådan:

ret simpelt, ikke?

hvis du valgte det forkerte billede (eller vil foretage ændringer senere), kan du blot klikke på teksten “Fjern fremhævet billede”, og du har mulighed for at vælge eller uploade et andet billede, der skal vises i dit indlæg.

Endelige tanker om, hvordan du tilføjer et billede i ordtryk

tilføjelse af billeder til dine indlæg i ordtryk behøver ikke at være svært.

uanset om du bruger den klassiske Editor eller Gutenberg til din blog, har teamet bag arbejdet hårdt for at gøre tilføjelse af billeder til en meget nem proces.

hvis du stadig har problemer, så send mig en kommentar nederst i dette indlæg, og jeg er glad for at hjælpe dig med at fejlfinde eventuelle problemer, du har.

det er alt for i dag!

vi har lige dækket, hvordan man tilføjer billeder i ordtryk til venstre

ligesom hvad du ser? Tilmeld dig for at få flere blogging tutorials og rådgivning.

Vil Du Have Flere Blogging Tutorials?

gå over og tjek min ultimative guide til at starte en blog og tjene penge på den i år.