In deze blogpost installeren we in enkele stappen een prachtig website sjabloon van Astra. Astra is een WordPress thema (theme) en ze hebben honderden sjablonen (templates). De gratis versie van Astra in combinatie met de diverse gratis sjablonen is al een zeer krachtige combinatie om snel prachtige websites te maken zoals de onderstaande. De betaalde versie geeft je toegang tot alle templates en extra tools die het gebruikersgemak nog meer vergroten. Denk hierbij aan het eenvoudig bewerken van kop/voet teksten en nog betere samenhang met pagina bouwers zoals Beaver en Elementor waar ik later in deze blogpost serie op terug kom. Als je echt serieus bent over web design is Astra pro één van de onmisbare tools in jouw gereedschapskist.
Eerst wil ik nog uitleggen wat nu precies een theme en een template is zodat je het proces goed begrijpt.
Theme
Een theme is het globale design van je website en blog. Het thema zorgt voor een consistente en professionele uitstraling van je pagina. Van kleuren, marges en lettertypen tot header, footer en navigatie balk design. We hebben Astra al benoemd maar er zijn nog veel meer thema’s die je kan downloaden zoals Divi.
Templates
Templates bepalen de lay-out en uiteindelijk look per pagina. Voor ieder standaard type pagina zijn er templates te vinden. Voor iedere pagina gebruik je daarom een template die “compatible” is met het thema dat je gebruikt. Per pagina kan je de template aanpassen om zo je eigen looks voor de pagina te creëren en Verander de tekst, het aantal kolommen, de positie van plaatjes en knoppen om zo je eigen looks voor de pagina te creëren. het thema zorgt uiteindelijk voor de consistentie tussen je verschillende pagina’s.
Template installeren
Nu zijn we klaar voor het stappenplan om Astra met een template te installeren. Zorg dat je in het dashboard van WordPress zit.
- Omdat een template een pagina is die communiceert met het thema moeten we eerst de bestaande pagina’s verwijderen. WordPress installeert namelijk automatisch een aantal pagina’s en deze werken niet met Astra. Druk in de linker navigatie balk op Pages en verwijder alle pagina’s. Je kan ze één voor één verwijderen of allemaal selecteren en bij bulk action Move To Trash kiezen.
- Diverse hosting sites installeren vaak hun eigen WordPress plugins bij een automatische installatie. Omdat plugins de looks van onze pagina’s kunnen bepalen en er conflicten kunnen optreden met Astra is het handig om ook deze eerst te verwijderen. Ga naar Plugins en verwijder deze middels zelfde methode als de pagina’s hierboven.
- Als het goed is ben je nog in het Plugin menu, klik bovenin op de knop Add New om de plugins te installeren die we nodig hebben. In het zoekveld kan je de volgende plugins zoeken, installeren en activeren.
- Starter Templates – Elementor, Gutenberg & Beaver Builder Templates.
- Elementor – Website Builder
- Ga nu weer naar het scherm waar je al je plugins kan zien en zorg dat de bovenstaande geactiveerd zijn.
- Bij de plugin Starter Templates druk je op de link See Library.
- Nu zie je een scherm met alle beschikbare templates van de plugin Starter Templates er zijn nog veel meer templates. Deze templates zijn allemaal compatible met Elementor en daarom kiezen we voor één van deze zodat we in een volgende post deze template gebruiken om er onze eigen draai aan te geven. Als je de serie graag verder wilt volgen kies dan voor de template Outdoor Adventure.
- Klik op de template en druk Import Complete Site je wordt nu ook gevraagd of je het Astra thema wilt instaleren. Deze template werkt niet zonder dus installeer ook Astra.
Zodra alles is geïnstalleerd kan je de website bekijken door linksboven in de taakbalk van WordPress op je site naam te drukken. Zodra je uit gekeken bent op je website kan je een pagina aanpassen door bovenin Edit With Elementor te kiezen. Ga gerust wat uitproberen, verander bijvoorbeeld de tekst en plaatjes, Elementor werkt heel gebruiksvriendelijk en intuïtief. Misschien krijg je het zelfs voor elkaar om een knop toe te voegen, het aantal kolommen aan te passen of een plaatjes carrousel te importeren. Als er iets mis gaat is er geen nood aan de man, verwijder gewoon de pagina’s die je bewerkt hebt (of allemaal) en installeer de template zoals we hierboven hebben gedaan.