Elementor biedt regelmatig thema's aan die je helpen maak een website compleet van deze. Elke maand brengen we nieuwe thema's uit die zijn gebouwd rond een specifieke niche, maar toch flexibel genoeg zijn om ze eindelijk aan je eigen behoeften aan te passen.
Gecombineerd met Elementor Pro, met deze thema's kun je snel aan de slag met elk onderdeel van je website, waaronder:
de Pstatische leeftijden, zoals de startpagina,
- de koptekst
- de voettekst
- pagina 404
- de sectie Archief
- de blog
- Pop-ups en anderen
In deze tutorial laten we het je zien hoe maak je een website? voltooien met behulp van de visuele paginabuilder Elementor.
Maar eerder, als je WordPress nog nooit hebt geïnstalleerd, ontdek je Hoe maak je een WordPress blog 7 stappen te installeren et Hoe te vinden, installeren en activeren van een WordPress theme op uw blog
Ga dan terug naar waarom we hier zijn.
Hoe u een complete website bouwt met Elementor-thema's
In deze zelfstudie leert u hoe u een thema gebruikt als basis voor alle belangrijke onderdelen van uw website en vervolgens alles samenvoegt voor maak een website samenhangend.
Om precies te zijn, het thema Digital Agency.
Uw website heeft een aantal basispagina's, zoals pagina's:
- Ontvangst
- Over
- Diensten
- Klanten
- Blog
- Neem contact op
En het biedt ook secties die ook zijn gewijd aan dynamische inhoud. Uw blogpostarchieven en postsjablonen komen bijvoorbeeld automatisch overeen met uw zelfstandige pagina's. U kunt ook uw koptekst, voettekst en paginas 404.
dus even hoe maak je een website? met een Elementor-thema:
1. Installeer en activeer het Elementor Hello-thema
Omdat je Elementor en een themasjabloon gaat gebruiken om je hele website te bouwen, hoef je niet naar andere elementen te zoeken.
In plaats daarvan heb je alleen een lichtgewicht, voor prestaties geoptimaliseerde website nodig, die het Elementor Hello-thema biedt.
Ga naar om te beginnen Uiterlijk → Thema's → Toevoegen en zoeken " Hallo Elementor". Installeer en activeer vervolgens het thema.
2. Configureer de standaard statische pagina's van uw website
Ga dan naar het menu Pagina's → Toevoegen om de basispagina's van uw website te maken.
Maak eerst een pagina met de naam ' Ontvangst 'En klik op de knop Bewerken met Elementor om Elementor te starten.
Klik op instellingen om het pagina-instellingen en verander de lay-out om gelijk te zijn aan Elementor volledige breedte.
Open vervolgens de Elementor-sjabloonbibliotheek en zoek naar "Digital Agency" onder Pages :
U zou een lijst met paginasjablonen van dit thema moeten zien. Sjabloon invoegen Startpagina uit de lijst met modellen.
Nu zou je een volledige homepage moeten zien. De koptekst ziet er voorlopig een beetje saai uit, maar maak je geen zorgen, we zullen dat binnenkort oplossen.
Voeg vervolgens nog een pagina toe om te gebruiken voor uw " Over".
Maak zoals eerder een pagina en wijzig de lay-out in Elementor volledige breedte. Open vervolgens de sjabloonbibliotheek en voeg de sjabloon in Over van het thema Digital Agency.
Herhaal nu hetzelfde proces om alle andere pagina's te maken, inclusief: Diensten, Klanten, en Contact.
Maak je nog geen zorgen over de blogpagina. Deze pagina is niet statisch zoals de andere. Om deze reden ga je het daar maken via een andere methode (die we later in deze tutorial zullen behandelen).
Om het instellen van uw statische pagina's te voltooien, moet u uw WordPress-installatie vertellen om een statische startpagina te gebruiken. Om dit te doen…
- gaan naar Instellingen → Afspelen
- Kiezen Een statische pagina (kies hieronder) onder uw homepage-instellingen
- Selecteer de pagina met de startpaginasjabloon van het thema
3. Maak de andere delen van uw website
Nu ben je klaar om de andere delen van je website te bouwen met Elementor. Met Elementor kun je verder gaan dan het maken van statische pagina's (zoals je hierboven hebt gedaan).
Met Elementor kunt u ook secties ontwerpen zoals: en-hoofd; de voettekst, enz ...
En dankzij het Elementor-thema kun je sjablonen importeren voor alle secties die al op de statische pagina's staan die je in de vorige stap hebt gemaakt.
Ga naar om toegang te krijgen tot de visuele bouwer van Elementor Sjablonen→ Themabouwer. U moet Elementor Pro installeren om er toegang toe te hebben.
Nu is het tijd om uw secties te maken
hoofd
Ga naar het tabblad om te beginnen Voorvoegsel van de visual builder-interface en klik op Voeg een nieuwe. Op het volgende scherm ziet u een selectie van sjablonen in de Elementor-bibliotheek. Zoek, net als bij statische pagina's, naar "Digital Agency" en voeg vervolgens het volgende in:
Nu zou u een visueel voorbeeld van uw koptekst moeten zien, evenals een navigatiemenu van de sjabloon die u hebt ingevoegd.
Als je het wilt veranderen
- gaan naar Uiterlijk → Menu's in uw WordPress-dashboard
- Een nieuw menu maken
Nadat u een menu heeft gemaakt, kunt u de pagina's die u in stap # 2 heeft gemaakt, toevoegen aan uw navigatiemenu.
Lees ook: 10 automatiseringstools voor marketing voor kleine bedrijven
Als u klaar bent met het toevoegen van menu-items, slaat u uw menu op en keert u terug naar uw koptekstsjabloon in de Elementor-interface.
dan publiceren uw koptekst en gebruik weergavevoorwaarden om uw koptekstsjabloon op uw hele website weer te geven. Als je wilt, kun je ook weergavevoorwaarden gebruiken om verschillende kopteksten te maken voor verschillende soorten inhoud:
Druk dan op Opslaan en sluiten
footer
Nu is het tijd om uw voettekst voor uw website te maken:
- Ga terug naar de interface van de visuele paginabuilder
- Klik op het tabblad footer
- Klik op de knop om Nieuwe voettekst toevoegen
- Geef in de pop-up een naam aan uw voettekst en klik op Sjabloon maken
Nu zou u een lijst met voettekstsjablonen moeten zien, net zoals u deed met uw koptekst. Zoek naar "Digital Agency" en voeg de voettekstsjabloon in.
Nadat u de voettekstsjabloon heeft ingevoegd, zou u een voorbeeld van uw voettekst moeten zien:
dan publiceren uw voettekstsjabloon en gebruik de weergavetermen om deze op uw hele website weer te geven.
Blogpagina
In tegenstelling tot de statische pagina's die u in stap 2 heeft gemaakt, is de blogpagina van uw website een ' archief ". Kort gezegd betekent dit dat het dynamisch de nieuwste inhoud van uw website weergeeft.
Als een gebruiker op een specifiek item op de blogpagina klikt, wordt hij naar een pagina geleid die de inhoud van dat item weergeeft. Dit wordt de "enkele" pagina genoemd. Uw unieke ontwerp zorgt ervoor dat al uw inhoud er hetzelfde uitziet - het enige dat verandert, is de daadwerkelijke inhoud (zoals de titel van het bericht, de hoofdtekst, de uitgelichte afbeelding, enz.).
Ontdek ook Inhoudsopgave toevoegen in WordPress met Elementor
Om unieke archiefpagina's en paginasjablonen te maken, moet u Elementor visuele bouwer gebruiken - niet zones pagina ou dit artikel WordPress standaard.
Beginnen…
- Open de Theme Builder-interface
- Ga naar het tabblad Archief
- Klik op Nieuw toevoegen
- Geef het een naam en klik op Sjabloon maken
Net als bij uw kop- en voettekst, ziet u een lijst met archiefpaginasjablonen. Zoek de sjabloon "Digital Agency" en voeg deze in.
Nu zou u het basisontwerp van uw artikelenpagina moeten zien.
Opgemerkt moet worden dat als u slechts één artikel ziet, dit normaal is, omdat WordPress alleen wordt geleverd met een standaardvoorbeeld dat "Hallo wereld! ".
Voorlopig hoeft u alleen maar te doen publiceren uw archiefpagina en stel deze in om in alle archieven weer te geven.
Lees onze gids verder Hoe een WordPress-website handmatig te migreren
Vervolgens kun je naar het berichtenmenu in je dashboard gaan en nieuwe blogberichten maken. Wijs elk item toe aan een categorie met de naam "Nieuws'.
Als je nu naar je blogpagina gaat, zou je automatisch al deze nieuwe berichten moeten zien:
Creatie van de blogpostsjabloonpagina
Op dit moment ziet uw blogpagina er vrij gebruiksvriendelijk uit. Maar als je op een specifieke blogpost klikt, komt de lay-out niet overeen met de rest van je website.
Om dit probleem op te lossen, moet u een "uniek" sjabloon maken met Elementor:
- Open Elementor visuele bouwer
- Ga naar het tabblad Enkele Post
- Klik op Voeg een nieuwe
In de pop-up Nieuwe sjabloon :
- Geef het een naam
- Selecteer Post in de vervolgkeuzelijst Selecteer berichttype. Dit vertelt Elementor dat je deze sjabloon wilt gebruiken voor je blogposts (in tegenstelling tot Pages of een ander aangepast berichttype dat je zou kunnen gebruiken)
Opnieuw ziet u de Elementor-sjabloonbibliotheek. Zoek de unieke artikelsjabloon van de "Digital Agency" -sjabloon en voeg deze in.
Lees ook Onderhoudsmodus op WordPress: uitleg en configuratie
Als u wilt, kunt u de vele widgets voor dynamische publicatiegegevens gebruiken om het uiterlijk van uw pagina te bepalen.
Als u bijvoorbeeld de widget wijzigt Info plaatsen, kunt u de metadata-elementen beheren die verschijnen, zoals bij de publicatie ...
- Auteur
- Publicatiedatum
- Opmerkingen
- Enz.
Als u tevreden bent met uw artikelmodel, klikt u op publiceren. Vervolgens kunt u de weergave-opties gebruiken, zodat deze unieke sjabloon alleen van toepassing is op berichten in de categorie "Beyond News":
- Kies uit de categorie
- Kies de categorie Nieuws
Druk dan op Opslaan en sluiten.
Nu moeten al uw blogberichten een ontwerp hebben dat past bij de rest van uw website.
Om dingen af te maken, ga naar Uiterlijk → Menu's en voeg je blogpagina toe aan je navigatiemenu. Om dit te doen, kunt u een link toevoegen aan de categorie "Nieuws" in de sectie Categorieën.
pagina 404
Ten slotte moet u de 404-pagina van uw website maken. De 404-pagina van uw website is wat bezoekers te zien krijgen als ze een verbroken link volgen of een pagina proberen te bezoeken die niet bestaat.
Ontdek ook onze 5 WordPress plugins om fouten beter te beheren 404
Om uw 404-pagina te maken, gebruikt u de Elementor-visualbuilder om nog een unieke sjabloon toe te voegen.
- Open Elementor visuele bouwer
- Ga naar het tabblad error 404
- Klik op Voeg een nieuwe
- Sjabloon voor digitaal bureau invoegen vanaf 404-pagina
Publiceer vervolgens uw sjabloon om uw website te voltooien.
Download Elementor Pro nu!
Conclusie
Alstublieft ! Dat is alles voor deze gids, die u stap voor stap laat zien hoe maak je een website? compleet met Elementor. Si vous avez reacties of suggesties, aarzel niet om ons te laten weten in de gereserveerde sectie.
U kunt echter ook overleggen onze middelen, als u meer elementen nodig hebt om uw projecten voor het maken van internetsites uit te voeren, raadpleeg onze gids op de WordPress blog creatie of die op Divi: het beste WordPress-thema aller tijden.
Maar in de tussentijd deel dit artikel op uw verschillende sociale netwerken.
...
