Med Divi er til og med blogger en modul og "bloggen" din kan plasseres hvor som helst på din nettstedet Web og i forskjellige formater. Du kan kombinere blogg- og sidefeltmoduler for å lage klassiske bloggdesign. 1 kolonne, 2 kolonne eller 3 kolonne kan opprettes ved hjelp av blogg og sidefeltmodul.

Slik legger du til en bloggmodul på siden din

Før du kan legge til en bloggmodul på siden din, må du først få tilgang til Divi Builder. Først når Divi-tema installert på din nettstedet Web, vil du legge merke til en knapp Bruk Divi Builder over innleggsredigereren når du oppretter en ny side. Ved å klikke på denne knappen kan du aktivere Divi Builder, som gir deg tilgang til alle Divi Builder-modulene. Klikk deretter på knappen Bruk Visual Builder for å starte generatoren i visuell modus. Du kan også klikke på knappen Bruk Visual Builder når du surfer på din nettstedet Web oppstrøms hvis du er logget på WordPress-dashbordet.

Når du har inngått Visual Builder, kan du klikke på den grå pluss-knappen for å legge til en ny modul på siden din. Nye moduler kan bare legges til innenfor rader. Hvis du starter en ny side, ikke glem å legge til en rad på siden din først. Vi har gode veiledninger om bruk av elementene i linjer og seksjoner av Divi.

Finn bloggmodulen i listen over moduler, og klikk på den for å legge den til siden din. Listen over moduler er søkbar, noe som betyr at du også kan skrive ordet "blogg" og deretter klikke enter for automatisk å finne og legge til bloggmodulen! Når modulen er lagt til, vil du bli møtt med listen over modulalternativer. Disse alternativene er delt inn i tre hovedgrupper: Innhold , Conception et avansert .

Bruk tilfelle av bloggmodulen med et rutenettoppsett i en spesialisert seksjon med høyre sidefelt

For dette eksemplet vil jeg legge til en bloggmodul på en bloggside. Denne bloggsiden har en full overskrift med en søkemodul nedenfor. Under søkemodulen vil jeg legge til en spesialisert seksjon med bloggmodulen på venstre side og en sidefeltdel til høyre. Sidefeltet til høyre inneholder en nylig innleggsvidget, en e-postoptimodul og en personmodul.

Slik ser eksempelsiden ut.

Legg merke til at bloggmodulen er i et rutenettoppsett på venstre side av spesialdelen.

La oss begynne.

Bruk den visuelle byggherren til å legge til en spesialisert seksjon med følgende oppsett:

Du blir bedt om å legge til en kolonne eller en rad med to kolonner for venstre side. Velg kolonne rad 1.

Legg deretter bloggmodulen til linjen.

Oppdater blogginnstillingene som følger:

Innholdsalternativer

Innleggsnummer: 6
Lær mer Knapp: PÅ
Vis paginering: NEI
Grid bakgrunnsfarge: #ffffff

Designalternativer

Layout: Grid
Bruk Dropshadow: ON
Overleggsfargeikon: #ffffff
Hover Overlay Color: rgba (224,153,0,0.51) Header
politiet:
Skriftstørrelsesoverskrift: 21px
Topptekstfarge: # 333333
Bokstavavstand: 1px
Toppradens høyde: 1.2 em
Border: JA
Farge på grensen: # f0f0f0
Bredde på grensen: 1px
Border Style: Solid

Avanserte alternativer

Tilpasset CSS (Les mer-knappen):

farge: # e09900;
visningsblokk;
tekst-align: center;
margin-topp: 10px;
grense: 1px solid #ccc;
polstring: 5px;
Tekst Transformation: Kapitalisere;
brevavstand: 1px;

Den avanserte tilpassede CSS-knappen for Les mer-knappen skaper et tilpasset utseende som samsvarer med designen.

I den høyre sidefeltdelen av spesialiseringsdelens oppsett, må du legge til en sidefeltmodul som setter inn den siste innleggswidgeten. Nedenfor må du legge til en Optin-modul for e-post. Og så under Email Optin, må du legge til Person-modul med forfatterinformasjon.

Det er det!

Alternativer for blogginnhold

I kategorien Innhold finner du alle innholdselementene i modulen, for eksempel tekst, bilder og ikoner. Alt som styrer hva vises i modulen din vil alltid være i denne fanen.

Varenummer (Antall varer)

Angi antall meldinger du vil vise. Du må ha meldinger for alt som vises i denne modulen.

Velg kategoriene du vil inkludere i innleggsfeeden. Alle meldingskategoriene du opprettet, vises her, slik at du kan velge / oppheve valget.

Kategorier inkludert

Velg kategoriene du vil inkludere i strømmen.

Metadato-format

Angi datoformatet du vil vise på blogginnleggene dine her. Standardoppsettet er M j, Y-format (6. januar 2014) Se WordPress codex på datoformater for flere alternativer.

Innhold

Hvis du viser fullt innhold, blir ikke innleggene dine avkortet på indeksiden. Vis kodebit viser bare tekstutdraget ditt.

