Nyheter i Android, Telefoner, Prylar Och Recensioner

Hur man ändrar blockhöjd och bredd i WordPress

Vill du ändra blockhöjd och bredd i WordPress?

Som standard gör WordPress det enkelt att skapa vackra innehållslayouter för dina inlägg och sidor med hjälp av block. Men ibland kanske du vill ändra storlek på blocken för att få dem att se bättre ut.

I den här artikeln kommer vi att visa dig hur du enkelt ändrar blockhöjd och bredd i WordPress.

Varför ändra blockhöjd och bredd i WordPress?

Blockredigeraren låter dig lägga till innehåll på din WordPress-webbplats med hjälp av olika block, inklusive titlar, stycken, bilder, videor, ljud och mer.

Men ibland kanske du vill ändra bredden eller höjden på ett specifikt block för att förbättra dess utseende eller layouten på det övergripande innehållet.

Justering av blockstorlekar kan också säkerställa att ditt innehåll är responsivt och visas korrekt på alla enheter, inklusive telefoner, surfplattor och bärbara datorer.

Du kan till exempel ha laddat upp en bild i innehållsredigeraren, men den är för stor och gör att sidan ser oattraktiv ut.

Eller kanske du vill ändra storlek på rubrikblocket för att bättre anpassas till innehållet.

Genom att justera bredd och höjd på blocken kan du få dina inlägg och sidor att se mer estetiskt tilltalande ut.

Med det sagt, låt oss se hur du enkelt kan ändra blockhöjd och bredd i WordPress.

Metod 1 – Ändra blockhöjd och bredd med blockinställningar

För den här metoden kommer vi att visa dig hur du ändrar höjden och bredden på ett block med standardinställningarna som WordPress erbjuder.

För närvarande erbjuder WordPress inte samma storleksändringsalternativ för alla block. Blockredigeraren erbjuder dock många sätt att ändra storlek på höjden och bredden på olika block.

Låt oss börja med bildblocket i WordPress.

Först kan du ändra justeringen av bildblocket genom att klicka på knappen ‘Justera’ i verktygsfältet ovanför blocket.

Om du här väljer alternativet ‘Bred bredd’ får blocket samma bredd som behållaren.

Eller så kommer justeringsalternativet ‘Full bredd’ att få blocket att fylla hela sidans bredd.

Du kan också ändra storleken på ett block genom att gå till panelen “Blockinställningar” till höger och rulla ner till avsnittet “Inställningar”. Härifrån kan du ändra storleken på ett block från rullgardinsmenyn “Bildstorlek”.

Du kan också justera blockets bredd och höjd genom att skriva din föredragna pixelstorlek i rutorna “Bredd” och “Höjd” i avsnittet “Bildmått”.

Under det kan du även justera blockstorleken i procent.

Ett annat sätt att ändra storlek på ett bildblock är att klicka på bilden för att visa en blå ram med cirkulära ankare.

Dra sedan helt enkelt dessa ankare för att ändra höjden och bredden på bildblocket.

När du är klar klickar du på “Uppdatera” eller “Publicera” för att lagra dina inställningar.

Relaterad  Google Chrome för Android: Funktioner och översikt

Metod 2 – Ändra blockhöjd och bredd med kolumnblock

Om blocket du vill ändra storlek på inte kommer med justeringsknappar eller storleksändringsinställningar, då är den här metoden för dig.

För denna metod kommer vi att placera vårt block i kolumnblocket. Den fungerar som en behållare där du kan lägga till block i varje kolumn. Du kan sedan ändra storlek på dessa block genom att justera höjden och bredden på kolumnerna.

Först måste du klicka på knappen “Lägg till block” (+) i det övre vänstra hörnet av skärmen.

Härifrån letar du helt enkelt upp och lägger till kolumnblocket i innehållsredigeraren. Du kommer sedan att bli ombedd att välja en variant.

Efter det kommer kolumnlayouten att visas på skärmen och nu kan du lägga till det block du vill ha genom att klicka på knappen ‘Lägg till block (+)’ i en kolumn.

När blocket har lagts till kan du ändra dess storlek med hjälp av ‘Kolumninställningar’ som finns i den högra panelen.

När du är klar klickar du bara på knappen “Publicera” för att lagra dina ändringar.

Så här såg innehållet ut på vår demowebbplats efter att ha ändrat storlek och justerat två styckeblock i ett tvåkolumnblock.

Metod 3: Ändra blockhöjd och bredd med hjälp av gruppblock

Du kan även justera blockens bredd och höjd med hjälp av gruppblocket. Det låter dig gruppera olika block och designa dem tillsammans.

Först måste du klicka på knappen “Lägg till block” (+) längst upp. Därefter måste du hitta och lägga till gruppblocket i innehållsredigeraren.

När du har gjort det kommer gruppblocket att visa tre olika layoutalternativ som du kan välja mellan. För den här handledningen kommer vi att använda layouten “Grupp”.

Därefter visas knappen “Lägg till block” på skärmen. Nu kan du lägga till vilket block du vill.

I den här handledningen kommer vi att lägga till och ändra storlek på ett rubrikblock, ett styckeblock och ett bildblock.

För att lägga till flera block i gruppen måste du klicka på knappen “Välj grupp” i blockverktygsfältet.

När gruppen har valts klickar du bara på knappen “Lägg till block” (+) längst ned.

