‘Gewoon Joomla!’

Eric Beernink gaat on the fly een Joomlawebsite bouwen met een gratis template (Yootheme Master2), gratis slider (CK Slideshow) en gratis contactformulier (Rapid Contact).

Installatie Joomla

joomlaWe beginnen bij het begin, met de Joomla-installatie op een lokale omgeving. In het geval van Eric op MAMP.
Eric maakt een database en een map aan (beide met de naam ‘demo’). Hij maakt ook lokaal een self-signed-certificaat aan om meteen met HTTPS te kunnen werken. Hij pakt de meest recente versie van Joomla uit naar de htdocs/demo map, om vervolgens de Joomla-installatie lokaal uit te voeren, zonder de voorbeelddata. Ten slotte wordt de installatiemap verwijderd.

Eric logt in de op de backend van de demowebsite. En meteen is er al een taalupdate voor Joomla beschikbaar.

Akeeba Backup

Eric begint met het installeren van de Coreversie van Akeeba Backup, en laat de configuratiewizard lopen. En maakt meteen een backup van de schone installatie.

Instellingen Joomla

Nu is het tijd voor diverse instellingen in Joomla, te beginnen met het hernoemen van de htaccess.txt naar .htaccess. Onder Windows lukt het hernoemen niet, maar kun je wel het bestand openen en opslaan als .htaccess met een goede teksteditor zoals bijv. Notepad++. Dit hernoemen doen we zodat we gebruik kunnen maken van mooie URL’s.
Daarna gaan we de sessie-time out op 60 minuten zetten, zodat je tijdens het ontwikkelen niet te snel uit je website wordt uitgegooid. Voor een nieuwe site kun je meteen ook kiezen voor de nieuwe manier van URL’s schrijven.

Yootheme Master2-template

De volgende stap is de Yootheme Master2-template van Yootheme installeren, en deze instellen als standaardtemplate. Het menu zetten we op de menu-positie van de Yootheme Master2-template. De reclame schakelen we uit (hide Warp branding) in de instellingen van de template.

Slideshow CK

Eric heeft voor de slider op de JED een module ‘Slideshow CK’ gedownload. Bij het openen van de module zijn erg veel mogelijkheden aanwezig (met name ook voor de betaalde versie, maar deze blijven vandaag buiten beschouwing).
Voor het bekijken van de posities schakelen we met het ‘oogje’ bij de template-opties de mogelijkheid in om de moduleposities te tonen. De slideshow wordt op de top-a positie geplaatst en toegekend aan de homepage.

Wat komt er op onze website?

We gaan op de homepage een slider, algemene tekst en 3 informatie-blokjes met tekst toevoegen. We willen een blog. En natuurlijk mag ook een contactformulier niet ontbreken.

De homepagina

We gaan allereerst een artikel op de Homepagina plaatsen. Hiervoor maken we nu een leeg artikel ‘Home’ aan. Vervolgens kunnen we het artikel gaan bewerken en voorzien van afbeeldingen. Standaard staat de kop ‘Home’ en de info van de schrijver bij het artikel. In dit geval gaan we naar de opties van dit menu-item, waar we deze info gaan verbergen.

Vervolgens gaan we 3 infoblokjes maken door op de positie ‘bottom-a’ 3 modules van het type ‘Aangepast’ toe te voegen. In dit geval willen we de titels wel tonen.

Eric knipt en plakt de door hem voorbereide teksten via een kale teksteditor naar de Joomla-artikelen en -modules, om te voorkomen dat er ongewenste opmaak meekomt. Het alternatief is te plakken zonder opmaak.

Vervolgens kun je met de instellingen van de Yootheme Master2 template aan de slag met de Style customizer voor het opmaken van de modules. Deze template regelt zelf de uitlijning (hoogte) van de gebruikte modules.

Op de footerpositie gaan we een copyrightboodschap toevoegen. We maken hiervoor een ‘Aangepaste’ module. In deze module zetten we de copyrightboodschap, en gaan deze tekst centreren. We stellen deze module zo in dat hij op alle pagina’s wordt getoond.

Op dit punt aanbeland, zijn we 3 kwartier onderweg. Het voordeel was wel dat er al foto’s waren voorbereid door Eric (vanaf unsplash.com), welke meteen al op het juiste formaat waren geoptimaliseerd / aangepast. Vervolgens heeft Eric de afbeeldingen nog verder geoptimaliseerd.

Blog

Na de pauze vervolgen we de ‘Gewoon Joomla!’-sessie met het opzetten van een blog.

