Questions
Topics

Stap 2: Verdere verfijning

reCAPTCHA inregelen

Om de contactformulieren te beveiligen, maken we gebruik van reCaptcha. In de eerste plaats moet je ervoor zorgen dat je…

Om de contactformulieren te beveiligen, maken we gebruik van reCaptcha. In de eerste plaats moet je ervoor zorgen dat je over reCaptcha-sleutes beschikt. Deze kun je gratis aanmaken met een Google account. Klik HIER om een reCaptcha aan te maken.

reCAPTCHATegenwoordig is het gebruikelijk dat je kiest voor reCaptcha v2 / 

Nu je de code hebt, gaan we deze plaatsen in de betreffende plugin. Hiervoor ga je naar Extensies / Plugins en geef je de zoekterm 'recap' in. Klik vervolgens op de naam van 'CAPTCHA - Invisible reCAPTCHA' en plak hier de respectievelijke codes in.

We zijn er nog niet. Ga nu weer naar Systeem / Algemene instellingen / en de tab Website en kies bij Standaard Captcha voor 'CAPTCHA - Invisible reCAPTCHA'.

Was dit nuttig?
0

SEO instellingen

We gaan hiervoor naar Systeem / Algemene instellingen / en de tab Website. Rechts bij SEO-instellingen Schakel je 'Gebruik URL…

We gaan hiervoor naar Systeem / Algemene instellingen / en de tab Website.

Seo instellingen JoomlaRechts bij SEO-instellingen Schakel je 'Gebruik URL herschrijven in (dit zorgt ervoor dat je niet meer achter mijnwebsite.nl/index.php staat. Dit vinden de zoekmachines fijner!

Daarnaast wil ik wel laten weten op welke website men terecht is gekomen. Daarom kies ik ervoor om de websitenaam na de paginatitels te tonen.  Zo zie je nu boven dit atikel ik je browser tab staan: 'Het begin - Beemsterboy'.

Links onderaan bij Metadata-instellingen geef je een korte beschrijving weer van je website. Dit wordt dan getoond bij het resultaat van de zoekopdracht.

Was dit nuttig?
0

De template

Voorlopig maken we gebruik van de standaard template 'Protostar' van Joomla!. Laten we eens gaan kijken hoe we deze naar…

Voorlopig maken we gebruik van de standaard template 'Protostar' van Joomla!. Laten we eens gaan kijken hoe we deze naar onze hand kunnen zetten.

Ga naar Extensies / Templates / Stijlen. Klik nu op 'Protostar'.

Klik vervolgens op de tab 'Geavanceerd'. Hier kun je de kleuren aanpassen. Ben je op zoek naar een andere kleurcode, dan heb je mogelijk iets aan deze online kleurengenerator.

Je kunt vervolgens een logo uploaden. Een titel en een beschrijving meegeven.

Ook kun je aangeven of je deze template Vloeiend  of Statische wilt weergeven. Oftewel Schermbreed of Boxed. 

Was dit nuttig?
0

Protostar nader bekeken

We gaan dus eerst de mogelijkheden van Protostar bekijken. Ga naar Extensies / Templates / Stijlen. Klik op 'Protostar en…

We gaan dus eerst de mogelijkheden van Protostar bekijken.

  1. ProtostarGa naar Extensies / Templates / Stijlen. Klik op 'Protostar en vervolgens op de Tab 'Geavanceerd'.
  2. Zoals je in de afbeelding hiernaast ziet, kun je de 'Template- en Achtergrond' kleur aanpassen. Klik HIER voor een online kleurengenerator.
  3. Je kan een Logo publiceren. Of een titel in plaats van een logo.
  4. De beschrijving komt onder het logo of de titel te staan.
  5. Tevens kun je ervoor kiezen om de weergave vloeiend of statisch weer te geven.

Experimenteer gerust met de instellingen.

De layout van Protostar

  1. Een Joomla! website is ingedeeld in vakken / module-posities. Deze zie je hiernaast in de afbeelding staan. 
  2. Het is duidelijk dat het logo in de gelijknamige module positie staat.
  3. Het menu wordt getoond in 'position-1'.
  4. Standaard wordt  de 'Hoofd afbeelding' getoond in 'position-3'.
  5. Artikelen worden getoond in de module positie 'content'.
  6. Je hebt in deze template verder de mogelijkheid om zowel links als rechts van de artikelen modules te plaatsen in respectievelijk 'position-8' en 'position-7'.
  7. Onder het content heb je nog ruimte in 'position-2'. Hierin is het kruimelpad geplaatst.
  8. En tot slot rest de positie 'footer'.

