“Visual Mode”

Sidebyggeren er lettest å bruke i “Visual mode”, som lar deg bygge nettsiden din i “Front-end”.

Sidebyggeren kommer i to former, hvor den eneste forskjellen er brukergrensesnittet. Begge grensesnittene lar deg bygge nøyaktig samme type nettsteder med de samme innholdselementene og designinnstillingene. De 2 ulike brukergrensesnittene er:

1. Back-end byggeren som lever inne i WordPress-brukergrensensittet og erstatter WordPress sin mer tungvinte redigeringsfunksjonalitet. Back-end byggeren er begrenset av dashbordet og gjengis som en blokkbasert representasjon av nettstedet ditt.

2. Front-end byggeren “Visuell Bygger.” Det er det beste stedet å bygge nettsiden og gjøre endringer. Her ser du faktisk hjemmesiden din akkurat som den faktisk er, samtidig som du kan gjøre endringer og legge til innhold. Denne opplæringen vil ta utgangspunkt i at du benytter den visuelle sidebyggeren (Visual mode).

Visual mode lar deg bygge sidene dine på forsiden av nettstedet ditt! Det er en fantastisk opplevelse og gir mye raskere design. Når du legger til innhold eller justerer designinnstillinger i den visuelle byggmesteren, vises endringene dine umiddelbart. Du kan klikke på siden og bare begynne å skrive. Du kan markere tekst og justere skrift og stil. Du kan legge til nytt innhold, bygge siden din og se alt skje rett før øynene dine. Du slipper å kunne en eneste kode, og du kan enkelt eksperimentere deg frem og se hva som skjer direkte.

Aktivere Visuell Bygger

Mens du er logget på WordPress-dashbordet, kan du navigere til hvilken som helst side på forsiden av nettstedet ditt og klikke på “Aktiver Visuell Bygger” -knappen i WordPress-administyrelinjen for å starte den visuelle byggeren (se eksempel i bilde under)

Hvis du redigerer siden din i back-end, kan du bytte til den visuelle byggmesteren ved å klikke på “Aktiver Visuell Bygger” -knappen som sitter øverst på Divi Builder-grensesnittet i back-end.

Det grunnleggende i Visuell Bygger

Styrken i sidebyggeren ligger i dra og slipp funksjonaliten som lar deg enkelt kombinere og sette sammen ulike elementer.

Sidebyggeren bruker tre hoved byggeklosser: Seksjoner, rader og moduler. Ved å bruke disse i fellesskap kan du lage et ubegrenset utvalg av sidelayouter. Seksjoner er de største byggesteinene, og de inneholder grupper av rader. Rader sitter inne i seksjonene og modulene plasseres inne i radene. Dette er strukturen hele veien på alle sidene som blir bygget med sidebyggeren.

Før vi går nærmere innpå og forklarer i detalj de ulike byggesteinene skal du nå få et eksempel på hvordan du kan legge inn tekstlinjen “Velkommen til denne nettsiden” ved å bruke sidebyggeren:

1. Først må du logge inn på din hjemmeside. Dette gjør du ved å gå til login adressen som du mottok sammen med ditt brukernavn og passord. For å komme til login siden skriver du inn den vanlige adressen til hjemmesiden og legger til /login, så adressen blir for eksempel www.dinhjemmeside.no/login

2. Du blir deretter sendt til backend på din WordPress hjemmeside. Helt øverst vil du se valget “+Legg til”, når du holder musepekeren over dette valget vil du få opp flere valg. Her velger du “Legg til side”.

3. Skriv inn det du ønsker denne siden skal hete i feltet “Velg tittel”. I  vårt eksempel “Velkommen”. Deretter trykker du på den lilla knappen “Bruk Divi-byggeren”.

4. Trykk på den lyseblå knappen som heter “Bygg på frontenden”.

5. Du vil nå få 3 ulike valg – “Begynn å bygge”, “Velg layout”, “Velg bilde”. Du skal velge valget “Begynn å byggge”.

6. Du vil deretter få opp en boks med navnet “Sett inn rad”. Velg valget med ett grønt felt.

7. Nå vil du se boksen “Sett inn modul”. Her er det mange ulike moduler å velge blant. Scroll nedover og finn modulen “Tekst”.

8. Nå vil du få opp tekstmodulen hvor du kan skrive inn den teksten du ønsker. Når du er ferdig med å skrive så trykker du på den grønne haken ned til høyre i tekstmodul boksen.

