Hur man anpassar typografi och layout på Divi

ens Blair Jersyer | Divi

För att börja anpassa layouten och typografin för din webbplats, måste du först komma åt Theme Customizer genom att klicka på länken Divi> Theme Customizer på din WordPress-instrumentpanel. Detta startar anpassaren. Leta sedan efter panelen "Allmänna inställningar". Klicka på panelen för att öppna lämpliga inställningar och börja anpassa. I panelen "Allmänna inställningar" märker du tre avsnitt: Layoutinställningar, typografi och bakgrund.

allmänna parametrar divi.png

Layoutinställningar

Layoutpanelen låter dig justera olika storlekar och avståndsalternativ för din webbplats. Här kan du öka eller minska avståndet mellan kolumner, rader och sektioner och justera storleken på sidofältet. Du kan också aktivera Boxed Layout-läge från den här panelen.

layout parameter.png

Aktivera häckningslayout

Här kan du redigera din webbplats till ett rutaformat som inramar innehållet på din webbplats och exponerar en bakgrund som kan anpassas.

Bredd av innehållet på webbplatsen

Det är här du kan ställa in den maximala bredden för ditt innehållssnitt. Eftersom ditt innehåll har en responsiv layout kommer det att anpassas till mindre storlekar men kommer inte att utvidgas mer än den maximala bredden som anges här.
Standard är 1080px. Det är en bra bredd för de flesta vanliga bärbara datorer och stationära datorer.

Kolumnavstånd på webbplatsen

Rännans bredd är mängden horisontellt utrymme (marginal) mellan kolumnerna i varje rad.

Valfria värden för rännbredden ligger mellan 1 och 4.

1 representerar nollmarginalen mellan kolumnerna.
2 representerar en marginal på 3% mellan kolumnerna.
3 representerar en marginal på 5,5% mellan kolumnerna.
4 representerar en marginal på 8% mellan kolumnerna.

divi.png konfiguration

Använd anpassad sidofältbredd

Detta ställer in standard sidofältets bredd för ditt tema. Detta gäller för alla sidor i ditt tema som har en sidofält och som inte skapas med Divi Builder.

Sektionshöjd & linje

Dessa alternativ justerar mängden vertikalt avstånd (övre och nedre stoppning) för varje sektion och rad.

Tema accent färg

Innan du börjar ändra färgerna på dina andra element måste du först ändra det. När du har ändrat det, spara och publicera dina inställningar och uppdatera din sida. Nu borde det uppdaterade Accent Color-temat ha fyllt i andra element automatiskt.

typografi

Typografipanelen är där du kan justera standardutseendet på text över hela din text webbplats. Du kan justera storleken på ditt teckensnitt och rubriker, vilket kommer att återspeglas i alla delar av webbplatsen proportionellt. Du kan justera deras färger samt linjehöjd, bokstavsavstånd och teckensnitt. Slutligen kan du också välja mellan dussintals teckensnitt att tillämpa på varje.

typografi på divi.png

Kroppstextstorlek

Detta ändrar standardtext för ditt tema. Standardstorleken är 14 pixlar.

Höjd på kroppslinjen

Linjens höjd på varje textrad.

Rubriktextstorlek

Med Divi kan du ställa in standardtextstorlek för rubriken här. Detta påverkar Divi-element som titlar för Fullwidth-rubrikmodul.

Rubrikbokstavsutrymme

Bokstavsavstånd justerar det horisontella utrymmet mellan bokstäverna. Avståndet mellan rubrikbokstäverna påverkar alla rubriknivåer (h1, h2, h3, h4, h5, h6), citat och bildtitlar.

Rubrikrad Höjd

Precis som bokstavsavståndet påverkar rubrikens radhöjdvärde alla rubriknivåer (h1, h2, h3, h4, h5, h6), citat och titlar av bilder.

Polisstil

Använd dessa alternativ för att ändra teckensnittet för dina rubriker.

Kropps- och rubrikteckensnitt

Standardteckensnittet i Divi är Open Sans, men Divi har nästan hundra typsnitt att välja mellan! Dra nytta av dessa inbyggda teckensnitt och testa vilka som passar bäst för ditt tema.

Färg på kroppslänkar

Kroppslänkens färg ärvs från ditt temas accentfärg. Men du kan alltid ändra det här.

Kroppstextfärg

Här kan du ändra färgen på din kroppstext.

Rubriktextfärg

Här kan du ändra färg på dina rubriker.

Bakgrund

Bakgrundspanelen låter dig justera tematets bakgrundsfärg, samt ladda upp en anpassad bakgrundsbild och justera dess placering på sidan. Bakgrundsbilder och färger fungerar bra när de är ihopkopplade med inställningen Boxed Formatting i panelen Layouts som nämnts tidigare.

gör divi.png

Det är allt för den här handledningen, jag hoppas att den kommer att tillåta dig att bättre justera teckensnittet och layouten på Divi-tema.
[vc_row center_row=”yes”][vc_column width=”1/2″][vcex_button target=”blank” layout=”expanded” align=”center” font_family=”Raleway” font_weight=”700″ style=”platt” custom_background=”#18b69d” custom_hover_background=”#118d7a” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]LADDA NED DIVI TEMA [/vcex_button][/vc_column 1 ][vc_column] /2″][vcex_button url=”https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&url=40632&tid1=tutorials” target=”blank” layout=”expanded” align=”center” font_family = ”Raleway” font_weight=”700″ style=”flat” custom_background=”#c4226e” custom_hover_background=”#8d184f” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]LADDA NED DEN TEMPLATES DIVI[/vcex_button][/vc_column][/vc_row]

Andra Divi tutorials

Poster le commentaire

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade *

Den här webbplatsen använder Akismet för att minska oönskade. Läs mer om hur dina kommentarer data används.