We beginnen met het aanmaken van de categorie ‘Blog’, waarin we een aantal artikelen gaan aanmaken, voorzien van een foto bij de introtekst en een foto bij de totale tekst. We koppelen het artikel aan de categorie ‘blog’ en doen dit ook met een 2e en een 3e artikel. We maken vervolgens een menu-item ‘blog’ aan van het type categorieblog, waarbij we de categorie ‘blog’ gaan tonen. Bij het menu-item kunnen we de blogopmaak nog wijzigen. We stellen 0 hoofdartikelen en 8 blogartikelen in. Mochten er meer dan 8 artikelen zijn, dan worden deze artikelen als een link getoond.

Bij de blogweergave wordt het recentste artikel eerst getoond, waarbij de artikelen eerst links van boven naar beneden getoond worden en daarna rechts van boven naar beneden. Bij de menu-opties kun je aangeven op welke wijze de artikelen getoond worden (van links naar rechts en vervolgens van boven naar beneden). Ook kun je zelf de volgorde bepalen, door de sortering handmatig in te stellen. Bij het menu-item kun je ook weer bepalen wat er bij de betreffende artikelen wordt getoond.

Vervolgens maakt Eric nog een aantal veldgroepen aan, en koppelt dit aan de blogcategorie. Daarna kun je per blogartikel 1 of meer velden selecteren waarmee je kunt aangeven waar het betreffende blog over gaat (er wordt dan een onderwerpregel toegevoegd, waarbij de betreffende veldgroep(en) wordt/worden getoond).

Contactformulier met Rapid Contact

We gaan de website nog uitbreiden met een contactformulier. Voor een eenvoudig formulier heeft Eric de module Rapid Contact gevonden. We gaan een contactpagina toevoegen aan het menu in de vorm van een individueel artikel ‘Contact’, met een tekst voor het opnemen van contact.

We gaan vervolgens naar de modules en noemen de Rapid Contact module ‘Contactformulier’, welke we op de Contactpagina gaan tonen. We moeten ook nog even de contactgegevens en een mailadres invullen. Bij de tekstopties van de Rapid Contact-module zijn de diverse labels te voorzien van een Nederlandse tekst.

Blogbeheer via de front-end

Om een blog te beheren is het makkelijk om dit via de front-end van de website te kunnen doen. Daarom maken we een groep ‘blogbeheer’ aan en koppelen de gebruiker ‘redactie’ aan deze groep. Ook maken een toegangsniveau ‘Blogbeheer’ en koppelen deze aan de groep ‘Blogbeheer’.

We maken vervolgens een nieuw menu-item ‘Aanmelden’ (van het type Gebruikers/Inlogformulier), waarbij het inlogscherm wordt getoond, en koppelen dit aan het Gastgebruikersniveau. Ook maken we een nieuw menu-item ‘Afmelden’ (van het type Gebruikers/Uitloggen), gekoppeld aan het gebruikersniveau Geregistreerd. Het menu-item ‘Aanmelden’ is alleen zichtbaar voor Gastgebruikers. Na het aanmelden ben je geen Gastgebruiker meer (en is het menu-item ‘Aanmelden’ niet meer zichtbaar) en is er sprake van een Geregistreerde gebruiker. Dan wordt het menu-item ‘Afmelden’ getoond.

Tot slot maken we nog een menu-item ‘Blogbeheer’, dat aan de groep ‘blogbeheer’ is gekoppeld.

We hebben nu de mogelijkheid om via de front-end de blogs aan te maken en bestaande blogs te bewerken.

Tot slot

Wil je je verder verdiepen in Joomla, dan zijn de video’s op community.joomla.org (onder het kopje training) erg handig.

Voor deze thema-avond is gebruik gemaakt van gratis extensies. Benno haakt hier op in met de volgende tip: voordat je een extensie vanaf de JED gaat gebruiken, lees vooral de reviews over updates, ondersteuning etc. om de betrouwbaarheid van de extensie te kunnen beoordelen. Het gebeurt regelmatig dat extensies niet worden bijgewerkt voor bijvoorbeeld een recente PHP-versie.

Voor het beoordelen van de veiligheid van een extensie, kun je ook de Joomla Vulnerable Extensions List bekijken bekijken. Als er een lek bekend is bij een extensie, dan wordt dit op deze site getoond.

Betaalde extensies bieden vaak extra functionaliteit, updates en ondersteuning.

Alles op een rij

Voor deze thema-avond heeft Eric een pdfdocument gemaakt met de stappen op hoofdlijnen beschreven. Ook zijn hier de verschillende URL’s aangegeven voor het downloaden van de diverse gebruikte onderdelen.

Al met al weer een interessante en leerzame avond!


 Verslag door Frits Schippers

Reageer

1000 Resterende tekens