9. For å lagre det du har gjort må du trykke på den runde lille knappen som er plassert i senter nedert på siden. Når du trykker på den lilla knappen vil du se at en grønn knapp med navnet “Publiser” vises helt nederst til høyre. Når du trykker på denne knappen så blir teksten du har lagt inn lagret og teksten er nå synlig på internett. Du har nå publisert en tekst uten å skrive en eneste kode!

10. For å avslutte den Visuelle byggeren kan du klikke på knappen “Avslutt Visuell Bygger” som er plassert helt øvert i den svarte meny linjen. Av og til kan man bli forvirret om man er i den visuelle byggeren eller ikke. En god huskeregel er at hvis du valget “Avslutt Visuell Bygger” så er den aktivert, mens hvis du ser “Aktiver Visuell Bygger” så er den deaktivert.

Struktur

SEKSJONER

De mest grunnleggende og største byggeklossene som brukes i utformingen av layouter er seksjoner. Disse brukes til å lage store grupper av innhold, og de er det første du legger til på siden din. Det er tre typer av seksjoner: Vanlig, Spesialitet og Fullbredde.

RADER

Rader sitter inne i seksjoner, og du kan plassere et hvilket som helst antall rader i en seksjon. Det er mange forskjellige kolonne typer å velge mellom. Når du har definert en kolonnestruktur for raden, kan du deretter plassere modulene i en ønsket kolonne. Det er ingen grense for antall moduler du kan plassere i en kolonne. For mer informasjon om bruk av rader, gå over til vår dybdegående opplæringsveiledning.

MODULER

Moduler er innholdsdelene som utgjør nettstedet ditt. Hver modul kan passe inn i en hvilken som helst kolonnebredde, og de er alle fullt responsive.

Lage din første side

1. Legg til din første seksjon

De tre grunnleggende byggeblokkene (Seksjoner, Rader og Moduler) brukes til å bygge din side.

Når du har kommet inn i den Visuelle Byggeren, kan du klikke på den blå pluss-knappen for å legge til en ny seksjon på siden din. Før du kan legge til noe på siden din, må du først legge til en seksjon. Etter at du har trykket på den blå pluss knappen vil du se en popup som lar deg velge mellom 3 ulike seksjonstyper. Disse typer inkluderer: Vanlig, Spesialitet og Fullbredde.

Seksjoner kan alltid legges til ved å klikke på den blå knappen (+). Når du svinger over en seksjon som allerede finnes på siden, vises en blå (+) knapp under den. Når du klikker, legges en ny seksjon under delen du for øyeblikket svever over. Merk at hvis du tidligere har lagt til en spesialitet eller fullbredde seksjon så vil + knappen ikke være blå men rød eller lilla.

Hvis du starter en helt ny side, blir den første seksjonen din lagt til automatisk.

Normalt vil du velge typen “Vanlig”. Valget “Spesialitet” brukes når man trenger å sette sammen rader og moduler sammen på en spesiell måte. Valget “Fullbredde” gir deg tilgang til et sett med ulike fullbredde moduler. Disse modulene virker litt annerledes fordi de utnytter nettleserens fulle bredde. Fullbredde moduler kan bare plasseres innenfor Fullbredde seksjoner.

2. Legg til din første rad

Når seksjonen er lagt til, vil du se en popup som lar deg velge rad layout.

Denne bestemmer hvor mange kolonner du ønsker for dette elementet.

2. Legg til din første modul

Du vil nå se en rekke ulike moduler du kan velge blant. La oss starte med å legge inn en enkel tekstmodul, så du kan skrive din første tekst.

Scroll nedover for å finne tekstmodulen.

Når du har klikket på tekstmodulen vil denne modulen åpne seg. Her er det allerede forhåndsutfylt litt demo tekst.

Marker demo teksten og erstatt den med teksten du ønsker.

Klikk deretter på den grønne knappen ned til høyre.

Du vil da se teksten du har skrevet på nettsiden. For å lagre dette må du trykke på den runde lilla knappen med 3 prikker nederst på siden. Du vil da få opp flere runde lille knapper og en grønn knapp “Lagre” helt til høyre. Trykk på den grønne knappen. Du du har gjort vil nå bli publisert, dette kan ta noen sekunder.

Du kan nå enten forsette å legge til elementer eller gjøre endringer, eller du kan avslutte den visuelle byggeren ved å trykke på “Avslutt Visuell Bygger” helt øvert på siden i den svarte meny linjen.

SÅ ENKELT VAR DET, DU HAR PUBLISERT DIN FØRSTE TEKST PÅ NETTET UTEN Å SKRIVE EN ENESTE HTML KODE:)