Genom att klicka på knappen “Välj grupp” öppnas även blockinställningarna i den högra kolumnen. Härifrån kan du enkelt justera layouten, justeringen och orienteringen för alla block.

Att ändra layouten kommer också att ändra de olika blockstorlekarna. Du kan justera dessa inställningar tills du är nöjd med resultatet.

När du är klar klickar du på “Uppdatera” eller “Publicera” för att lagra dina inställningar.

Så här såg gruppblocket ut på vår demowebbplats.

Metod 4: Ändra blockhöjd med lockblock

Denna storleksändringsmetod är till för dig om du vill använda täckblocket. Låter dig visa text och annat innehåll ovanpå en bild eller video.

Relaterad  Få unika presenter för att förbeställa The Elder Scrolls Online: High Isle

Först måste du klicka på knappen “Lägg till block” (+) längst upp och hitta omslagsblocket.

När du har gjort det kommer du att bli ombedd att välja en färg eller ladda upp en bild från WordPress mediebibliotek. Denna bild eller färg kommer att användas som bakgrund för omslagsblocket.

Därefter drar och släpper du bara vilket block du vill på Cover-blocket.

Därefter måste du klicka på omslagsblocket för att öppna blockinställningarna i den högra kolumnen.

Härifrån bläddrar du ner till panelen “Dimensioner”, där du kan justera höjden på täckblocket med hjälp av pixlar.

Slutligen, glöm inte att klicka på knappen “Spara ändringar” för att spara dina inställningar.

För mer detaljerade instruktioner om hur du använder Cover Block, kanske du vill kolla in vår nybörjarguide om Cover Image vs Featured Image i WordPress Block Editor.

Bonus: Skapa vackra sidor med hjälp av avancerade block i SeedProd

Du kan enkelt skapa vackra och estetiskt tilltalande sidor med hjälp av SemillaProd plugg.

Det är den bästa WordPress-sidbyggaren på marknaden som låter dig skapa målsidor med hjälp av block. Dessa block är också mycket enkla att anpassa och ändra storlek efter dina behov.

Först måste du installera och aktivera SemillaProd plugg. För mer information kan du läsa vår guide om hur du installerar ett WordPress-plugin.

Notera: SeedProd erbjuder också en gratis versionmen vi kommer att använda premiumversionen för den här handledningen.

Vid tidpunkten för aktiveringen måste du gå till SeedProd » Konfiguration från din WordPress-instrumentpanel och skriv in licensnyckeln i rutan “Licensnyckel”.

Du kan hitta licensnyckeln på din kontosida på SeedProd-webbplatsen.

Därefter måste du besöka SeedProd » Målsidor skärmen från admin sidofältet för att börja skapa en målsida.

Härifrån klickar du helt enkelt på knappen “Lägg till ny målsida”.

Du kommer nu att tas till sidan “Välj en ny sidmall”. SeedProd erbjuder många fördesignade mallar som du kan välja mellan.

När du har valt en mall blir du ombedd att ange ett namn och en webbadress för din målsida.

När du lägger till dessa detaljer, klicka bara på knappen “Spara och börja redigera sidan” för att fortsätta.

Detta kommer att starta SeedProd dra och släpp sidbyggaren, där du nu kan börja redigera din sida.

För mer detaljerade instruktioner, se vår guide om hur du skapar en målsida med WordPress.

För den här handledningen kommer vi att lägga till och ändra storlek på ett bildblock och ett knappblock.

Först måste du dra bildblocket från blockpanelen till vänster och släppa det var du vill på sidan.

Relaterad  Spelvideo av free TCG Yu-Gi-Oh! Mästerduell

Klicka sedan på bildblocket för att öppna blockinställningarna i den vänstra kolumnen. Härifrån kan du ladda upp en bild från ditt mediebibliotek.

Du kan sedan ändra höjden och bredden på blocket med hjälp av pixlar eller procentsatser.

Du kan också justera bildstorlek och position genom att växla till fliken “Avancerat” högst upp på inställningspanelen.

Klicka sedan helt enkelt på panelen mellanrum för att utöka dina inställningar.

Här lägger du bara till värden för att justera blockets marginal och utfyllnad enligt dina behov.

Du kan justera marginalen och utfyllnaden för de övre, nedre, vänstra och högra områdena av blocket.

Med Seedprod kan du även lägga till ett distansblock mellan två olika block för att lämna lite utrymme mellan dem.

Först måste du hitta och lägga till “Spacer”-blocket från den vänstra kolumnen. Klicka sedan på den för att öppna dess inställningar.

Du kan nu styra höjden på distansen med skjutreglaget “Höjd”.

Distansblocket kan hjälpa dig att skapa en snygg webbplats.

Du kan också ändra bredd och höjd på andra block på samma sätt, inklusive video-, rubrik- och knappblocken.

Hitta helt enkelt knappblocket i den vänstra kolumnen och dra det till din sida.

Därefter måste du klicka på knappen för att öppna låsinställningarna.

Härifrån byter du till fliken “Avancerat” från toppen. Du kan ändra höjden på blocket genom att dra skjutreglaget “Vertikal utfyllnad”.

För att ändra bredden, dra skjutreglaget “Horisontell fyllning” i den vänstra kolumnen.

När du är klar, glöm inte att klicka på knappen “Spara”.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du ändrar blockbredd och höjd i WordPress. Du kanske också vill se vår artikel om hur du lägger till och justerar bilder i WordPress-blockredigeraren och våra toppval för WordPress-plugins som du måste ha för att få din webbplats att växa.