Nybörjarguide: Hur man centrerar en video i WordPress

När vi precis började med WordPress kunde något så enkelt som att centrera en video vara förvånansvärt frustrerande.

Efter att ha hjälpt många nybörjare via WPBeginner insåg vi att vi inte var ensamma – det är en av de vanligaste formateringsfrågorna vi får.

De goda nyheterna är att centrering av videor i WordPress har blivit mycket enklare, särskilt med blockredigeraren. Men vi ser fortfarande många som kämpar med detta, särskilt när de arbetar med inbäddade videor från YouTube eller Vimeo.

I den här nybörjarvänliga guiden visar vi dig de enklaste sätten att centrera dina videor i WordPress.

Varför centrera videor i WordPress?

Som standard justerar WordPress inbäddade eller uppladdade videor till vänster sida av innehållsområdet. Detta kan få sidan att se obalanserad ut, särskilt när videon är huvudfokus.

Att centrera videon åtgärdar detta och gör layouten renare och mer avsiktlig:

• Bättre visuell balans: Håller layouten jämn och undviker konstigt tomrum på ena sidan.
• Starkare fokus: Drar naturligt uppmärksamheten till videon som huvudobjektet på sidan.
• Förbättrad användarupplevelse: Gör att innehållet känns smidigare och lättare att följa.

Detta är en enkel ändring, men den kan märkbart förbättra hur din sida ser ut och känns.

Med det sagt, låt oss se hur du enkelt kan centrera en video på en WordPress-webbplats.

Vi kommer att täcka både blockredigeraren och den klassiska redigeraren, så du kan klicka på länkarna nedan för att hoppa till valfri sektion:

Hur man centrerar video i WordPress innehållsredigerare

För att centrera en video som bäddats in från YouTube eller Vimeo, är den enklaste metoden att helt enkelt klistra in dess URL direkt i WordPress innehållsredigerare.

WordPress kommer automatiskt att konvertera den till ett dedikerat videoblock.

Alternativt kan du lägga till ett videoblock eller ladda upp en video direkt till ditt WordPress mediebibliotek.

Välj sedan blocket Video och klicka sedan på alternativet ‘Ändra justering’. Från rullgardinsmenyn kan du välja videons position.

WordPress låter dig välja mellan följande justeringar, som var och en tjänar ett annat syfte för din videos visning:

• Bred bredd: Utökar videon bortom huvudkolumnen, men inte till hela skärmens kant. Detta alternativ kräver stöd från ditt WordPress-tema.
• Hela bredden: Sträcker ut videon över hela webbläsarfönstrets bredd. Liksom 'Bred bredd' beror detta också på ditt temas stöd.
• Justera vänster: Placerar videon till vänster sida av innehållsområdet. Detta är standardjusteringen för många block.
• Justera mitten: Placerar videon exakt i mitten av innehållsområdet, vilket skapar en tydlig fokuspunkt. Detta är alternativet vi fokuserar på i den här guiden!
• Justera höger: Placerar videon till höger sida av innehållsområdet.

Välj alternativet 'Justera i mitten'.

Därefter kan du förhandsgranska och publicera din sida eller ditt inlägg.

Videon kommer nu att vara centrerad.

Du kan dock behöva använda hela inbäddningskoden om du vill lägga till speciella uppspelningsalternativ (som att starta videon vid en specifik tidpunkt) eller om du använder en videoplattform som WordPress inte automatiskt bäddar in.

Om du redan har ett videoblock (som YouTube eller Vimeo) och behöver lägga till anpassad kod, klicka på ikonen med tre prickar i blockets verktygsfält och välj 'Redigera som HTML'.

Om du bäddar in från en plattform som WordPress inte stöder automatiskt, lägger du först till ett Anpassat HTML-block och klistrar sedan in din inbäddningskod i det.

Därefter kan du ange följande HTML-kod runt videons inbäddningskod. Se till att använda korrekta HTML-kommentarer och ta bort eventuell kampanjtext i själva kodexemplet:

<div style="text-align:center;">

/// your video embed code goes here

</div>

Här är hur din inbäddningskod kommer att se ut med den anpassade HTML-koden:

Du kan nu spara dina ändringar och förhandsgranska inlägget eller sidan för att se din video perfekt centrerad.

Ett annat tillvägagångssätt är att manuellt öka bredden på din video så att den passar innehållsområdet. För att uppnå detta behöver du lägga till eller ändra parametern 'width' i din inbäddningskod:

<iframe width="760" height="315" src="https://www.youtube.com/embed/4YpyiJ05YOg" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Hur man centrerar video i den klassiska redigeraren

Om du använder den klassiska redigeraren kan du centrera videor genom att redigera ett inlägg eller skapa ett nytt.

När du är i redigeraren, byt till textvyn. Ange nu följande HTML-kod:

<div style="text-align:center;">

/// your video embed code goes here

</div>

Se bara till att ersätta ‘din videokod för inbäddning kommer här’ med din videos inbäddningskod.

När det är gjort kommer det att se ut ungefär så här:

Du kan nu förhandsgranska och publicera din sida.

Besök helt enkelt din webbplats för att se den centrerade videon.

Vanliga frågor om centrering av videor

Här är några frågor som våra läsare ofta ställer om centrering av videor i WordPress:

Varför ser jag inte alternativen 'Bred bredd' och 'Full bredd'?

Alternativen 'Bred bredd' och 'Full bredd' är funktioner som måste stödjas av ditt WordPress-tema. Om du inte ser dem i verktygsfältet för justering betyder det att ditt nuvarande tema inte har aktiverat dem. Du kommer fortfarande att kunna använda standardalternativet 'Centrera'.

Kommer centrering av min video att påverka hur den ser ut på mobila enheter?

Nej, att centrera en video med hjälp av standardverktygen i WordPress blockredigerare är helt responsivt. WordPress hanterar automatiskt skalningen för att säkerställa att din video ser bra ut på mindre skärmar som surfplattor och smartphones.

Kan jag centrera en video som jag laddat upp direkt till WordPress?

Ja. Processen är exakt densamma för både inbäddade videor och videor som du laddar upp direkt till ditt mediebibliotek. Välj helt enkelt Video-blocket och använd verktygsfältet för justering för att centrera det.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du centrerar en video i WordPress. Du kanske också vill se vår guide om hur du lägger till specialtecken i WordPress-inlägg och viktiga tips för att använda kortkoder i WordPress.

Om du gillade den här artikeln, prenumerera gärna på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.