Offsetnummer

Velg antall meldinger du vil motregne. Hvis du for eksempel kompenserer med 3 innlegg, vises ikke de første tre innleggene i bloggstrømmen.

Vis utvalgt bilde

Dette alternativet lar deg velge om du vil at miniatyrbilder skal vises i bloggen din.

Les mer knappen

Her kan du stille inn om du vil vise "les mer" -linken etter kodebiten eller ikke.

Vis forfatter

Velg om du vil vise forfatteren av hvert blogginnlegg i post-metafeltet under innleggets tittel.

Vis dato

Velg om du vil vise datoen hver artikkel ble opprettet i delen Metamasse under meldingen.

Vis kategorier

Velg om postkategoriene skal vises i metamarkedet under publikasjonstittelen eller ikke.

Vis antall kommentarer

Velg om du vil vise antall kommentarer i metaboksen for innlegget under tittelen på innlegget.

Se paginering

Velg om du vil vise paginering for denne feeden eller ikke. For å aktivere nummerert personsøking, må du installere plugin-modulen WP Page Navi .

Administrasjonsmerke

Dette vil endre moduletiketten i generatoren for enkel identifisering. Når du bruker WireFrame-visningen i Visual Builder, vil disse etikettene vises i modulblokken i Divi Builder-grensesnittet.

Blog design alternativer

I kategorien Design finner du alle modulstilvalgene, for eksempel skrifter, farger, størrelse og avstand. Denne kategorien lar deg endre utseendet til modulen din. Hver Divi-modul har en lang liste over designinnstillinger som du kan bruke til å tilpasse omtrent hva som helst.

Disposisjon

Du kan velge å vise blogginnleggene dine i et rutenett eller i full bredde.

Overlagret bilde

Hvis dette alternativet er aktivert, vises en farge og et overleggsikon når en besøkende svever over det valgte bildet av en melding.

Overleggsikonfarge

Her kan du angi en egendefinert farge for overleggsikonet.

Dekselfarge svever

Her kan du definere en tilpasset farge for overlegget.

Hover Icon Picker

Her kan du definere et tilpasset ikon for overlegget.

Tekstfarge

Si bloggen din er plassert på en lys bakgrunn, skal tekstfargen settes til "Mørk". Visa, ja bloggen din er plassert på en mørk bakgrunn, skal tekstfargen settes til "Lys".

Topptekst

Du kan endre skrifttypen til overskriften ved å velge ønsket skrift fra rullegardinmenyen. Divi kommer med dusinvis av fantastiske skrifttyper drevet av Google Fonts. Som standard bruker Divi Open Sans-skrift for all teksten på siden din. Du kan også tilpasse stilen på teksten din ved å bruke fete, kursive, store og understrekede alternativer.

Topptekststørrelse

Her kan du justere størrelsen på overskriftsteksten. Du kan dra intervallglidebryteren for å øke eller redusere størrelsen på teksten, eller du kan angi ønsket tekststørrelsesverdi direkte i inntastingsfeltet til høyre for glidebryteren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Topptekstfarge

Som standard vises alle tekstfarger i Divi i hvit eller mørk grå. Hvis du vil endre fargen på toppteksten din, velger du fargen du ønsker fra fargevelgeren ved hjelp av dette alternativet.

Avstand mellom topptekster

Bokstavavstand påvirker avstanden mellom hver bokstav. Hvis du vil øke mellomrommet mellom hver bokstav i overskriftsteksten, bruker du intervallglidebryteren for å justere mellomrommet eller angir størrelsen på mellomrommet du vil ha i inntastingsfeltet til høyre for glidebryteren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Toppradens høyde

Radhøyde påvirker mellomrommet mellom hver rad i overskriftsteksten. Hvis du vil øke mellomrommet mellom hver rad, bruker du glidebryteren for å justere mellomrom eller angir ønsket avstandsstørrelse i inntastingsfeltet til høyre for markøren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Kropps skrifttype

Du kan endre kroppsfonten din ved å velge din foretrukne font fra rullegardinmenyen. Divi kommer med dusinvis av fantastiske skrifttyper drevet av Google Fonts. Som standard bruker Divi Open Sans-skrift for all teksten på siden din. Du kan også tilpasse stilen på teksten din ved å bruke fete, kursive, store og understrekede alternativer.

Kropp skriftstørrelse

Her kan du justere størrelsen på kroppsteksten. Du kan dra intervallglidebryteren for å øke eller redusere størrelsen på teksten, eller du kan angi ønsket tekststørrelsesverdi direkte i inntastingsfeltet til høyre for glidebryteren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Kropps tekstfarge

Som standard vises alle tekstfarger i Divi i hvit eller mørk grå. Hvis du vil endre fargen på kroppsteksten, velger du ønsket farge fra fargevelgeren ved hjelp av dette alternativet.

Spacing av kropps bokstaver

