Joomla, eigen module maken en activeren

Ingediend door Dirk Hornstra op 29-jan-2019 21:26

Bij de website van wergea.com waar ik webmaster ben willen we ook een cookie-melding tonen, iets wat perfect in een eigen module geplaatst kan worden. In een sjabloon van Joomla kun je posities opgeven waar je modules plaatst, in dit geval plaatsen we de cookie-bar onderaan het scherm, in de "bottom" dus. Vervuilt het ook niet meteen bovenin de HTML :)

De twee moeilijkheden waar ik tegenaan loop zijn:

- Die balk krijgt een stukje extra styling. Je kunt in het deel waar je module komt daar een stuk inline <style>..</style> neerzetten. Maar dat is eigenlijk niet zo netjes. Zou ik dit voor mijn eigen site gebruiken, dan zou ik het eigenlijk niet zo willen hebben. Met het volgende stukje code kun je registreren dat je een eigen stylesheet wilt toevoegen, maar vervolgens zie ik niet waar of hoe dit dan in de HTML geplaatst wordt. Ook omdat mijn module onderin (en dus na de rest geladen wordt) vraag ik me af of dit wel kan.


 

$wywPrivacyCurrentDocument = JFactory::getDocument();
$wywPrivacyCurrentDocument->addStyleSheet('/modules/mod_wywprivacy/mod_wywprivacy.css');

- Ik kan een .PHP-bestand maken met de tekst, klaar. Maar die tekst zal nog wel eens gewijzigd moeten worden.
Dus dat moet een beheerbaar veld worden. Even kijken hoe we dat gaan doen.

In dit voorbeeld maak ik een module met de naam "mod_wywprivacy". Ik maak een map met deze naam en plaats daar 4 bestanden in:

  • mod_wywprivacy.xml
  • mod_wywprivacy.php
  • mod_wywprivacy.css
  • index.html (leeg bestand om eventueel bladeren in de map te voorkomen)

 

De bovengenoemde twee mogelijke knelpunten heb ik kunnen oplossen, het tekstveld/de editor kun je als een parameterveld gebruiken, de stylesheet voeg ik met een stukje javascript in de header. Inline javascript is misschien ook niet super, maar vind ik beter dan inline style.

Hierbij het overzicht van de inhoud van het XML en PHP bestand, zodat duidelijk wordt hoe het werkt:

In het .XML-bestand plaats ik de volgende code:


<?xml version="1.0" encoding="utf-8"?>

<extension type="module" version="3.1.4" method="upgrade" client="site">
<!-- Name of the Module -->
<name>WYW Privacy Notice</name>
<!-- Name of the Author -->
<author>Dirk Hornstra</author>
<!-- Version Date of the Module -->
<creationDate>2019-01-29</creationDate>
<!-- Copyright information -->
<copyright>(c)  2019 Solution4u - www.solution4u.nl</copyright>
<!-- License Information -->
<license>May only be used when agreed by Dirk Hornstra</license>
<!-- Author's email address -->
<authorEmail>dirk@solution4u.nl</authorEmail>
<!-- Author's website -->
<authorUrl>www.solution4u.nl</authorUrl>
<!-- Module version number -->
<version>0.0.1</version>
<!-- Description of what the module does -->
<description>Cookiemelding en overige privacy-zaken</description>
<!-- Listing of all files that should be installed for the module to function -->
<files>
<!-- The "module" attribute signifies that this is the main controller file -->
<filename module="mod_wywprivacy">mod_wywprivacy.php</filename>
<filename>mod_wywprivacy.css</filename>
<filename>index.html</filename>
</files>
<languages>
</languages>    
<!-- Optional parameters -->
    <config>
        <fields name="params">
            <fieldset name="basic">
                        <field name="content" type="editor" label="Tekst cookiebar" description="" width="600" filter="safehtml" />
            </fieldset>
        </fields>
    </config>
</extension>

In het .PHP-bestand plaats ik de volgende code:


<?php

// no direct access
defined( '_JEXEC' ) or die('Restricted access' );
$cookieExpiryDate = mktime();
$cookieExpiryDate += (7 * 24 * 3600);
$cookieExpiryDate = date('d M Y H:i:s', $cookieExpiryDate);

$showOrHideCookieBar = " style=\"display:none\" ";
$app = JFactory::getApplication();
$value = $app->input->cookie->get('wyw_privacy', null);
if ($value == null)
{
     $showOrHideCookieBar = "";
}
$parameterData = json_decode($module->params);
?>
<script language="javascript">
try{
     var documentHead = document.getElementsByTagName("head")[0];
     var link = document.createElement("link");
     link.type = "text/css";
     link.rel = "stylesheet";
     link.href = "/modules/mod_wywprivacy/mod_wywprivacy.css";
     documentHead.appendChild(link);
}catch(e){}

function Mod_WywPrivacy_HideCookieBar() {
     try{
          document.cookie = "wyw_privacy=hidebar;path=/; expires=<?php echo $cookieExpiryDate;?> UTC";
          var cookieBar = document.getElementsByClassName("mod_wywprivacy_cookienotice")[0];
          cookieBar.parentNode.removeChild(cookieBar);
     }catch(e){}
}
</script>
<div class="mod_wywprivacy_cookienotice" <?php echo $showOrHideCookieBar;?>>
     <div class="mod_wywprivacy_cookienotice_container container">   
          <div class="mod_wywprivacy_cookienotice_innercontainer">
               <?php echo $parameterData->content;?>
          </div>
          <input type="button" value="Akkoord" class="mod_wywprivacy_button" onclick="javascript:Mod_WywPrivacy_HideCookieBar()" />
     </div>
</div>

Vervolgens maak je een ZIP-bestand van de map. In Joomla kun je dan onder Extensies, Beheren, op de knop Bladeren..  klikken en dan installeren. Als je dan vervolgens naar Extensies, Modules gaat dan zie je dat de nieuwe module er inactief in staat. Klik op de naam zodat je naar het detailscherm gaat. Geef de module een positie (bottom in mijn geval), kies voor status Gepubliceerd. Klik ook nog op het tabblad Menutoewijziging, standaard wordt je module namelijk nergens getoond. Hier kiezen voor "Op alle pagina's" en je bent klaar!