Protostar module positiesZelf de posities ontdekken

Ga hiervoor naar Extensies / Templates / Templates. Standaard is het voorbeeld uitgeschakeld. Om deze in te schakelen klik je rechtsboven op 'Opties' en schakel je 'Voorbeeld module posities' in. Nadat je deze hebt opgeslagen keer je automatisch weer terug naar de templates. Klik je nu op 'Voorbeeld', dan zie je de posities staan en tevens welke modules je daarin hebt geplaatst.

Wat wil je waar tonen

Sterk in Joomla! is dat je zelf kan bepalen waar je welke module op welke pagina wilt tonen. 

We nemen als voorbeeld de 'Afbeeldings-module'. 

  1. Ga naar Extensies / Modules en klik op de betreffende module.
  2. Klik op de tab 'Menutoewijzing'. Je ziet dat deze staat op 'Alle pagina's'. Maar we gaan deze alleen op de Homepage plaatsen.
  3. Klik op het selectie menu en kies nu voor 'Aileen op de geselecteerde pagina's'.
  4. Klik nu eerst op op 'geen' om alles uit te schakelen.
  5. Vervolgens vink je 'Home' aan en klik op 'Opslaan & sluiten'.
  6. Check even of het klopt dat je deze niet meer op de overige pagina's ziet staan. 

Een nieuwe afbeelding op de overige pagina's

Je kan dus elke pagina een egen afbeelding geven. Voorlopig doen we het even anders. We gaan er voor zorgen dat op de overige pagina's wisselende afbeeldingen komen in de positie 'Banner'.

Afbeelding plaatsen

  1. Ga naar Inhoud / Media
  2. Maak een nieuwe map aan door op "Nieuwe map aanmaken' te klikken. 
  3. Klik vervolgens op deze zojuist aangemaakte map en upload afbeeldingen die je wilt tonen.
  4. Let hierbij op dat de afbeeldingen dezelfde extensie hebben .jpg of .jpeg of .png 

De module instellen

  1. Willekeurige afbeeldingGa naar Extensies / Modules / Nieuw
  2. Scrol naar beneden en kies voor 'Willekeurige afbeelding'.
  3. Om het herkenbaar te houden geven we het de gelijknagie naam 'Willekeurige afbeelding'.
  4. Bij 'Menutoewijzing' kiezen we nu voor 'Op alle afbeeldingen behalve de geselecteerde'.
  5. Klik op 'geen' om alles uit te schakelen en vink dan 'Home' aan.
  6. Bij positie selecteer je 'Advertentie [banner].

Afbeeldingen Homepage Protostar

  1. Om deze afbeelding aan te passen ga je naar Extensie  / Module en klik je op de 'Image module'.
  2. Pas eventueel de naam aan naar 'Afbeeldings module'.
  3. Klik op de afbeelding en vervolgens op het afbeeldings icoontje in de werkbalk.
  4. Klik dan op Upload en vervolgens op Browse.
  5. Selecteer de gewenste afbeelding op je device en klik op kies.
  6. Klik tot slot rechtsonder op 'Update'. 

Ook nu weer, even checken wat het resultaat is!

Was dit nuttig?
0

Artikel maken - bewerken in Joomla!

Nu website is ingericht, kunnen we de eerste artikelen gaan aanmaken. Ga naar Inhoud / Artikelen en klik eventueel op Nieuw artikel toevoegen.  Of zoek…

Nu website is ingericht, kunnen we de eerste artikelen gaan aanmaken.

  1. Ga naar Inhoud / Artikelen en klik eventueel op Nieuw artikel toevoegen
  2. Of zoek het artikel welke je wilt aanpassen

Zoeken van een artikel

3 manieren:

  • Bladeren door de lijst met artikelen.
  • Typ een deel van de titel in het zoekveld en klik op het zoek-icoontje.
  • Klik op zoekmiddelen en selecteer de categorie waartoe het artikel behoort.

Artikel maken

