Post on 15-Aug-2015
Versimpel beheer met Joomla modulesEmiel Kwakkel
Emiel Kwakkel is not affiliated with or endorsed by the Joomla Project or Open Source Matters. The Joomla logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.
Emiel Kwakkel
User Experience
Interaction Design
Front-end
Visual Design
AgendaMaak je eigen Joomla Module
1. Introductie
2. Technieken
3. Bouwen
4. Demo
Wat zijn modules?Introductie
Modules zijn lichtgewicht en flexibele extensies voor
Joomla
Custom HTMLOf sourcerer module
Doel van een CMSIntroductie
Het scheiden van content en functionaliteit
Maak beheer makkelijkIntroductie
TechniekenMaak je eigen Joomla Module
XML HTML PHP+ +
XMLSet van gestructureerde gegevens
<persoon><voornaam>Emiel</voornaam><achternaam>Kwakkel</achternaam> <afbeelding locatie="/images/emiel.png" beschrijving="Emiel" /> <interesses>
<interesse type="websites">Joomla</interesse><interesse type="sport">Wielrennen</interesse>
</interesses> </persoon>
tag
element
attribuut
HTMLDe webpagina
<!DOCTYPE html><html lang="nl">
<head><title>Webpagina titel</title>
</head><body>
<h1>Versimpel beheer</h1><p>Met Joomla modules. <br>Vandaag!</p>
</body></html>
Versimpel beheerMet Joomla modules.
Vandaag!tag
element
attribuut
PHPServer-side programmeertaal
<?php// Maak een variabele "test" aan$test = “Ik ben variabel"; // Geef de variabele weerecho $test;?>
Ik ben variabel
PHPServer-side programmeertaal
<?php// Maak variabelen aan$a = 10;$b = 5; // Ga rekenen$delen = $a / $b; // Geef resultaat weerecho "A gedeeld door B = " . $delen;?>
A gedeeld door B = 2
PHPServer-side programmeertaal
<?php// Toon tekst? 1 = ja / 0 = nee$show_text = 1;$text = “Tekst”;
// Moet tekst getoond worden?if ($show_text == 1) { echo $text;} else { echo “Tekst wordt niet getoond”;}?>
Tekst
De mapstructuurWelke bestanden heb je nodig?
helper.php
mod_naam
index.htmlmod_naam.phpmod_naam.xml
tmpl
default.phpindex.html
Verbinding met de database (optioneel)
Standaard html bestand
Variabelen doorsturen naar template
Beschrijf de module
Template map
Standaard view
Standaard html bestand
De mapstructuurHoe werkt het?
mod_naam.xml mod_naam.php default.php
mod_naam helper.php
mod_naam.xmlBeschrijf de module
<?xml version='1.0' encoding='utf-8'?><extension type='module' version='3.1.0' client='site' method='upgrade'> <name>Naam module</name> <author>Naam auteur</author> <version>1.0.0</version> <description>Beschrijf je module</description> <files> <filename>mod_naam.xml</filename> <filename module='mod_naam'>mod_naam.php</filename> <filename>index.html</filename> <filename>helper.php</filename> <folder>tmpl</folder> </files> <config>
mod_naam.xmlBeschrijf de module
<?xml version='1.0' encoding='utf-8'?><extension type='module' version='3.1.0' client='site' method='upgrade'> <name>Naam module</name> <author>Naam auteur</author> <version>1.0.0</version> <description>Beschrijf je module</description> <files> <filename>mod_naam.xml</filename> <filename module='mod_naam'>mod_naam.php</filename> <filename>index.html</filename> <filename>helper.php</filename> <folder>tmpl</folder> </files> <config> <fields name='params'> </fields> </config></extension>
Plaats hierin velden
mod_naam.xmlIn het config element
/** Tekst veld voorbeeld **/<field name='firstname' type='text' default='' label='Firstname' description='' size='10' />
/** Datum veld **/<field name='startdate' type='calendar' default='13-07-2015' label='Start datum' description='' format='%d-%m-%Y' />
/** Media manager **/<field name='main_image"' type='media' directory='stories' />
/** Meer voorbeelden: https://docs.joomla.org/Standard_form_field_types/nl**/
mod_naam.phpGeeft variabelen door aan de template
// Laad in de helper.phprequire_once dirname(__FILE__) . '/helper.php';
// Laad in variabelen$firstname = htmlspecialchars($params->params->get('firstname'));$startdate = htmlspecialchars($params->params->get('startdate'));$main_image = htmlspecialchars($params->params->get('main_image')); // Geef variabelen door aan de templaterequire(JModuleHelper::getLayoutPath('mod_tfblocks', $params->get('layout', 'default')));
default.phpDe template van de module (view)
<p>Hallo <?php echo $firstname; ?></p><?phpif ($main_image != "") {?>
<img src="<?php echo $main_image;?>” alt="<?php echo $firstname;?>"><?php
}?>
StarterskitDownload voorbeeld module
http://emielkwakkel.nl/downloads/presentations/joomla-maak-je-eigen-module/mod_name.zip
mod_naam.zip
The Color RepublicDemo
SnelopgitaarDemo
Curves FranchiseDemo
Vragen?
Vragen?
Connect!@eKwakkel
Emiel Kwakkel
emielkwakkel.nl
joomlacommunity.eu: jEmiel