Bokstavavstand påvirker avstanden mellom hver bokstav. Hvis du vil øke mellomrommet mellom hver bokstav i brødteksten, bruker du intervallglidebryteren for å justere mellomrom eller angir størrelsen på avstanden du vil ha i inntastingsfeltet til høyre for glidebryteren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Høyde på kroppslinjen

Linjehøyde påvirker mellomrommet mellom hver linje med brødtekst. Hvis du vil øke mellomrommet mellom hver linje, kan du bruke intervallglidebryteren til å justere mellomrommet eller angi ønsket plassstørrelse i inndatafeltet til høyre for glidebryteren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Metas font

Du kan endre skrifttypen til metateksten ved å velge ønsket skrift fra rullegardinmenyen. Divi kommer med dusinvis av fantastiske skrifttyper drevet av Google Fonts. Som standard bruker Divi Open Sans-skrift for all teksten på siden din. Du kan også tilpasse stilen på teksten din ved å bruke fete, kursive, store og understrekede alternativer.

Metas skriftstørrelse

Her kan du justere størrelsen på metateksten. Du kan dra intervallglidebryteren for å øke eller redusere størrelsen på teksten, eller du kan angi ønsket tekststørrelsesverdi direkte i inntastingsfeltet til høyre for glidebryteren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Tekstfarge for meta

Som standard vises alle tekstfarger i Divi i hvit eller mørk grå. Hvis du vil endre fargen på metateksten din, velger du din foretrukne farge fra fargevelgeren ved hjelp av dette alternativet.

Avstand mellom metabrev

Bokstavavstand påvirker avstanden mellom hver bokstav. Hvis du vil øke mellomrommet mellom hver bokstav i metateksten, bruker du intervallglidebryteren for å justere mellomrom eller angir størrelsen på avstanden du vil ha i inndatafeltet til høyre for glidebryteren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Meta Line Høyde

Linjehøyde påvirker mellomrommet mellom hver linje i metateksten. Hvis du vil øke mellomrommet mellom hver linje, bruker du glidebryteren for å justere mellomrommet eller angir ønsket avstandsstørrelse i feltet til høyre for markøren. Inndatafeltene støtter forskjellige måleenheter, noe som betyr at du kan skrive inn "px" eller "em" avhengig av størrelsen for å endre enhetstypen.

Bruk grensen

Aktivering av dette alternativet vil plassere en ramme rundt modulen din. Denne rammen kan tilpasses ved hjelp av følgende betingede parametere.

Farge på grensen

Dette alternativet påvirker fargen på grensen din. Velg en egendefinert farge fra fargevelgeren for å bruke den på grensen din.

Bredde av grensen

Som standard er kantene 1 piksel brede. Du kan øke denne verdien ved å dra områdeglidebryteren eller angi en egendefinert verdi i inndatafeltet til høyre for glidebryteren. Støttede tilpassede måleenheter, som betyr at du kan endre standardenheten fra "px" til noe annet, f.eks. Em, vh, vw etc.

Border style

Kanter støtter åtte forskjellige stiler, inkludert: solid, prikket, prikket, dobbelt, spor, møne, innfelt og start. Velg stilen du vil ha fra rullegardinmenyen for å bruke den på grensen din.

Avanserte bloggalternativer

I kategorien Avansert finner du alternativer som mer erfarne webdesignere kan finne nyttige, for eksempel tilpassede CSS- og HTML-attributter. Her kan du bruke tilpasset CSS på alle modulens mange elementer. Du kan også bruke tilpassede CSS-klasser og ID-er til modulen, som kan brukes til å tilpasse modulen i barnets temas style.css-fil.

CSS ID

Skriv inn en valgfri CSS-ID som skal brukes til denne modulen. En identifikator kan brukes til å lage en tilpasset CSS-stil eller for å koble til bestemte deler av siden din.

CSS klasse

Skriv inn de valgfrie CSS-klassene som skal brukes for denne modulen. En CSS-klasse kan brukes til å lage tilpasset CSS-styling. Du kan legge til flere klasser, atskilt med et mellomrom. Disse timene kan brukes i din Divi-tema Underordnet eller i tilpasset CSS som du legger til på siden eller nettstedet ditt ved hjelp av Divi-temaalternativer eller Divi Builder-sideinnstillinger.

Tilpasset CSS

Tilpasset CSS kan også brukes på modulen og hvilket som helst av modulens interne elementer. I Custom CSS-delen finner du et tekstfelt der du kan legge til CSS direkte til hvert element. CSS-oppføringene i disse innstillingene er allerede innebygd med stilkoder. Så du må bare oppgi CSS-regler atskilt med semikolon.

synlighet

Dette alternativet lar deg kontrollere enhetene som modulen din vises på. Du kan velge å deaktivere modulen din på nettbrett, smarttelefoner eller stasjonære datamaskiner hver for seg. Dette er nyttig hvis du vil bruke forskjellige mods på forskjellige enheter, eller hvis du vil forenkle mobildesignet ved å eliminere visse elementer fra siden.

Det er det for denne opplæringen.