Mange vellykkede websteder er store, komplekse sager med mange sider og indhold. Men nogle gange er mere virkelig mindre i en verden af webdesign. Og derfor kan det i stedet for at tage en traditionel tilgang være værd at oprette et one-page-websted på WordPress.
I denne artikel går vi mere i dybden med fordelene og anvendelsesmulighederne ved denne type websted. Derefter viser vi dig, hvordan du opretter et one-page-websted på WordPress i kun tre trin. Lad os begynde!
- 📚 Indholdsfortegnelse:
- Hvorfor du måske ønsker at oprette et one-page website
- De væsentlige elementer på et ét-side-websted
- Sådan opretter du et one-page-websted (EKSAKTE TRIN)
- Trin 1: Bestem dit hjemmesides fokus
- Stræk 2: Vælg et kvalitetstema til en side
- Stræk 3: Design dit websted
- Byg dit websted med én side med Elementor
- Installer det gratis Neve-tema
- Installer det gratis Elementor-plugin
- Opsæt header, sidefod og menu
- Overskrift
- Menu
- Footer
- Opret en ny side og tilføj indhold med Elementor
- En hurtig introduktion til Elementor-grænsefladen
- To måder at oprette et websit med én side med Elementor
- Sådan opretter du sektioner af websitet med én side med Elementor
- Sådan opretter du det første afsnit
- Opret de resterende sektioner
- Link menuen til sektionerne på en side
- Sæt dit design som hjemmeside
- Konklusion
📚 Indholdsfortegnelse:
Hvorfor du måske ønsker at oprette et one-page website
De fleste websites har flere sider. Som minimum er der normalt en startside, en kontaktside, en om-side og sider for det indhold eller de tjenester, du tilbyder.
Et one-page-websted kondenserer derimod alle de vigtige oplysninger ned på en enkelt startside, ofte ved at inkludere en række dedikerede sektioner. One-page-webstedsdesign giver en række fordele, såsom:
- Enkelhed, hvilket gør det lettere for besøgende at navigere på dit websted og finde det, de har brug for.
- Enkle vedligeholdelse, da der er meget lidt indhold, der skal vedligeholdes.
Selvfølgelig er et one-page-design ikke det rigtige valg for alle websteder. Store, komplekse websteder har deres plads. Men hvis du driver et lille virksomhedswebsted, en portefølje eller en simpel butiksfacade, kan du overveje dette format.
De væsentlige elementer på et ét-side-websted
Når dit websted kun strækker sig over en enkelt side, skal du være meget bevidst om, hvad du inkluderer. Det er vigtigt at give alle de oplysninger, som dit publikum vil få brug for, uden at overfylde siden eller overvælde dem. Alt, hvad du tilføjer til din side, skal være der af en grund.
Her er nogle af de vigtigste elementer, hvis du ønsker at oprette et websted med én side:
- En fremtrædende Call to Action (CTA), f.eks. en tilmeldings-, kontakt- eller købsknap.
- En About-sektion, der forklarer, hvem du, din virksomhed eller din organisation er.
- Brandingelementer som f.eks. dit logo og tagline.
- En liste over produkter eller tjenester, hvis det er relevant.
- Link til dine andre steder og indhold rundt omkring på nettet, herunder profiler på sociale medier.
- Kontaktoplysninger, herunder forskellige kanaler, hvis det er muligt.
Det er også vigtigt at være opmærksom på rækkefølgen af disse elementer. Generelt vil du gerne placere de mest afgørende oplysninger og CTA’er tidligt på siden, mens kontaktoplysninger og links ligger tættere på bunden af siden. Tænk over, hvad dit publikum har brug for at se og i hvilken rækkefølge, og det vil hjælpe dig med at bestemme, hvilke elementer du skal medtage, og hvordan du skal arrangere dem.
Finalt – bare fordi du bruger et webside-design med én side, betyder det ikke nødvendigvis, at du ikke kan have en blog. Hvis du stadig ønsker at inkludere en blog, vil WordPress stadig lade dig linke til din blog fra din one-page-hjemmeside.
Sådan opretter du et one-page-websted (EKSAKTE TRIN)
Nu skal vi tale om, hvordan du rent faktisk går i gang med at designe dit websted. Det første, du skal gøre, er at tjekke nogle eksisterende eksempler på websider med én side for at få inspiration. Derefter kan du gå videre til det første trin.
Trin 1: Bestem dit hjemmesides fokus
Som vi har diskuteret, betyder valget af at oprette et one-page-websted, at du skal være meget bevidst om dets design. Det omfatter, at du skal være klar over dens mål. Når du er begrænset til en enkelt side, skal du vælge en eller to vigtige ting at fokusere på.
For at gøre dette skal du overveje den primære CTA, som dit websted vil blive designet omkring. Hvad vil du have de besøgende til at gøre – tilmelde sig et medlemskab, købe et produkt, deltage i et arrangement eller ansætte dig til et job? Alt på din side skal opfordre folk til at foretage denne handling. Det betyder, at du skal give dem de oplysninger, de har brug for, forklare fordelene og gøre de næste trin klare.
Stræk 2: Vælg et kvalitetstema til en side
Hvis du har besluttet dig for at oprette et websted med en side i WordPress, kan du bruge et hvilket som helst tema, du vil. En smart strategi er dog ofte at vælge et one-page tema, der er bygget specielt til at hjælpe dig med at designe denne type websted. Disse temaer gør det nemt at inkludere alle de nødvendige oplysninger, samtidig med at du opretholder et attraktivt design.
Når du vælger et one-page-tema, er her, hvad du skal kigge efter:
- En side builder med de færdigbyggede elementer, du har brug for, f.eks. en kontaktsektion.
- En metode til at opdele din side i flere sektioner, der kan skelnes visuelt.
- Navigation, der gør det muligt for besøgende at springe til forskellige sektioner på din side.
- En nem måde at tilføje CTA-knapper og personliggøre dem.
Der findes masser af one-page-temaer. Neve, for eksempel, er et multifunktionelt tema, der er perfekt til kortfattede, men omfattende en-side-websteder. Det er kompatibelt med mange populære side builders, indeholder en live customizer og hjælper dig med hurtigt at opsætte dit one-page site. Det indeholder også forudbyggede sektioner til kontaktoplysninger, din bio, en butiksfacade og meget mere.
Stræk 3: Design dit websted
Når du ved, hvad du vil have med på dit websted, er klar over dets fokus og har valgt et stærkt tema, kan du begynde at designe siden rent faktisk. Du ønsker, at den skal passe til dit publikum, afspejle din stil og være optimeret til at opfylde dine mål – hvilket betyder, at du ikke blot skal følge en formel.
Her er dog nogle forslag, som du kan huske på, når du sammensætter dit websted:
- Hold din side enkel, og lad være med at inkludere noget, der ikke tjener et klart formål
- Gør klar forskel på de forskellige sektioner med forskellige overskrifter, baggrunde osv.
- Skab en navigation, der hurtigt fører de besøgende til de afsnit, de har brug for.
- Gør dine primære CTA’er fremtrædende og overbevisende.
Følger du disse råd, vil du være i stand til at skabe et fantastisk websted med én side på ingen tid.
Nu skal vi snakke om værktøjer. Så hvordan kan du bygge et fantastisk websted med én side på den mest effektive og hurtigst mulige måde?
Byg dit websted med én side med Elementor
Elementor er en brugervenlig, funktionsrig sideopbygger, der gør det nemt at oprette et vilkårligt antal sider på et WordPress-websted. Det gør det til det perfekte værktøj til at skabe et godt ét-side-websted med.
I de følgende afsnit viser vi dig, hvordan du gør det. Det eksempel, vi bruger, er et websted for en frugt- og grøntbutik. Hjemmesiden vil have:
- en side med mange sektioner, der rummer indholdet
- en menu, som de besøgende kan klikke på for at gå direkte til de relevante sektioner
- en header, der rummer logoet og menuen
- en footer
Her er et eksempel på, hvordan hjemmesiden kommer til at se ud til sidst:
Vi vil gennemgå hvert enkelt trin i detaljer, men her er den grundlæggende proces:
- Installer det gratis Neve-tema.
- Installer Elementor-plugin’et, hvis du ikke allerede har gjort det.
- Sæt dit websteds “lærred” op – overskriften, sidefoden og menuen.
- Føj dit indhold til med Elementor.
- Link menuen til forskellige sektioner i dit design for at skabe en side-navigationseffekt.
- Sæt dit design som hjemmesidens startside.
Installer det gratis Neve-tema
- Gå til Udseende → Temaer → Tilføj nyt i dit WordPress-dashboard.
- Søg efter “Neve”
- Klik på knappen Installér
- Når WordPress har installeret temaet, klik på Aktivér for at gøre det live
Installer det gratis Elementor-plugin
- Gå til Plugins → Tilføj nyt
- Søg efter “Elementor”
- Installer og aktiver det gratis Elementor Page Builder-plugin.
Nu, med en ren WordPress-installation, et aktivt Neve-tema og Elementor Page Builder, er du klar til at bygge dit websted med én side.
Du bruger Neve-temaet til at opsætte dit en-side-websted’s header, sidefod og menu.
Overskrift
Gå til WordPress-dashboardet, og klik på Udseende → Temaer → Tilpas → Tilpas for at tilpasse Neve-temaet:
Først skal du vælge farver og baggrund for webstedet
Næst skal du klikke på Header → Change Logo i panelet Customizer og tilføje dit webstedslogo. Juster bredden på logoet, tilføj webstedets titel, webstedsikonet og en tagline. Vælg, om du vil vise eller skjule webstedets navn og tagline i overskriften.
Under fanen Layout skal du vælge et layout for overskriften samt farven og indstille polstring og margener. Alternativt kan du vælge en af de forudindstillede headerindstillinger.
Menu
Derpå skal du oprette den navigationsmenu, der skal vises i din header. For at gøre dette skal du klikke på Menuer → Opret ny menu. Giv den et navn, og indstil dens Menuplacering lig med Primærmenu.
Klik på Næste og Tilføj elementer. Her skal du tilføje navnene på de sektioner, du vil oprette. For eksempel: Main, About Us, Products og Contact. For at gøre dette skal du klikke på knappen Brugerdefinerede links.
I URL-feltet skal du indtaste et hashtag efterfulgt af navnet på det pågældende afsnit. Senere, når du konfigurerer Elementor, vil du konfigurere det, så disse links går til specifikke sektioner i dit design. For eksempel:
#about-us
#products
#contact
Gå videre til Footer, og tilføj tekst og baggrundsfarve. Du kan tilføje alt det indhold, du ønsker her:
Klik på Udgiv for at gemme alle ændringerne
På dette tidspunkt har dit websted en header, en footer og en menu. Den skal se nogenlunde ud som nedenfor. Nu er du klar til at bruge Elementor til at tilføje det indhold, der går mellem din header og footer:
Opret en ny side og tilføj indhold med Elementor
For at komme i gang skal du gå til Sider → Tilføj nyt for at oprette en ny side. Giv siden et navn. Hvis temaet indeholder sidebjælker, vil det også blive vist. Men du kan skære sidebarerne væk ved at justere sideattributterne til fuld bredde.
På den nye side, der åbnes, skal du klikke på Rediger med Elementor. Det åbner et panel til venstre. I højre side er der redigeringsområdet, hvor du kan se, hvordan hjemmesiden tager form.
En hurtig introduktion til Elementor-grænsefladen
Hvor vi går videre, skal vi tage et kig på Elementor-panelet. Det har mange kreative elementer eller widgets som overskrifter, afsnit, billeder eller videoer. Du kan tilføje disse til dit indhold ved at trække dem over.
Overst til venstre i panelet er der en hamburgermenu, som åbner mange muligheder. Her vil du kunne justere farver, skrifttyper og temastil på et globalt niveau. Det er unødvendigt at sige, at dette sparer en masse tid, når du tilføjer nye sider.
Fra denne fane kan du også til enhver tid afslutte til WordPress-dashboardet.
Underst i panelet er der muligheder for at justere sideindstillingerne, navngive siden, se redigeringshistorik og skifte mellem responsive modes. Der er også en navigator, som viser en organiseret visning af siden.
Gennem at klikke på øjenikonet kan du få vist et eksempel på siden, og når du er klar til at gå live, skal du trykke på knappen Udgiv.
Nu er det tid til at begynde at tilføje noget indhold.
To måder at oprette et websit med én side med Elementor
På dette tidspunkt kan du vælge at gå i gang med at bygge websitet med én side med Elementor på to måder:
1. Indsæt en af Elementors præfabrikerede skabeloner, og tilpas den derefter som ønsket. Til dette formål skal du klikke på mappeikonet i livevisningen af dit design, og det vil åbne en række skabeloner, nogle gratis og mange pro-skabeloner. I fanen Sider finder du helt færdige designs til hele sider. I fanebladet Blocks finder du færdigbyggede skabeloner til specifikke sektioner af en større side (dette er det mest nyttige til et websted med én side).
Du kan indsætte en hvilken som helst skabelon ved at klikke på den. Derefter kan du tilpasse hvert enkelt element fuldt ud.
2. Alternativt kan du starte helt fra bunden ved at klikke på plus-knappen for at tilføje et afsnit og bygge dit design fra et tomt lærred.
I denne vejledning vil vi anvende en kombination af begge metoder – vi bygger det første afsnit af vores websted fra bunden og vælger derefter fra skabelonblokke til at udfylde de resterende afsnit.
Sådan opretter du sektioner af websitet med én side med Elementor
Elementor bruger sektioner, kolonner og widgets til at skabe layoutet af enhver side. Sektioner er de største byggeblokke, og du kan tilføje kolonner inden for dem. Inde i disse sektioner eller kolonner kan du tilføje de widgets, du ønsker.
Klik på “+”-tegnet for at tilføje en sektion og vælge kolonnestrukturen.
Når du holder musen hen over et afsnit, vises en blå kant med et håndtag øverst. Med dette håndtag kan du tilføje et nyt tomt afsnit over det eksisterende afsnit eller redigere/slette et afsnit. Hvis du klikker på prikkerne i midten, får du adgang til sektionskontroller – layout, stil og avanceret. Endvidere kan du flytte sektionerne op eller ned ved at trække på prikkerne og højreklikke for at få flere muligheder frem, f.eks. duplikere eller slette.
Sådan kan du klikke på håndtaget med kolonneikonet i det øverste hjørne for at vælge kolonnelayout i sektionen. Du kan også justere bredden på kolonnerne og mellemrummet mellem dem. Højreklik på boksene for at tilføje flere kolonner, duplikere eksisterende kolonner, slette dem og meget mere.
Fra Elementor-panelet kan du trække et hvilket som helst element (kaldet en widget) ind i kolonnen. Når du tilføjer et element til en kolonne eller et afsnit, vises et blyantsikon i øverste højre hjørne. Klik på dette ikon for at få vist indholds-, styling- og avancerede redigeringsmuligheder i Elementor-panelet.
Sådan opretter du det første afsnit
Vi vil bruge det første afsnit til at fortælle de besøgende om virksomhedens art og lidt om den. Til dette formål kan du bruge hele bredden af afsnittet til at bære et baggrundsbillede. Når du redigerer sektionslayoutet, kan du justere indholdsbredden og strække sektionen til hele sidens bredde ved blot at skifte mellem en knap.
For at tilføje baggrundsbilledet skal du vælge indstillingen Rediger sektion ved at klikke på prikkerne i håndtaget. Gå til fanen Stil, der vises i panelet, og upload billedet fra Mediebiblioteket. Juster størrelsen på billedet samt overlejringen.
Vi tilføjer en enkelt kolonne i afsnittet og centrerer den i afsnittet. Inde i kolonnen vil vi bruge tre widgets – Heading, der fortæller de besøgende, at du sælger friske frugter og grøntsager, en teksteditor, der henleder opmærksomheden på mulighederne for levering til hjemmet, og en knap, hvorfra de besøgende kan afgive en bestilling.
Tilføjelse af en widget med overskrift:
Tilføjelse af en tekstwidget:
Tilføjelse af widget med knap:
Nu kan du tilpasse hver widget ved hjælp af redigeringsmulighederne.
Hvis du ønsker det, kan du også tilføje widgets i tre separate kolonner ved at tilføje kolonner ved at klikke på kolonneikonet. Hvad der er vigtigt at bemærke her er, at hver widget kan justeres minutiøst med hensyn til layout, stil og meget mere.
Opret de resterende sektioner
Nu, hvor den første sektion er færdig, kan du gå videre til de resterende tre – Om os, Produkter og Kontakt.
Som nævnt før, bruger vi færdige skabelonblokke fra Elementor-biblioteket til at bygge disse tre sektioner. Elementor har mange gratis skabelonblokke under hver af disse kategorier, og biblioteket er søgbart.
Til afsnittet Om os vil vi vælge en simpel skabelonblok med en overskrift, teksteditor og video-widget. Du kan erstatte alt dette med dit eget indhold.
Skabelonblokken med det erstattede indhold:
På nøjagtig samme måde kan du bruge skabelonblokke til afsnittet Produkter og Kontakt. Den skabelon, der bruges til afsnittet Kontakt, leveres med ikoner for sociale medier. Klik på fanen Stil for at styre ikonets farve, størrelse, padding m.m.
Da Elementor giver mulighed for en stor grad af tilpasning, kan du få disse afsnit til at se anderledes ud end de importerede skabeloner.
Når du er færdig med at foretage de ønskede ændringer, skal du klikke på den grønne knap Udgiv, og ændringerne vil være live på webstedet.
For at få en klikbar navigationsmenu skal du forbinde de forskellige sektioner i dit Elementor-design med den navigationsmenu, som du oprettede i trin 3. For at gøre dette skal du åbne et sektions ID og gå til fanen Avanceret. I CSS ID-feltet i Elementor-panelet i det tilsvarende afsnit skal du udfylde det korrekte afsnitsnavn uden hashtag.
Til eksempel, hvis din menu linker til #about-us
, skal du tilføje CSS ID som about-us
. Gentag derefter processen for alle de sektioner, du vil linke til:
Sæt dit design som hjemmeside
Som et sidste skridt kan du oprette den side, du lige har oprettet, som hjemmeside for det ensidede websted, der er oprettet med Elementor. For at gøre dette skal du gå til Indstillinger → Læsning. Klik på Vælg en statisk side under Din startside vises, og vælg det design, som du har oprettet. Til sidst skal du klikke på Gem ændringer.
Hvis du er forvirret over et trin, har vi en komplet vejledning om opsætning af en statisk WordPress-hjemmeside.
Endeligt er dit ét-side-websted nu klar. Her er et eksempel på, hvordan det kan se ud:
Konklusion
Sommetider har du kun brug for dit websted til at udføre en eller to vigtige opgaver. Under disse omstændigheder er et one-page-websted den perfekte løsning. Du kan kun inkludere de oplysninger, som dine besøgende har brug for til at foretage den handling, du ønsker at tilskynde til, og gøre arbejdet med at vedligeholde dit websted så nemt som muligt.
Her er tre enkle trin, som gør dig i stand til at oprette et websted med én side i dag:
- Determiner dit hjemmesides fokus.
- Vælg et kvalitetstema med én side, f.eks. Neve.
- Design dit websted ved hjælp af Elementor, hvis det er nødvendigt.