Ga naar Inhoud / Artikelen en klik op Nieuw artikel toevoegen

  1. Typ de naam van het artikel in het veld naast Titel
    • Bij het opslaan van het artikel wordt de alias automatisch gevuld (de titel met streepjes)
    • Je kan deze ook zelf bepalen
  2. Plaats de cursor in het tekstveld en typ je bericht
  3. Invoegen afbeelding in artikel
    • Klik op het afbeeldingsicoontje
    • Zet de cursor op de regel waar je de afbeelding wilt invoegen, en blader door de mappen of upload een afbeelding
    • De afbeelding wordt automatisch aan de rechterzijde van het artikel geplaatst, met 5px marge en een okerkleurige rand.
    • Je kan de afbeelding verplaatsten door deze te selecteren, te knippen (ctrl x) en te plakken (ctrl v)
    • Pas de grootte van de afbeelding aan door aanpassing van de waarde in het veld dimension
    • Let wel: wanneer je een afbeelding hebt geupload. Dien je deze weer opnieuw te selecteren door op de naam te klikken
  4. Hyperlink invoegen
    • Selecteer het tekstdeel waar je de hyperlink wilt invoeren
    • Klik op het hyperlink icoontje
    • Plak eventueel de hyperlink naar een externe site in
    • Kies bij Target voor Open in new window
    • Je kan interne koppelingen maken door menu of artikelen te selecteren
  5. Categorie
    • Selecteer de categorie waartoe het artikel behoort
  6. Publicatie en Meta gegevens
    • Klik op de tab publicatie
    • Je kan de start publicatie en einddatum bepalen door in de betreffende velden een datum te selecteren
    • De Metagegevens zijn goed om je zoekwaarde te verhogen
    • De metabeschrijving wordt getoond bij een zoekopdracht. Anders wordt de oorspronkelijk tekst gebruikt en afgekort.
Was dit nuttig?
0

Afbeelding plaatsen

De drie afbeelding posities in Joomla! Er zijn 3 posities voor een afbeelding  Afbeelding intro Dit is de afbeelding die…

Er zijn 3 posities voor een afbeelding 

  • Afbeelding intro
    • Dit is de afbeelding die wordt getoond in de modules zoals bij nieuwsberichten
  • Afbeelding volledig artikel
    • Zoals de naam het al zegt, wordt deze getoond wanneer in de module op het artikel wordt geklikt.
  • Afbeelding in het artikel
    • Afbeelding direct binnen het artikel en de tekst positioneren

Ad 1 en 2

  • Media structuurJe klikt op de betreffende knop: 
  • De File Browser wordt geopend
  • Selecteer de folder waarin de afbeelding staat, of moet komen te staan
  • Indien de afbeelding al aanwezig is, selecteer je de betreffende foto
  • Een nieuwe afbeelding kun je uploaden door op de knop rechtsboven te klikken (2e van rechts)
    • Er wordt dan een pop up scherm getoond
    • Klik op de knop Browse
    • Blader op je pc naar de betreffende afbeelding
    • Selecteer deze en klik op 'kies'
    • Klik op de knop Upload
    • Klik op de zojuist geuploade afbeelding (= vetgedrukt)
    • En klik op Insert

NB: een afbeelding verwijder je door op het kruisje in de button Selecteren te klikken.

  • Afbeeldings icoontjeSelecteer de regel van de hoogte waar je de afbeelding wilt plaatsten
  • Klik op de afbeeldings-picto (rode kader)
  • Volg hier de instructie onder Ad 1 en 2
  • Afbeelding detalsWanneer je de afbeelding hebt geselecteerd, gaan we het volgend aanpassen:
    • Dimension geven we de waarde 300 (het is namelijk rustiger wanneer alle afbeeldingen dezelfde breedte hebben
    • De Alternate tekst kun je aanpassen met de titel van het product (verhoogd zoekkans)
    • Aligment zetten we op rechts
    • Margin geven we de waarde 5 (anders komt de tekst direct tegen de afbeelding aan
    • En Border vinken we aan
  • Klik vervolgens op Insertonderaan 

Nieuwe folder aanmaken

  • Klik binnen de File Browserop de map X. of de submap waarbinnen de folder aangemaakt moet worden
  • Klik dan op de Icoon 'Folder aanmaken' (rechtsboven de 1e van links)
  • Type de naam van de folder in (moet een aaneengesloten naam zijn of meerdere woorden verbonden met een - )
  • En klik op OK
Was dit nuttig?
0

EasyCookieInfo