Vervolg: opmaken Joomla template van joomlaxtc. Plaatsen van html blokken.

In mijn vorige blogpost over dit thema heb ik aandacht gegeven aan de module blokken op de voorpagina van template “Motif” van http://www.joomlaxtc.com. Vandaag ga ik proberen om via het invoegen van html blokken formulieren te plaatsen binnen dit design. Ik gebruik daartoe de nieuwe website van een nieuw concept van dewebmeester.nl: Gratis test hosting via www.123web.be (ja ook in Belgie is dewebmeester.nl actief en daar heten we natuurlijk dewebmeester.be). Ik wil dat de bezoeker aan 123web.be makkelijk zichzelf kan aanmelden voor deze gratis hosting. Over het hoe en waarom van gratis hosting ga ik een extra blog post schrijven.

Doel: via html een formulier plaatsen binnen een Joomla template.

Uitwerking: dit blijkt prima te werken via artikelbeheer. Ik kies een artikel uit of maak een nieuw artikel aan en kies na het openen van het artikel in een editor voor “toggle editor” zodat de html code van het artikel getoond wordt. Vervolgens plak ik gewoon het hele html formulier (encrypted javascript formulier) binnen deze code en sla het artikel op. Het resultaat is heel erg goed. De css van de template wordt netjes overgenomen zodat het formulier automatisch past binnen de layout van de template. Het resultaat is te bekijken via: http://123web.be/index.php/gratis-hosting

Conclusie: het is niet altijd nodig om externe modules of componenten te installeren. Vaak kunnen wensen worden uitgewerkt door de code van de applicatie direct te plaatsen binnen dit design. Dit zal overigens niet het geval zijn voor elk Joomla design. Voor dit “bootstrapped” geoptimaliseerde design van Joomlaxtc geldt dit blijkbaar wel.

Visualisering van de structuur van het Open Source Content Management Systeem Joomla!. Gebruikt voor toelichting bij het artikel van joomla. Zelgemaakte afbeelding (Photo credit: Wikipedia)

Hier een afbeelding van een standaard opbouw van een Joomla website. In dit voorbeeld heb ik “inhoud” gebruikt om binnen “template” een formulier zichtbaar te maken op “website”. Dat kan ook via “Component” (formulieren component) of “Module” of “Mambot” (antieke term voor moderne term “Plugin”).

Aanvulling: formulier functionaliteit wordt uitgeschakeld door Joomla editor (JCE) en door Joomla 3.0; de oplossing

Excuses: het verhaal hierboven klinkt te makkelijk. Ja het klopt, het formulier werd mooi weergegeven volgens de css (style sheet) van het Joomla template. Maar dat betekent niet dat het formulier ook werkt. Zoals zo vaak bij invoegen van code (javascript of anders) via de editor (content, artikel of module), wordt de code gestript na klikken op “opslaan” en soms is dit niet zichtbaar (zoals in dit geval).

Oplossing: een oplossing is om een extra module te installeren die is ontworpen om deze code te behouden. Voorbeelden zijn te vinden via deze link:

http://extensions.joomla.org/extensions/core-enhancements/coding-a-scripts-integration/custom-code-in-modules

Ik gebruik voor mijn formulier de “Flexi Custom Code“, installeer de module en plaats het formulier script binnen deze module. Maar: ik wil dit formulier binnen een artikel tonen! Geen probleem. Daarvoor dient “Modules Anywhere” van “NoNumber” waarmee in “no time” elke module binnen elk willekeurig artikel geplaatst kan worden. Ik doe dat ook en het lijkt te werken. Kijk hier voor het formulier (waarmee gratis hosting van dewebmeester.nl besteld kan worden):

http://123web.be/index.php/gratis-hosting

Related articles

• PSD to joomla the most sought after among the clients (teacherlingo.com)
• Design Inspiration: A-T-O-M | Responsive Multipurpose Joomla Theme (designshack.net)
• Joomla Hosting Reviews Announces Redesigned Responsive Website (prweb.com)
• The New Joomla 2.5 to 3 Pre-update Check (ostraining.com)

Test: Joomlaxtc templates. Start: Template “Motif”

Joomlaxtc.com is een gerenommeerde Joomla template club die de laatste jaren ook gespecialiseerd is in WordPress themes. Daarnaast kent deze Joomla club ook een extensies club. Elk Joomla design is een apart verhaal. Ja er zijn overeenkomsten maar de verschillende verdienen aandacht. Zeker de verschillen tussen verschillende templates van verschillende template clubs. De templates van joomlashack.com zien er niet alleen heel anders uit dan de templates van icetheme.com of joomlaxtc.com, ze zijn ook compleet anders opgebouwd.

Dit lijkt mogelijk vreemd. Een template is toch slechts een onderdeel van het hele Joomla pakket? Nee, de template, het design, bepaalt waar welke modules gepubliceerd worden. De template bepaalt hoe het functioneren van de componenten aan de voorkant zichtbaar gemaakt kan worden. Kortom: iedere keer als een klant een bestelling doet bij dewebmeester.nl en iedere keer dat een bepaalde Joomla template deel uitmaakt van de bestelling, dan moeten we ons eerst goed verdiepen in de de volgende vragen: hoe is de template opgebouwd? Via welke modules worden welke artikelen zichtbaar gemaakt? Welke teksten worden via artikelen zichtbaar gemaakt en welke teksten via modules? Welke afbeeldingen zijn onderdeel van een module, welke van een artikel en welke van de template code?

Binnen dit blog (www.dewebhulp.nl ) veel aandacht voor veel templates van veel Joomla template clubs. Ja, ik heb dus nog wat te doen. Laat ik dan maar direct beginnen. Ik begin met de laatst uitgegeven template van Joomlaxtc: “Motif”.

Template wordt geleverd samen met alle bestanden die nodig zijn om na installeren van de template, de website er precies zo uit te laten zien als in deze afbeeling

Dit template is te verkrijgen in de Joomla 2.5 en Joomla 3.0 versie. Ik besluit als eerste de Joomla 2.5 versie te installeren en die is voorlopig te vinden op: http://decmsmeester.nl/joomlaxtc/joomla/motif2.5/

Als eerste ga ik in de backend (/administrator) op zoek naar de drie blokken, het bruine,  het donkerroze en het blauwe blok. Dat zijn modules en nee, het is slechts 1 module. Van het type “JoomlaXTC Deluxe News Pro”. Mooi, denk ik dan, die module hebben we maar vast. Bij openen van de module via modulebeheer (module bevindt zich op positie user 13), wordt duidelijk dat er binnen deze module artikelen geladen worden uit een bepaalde content categorie. Die artikelen vinden we dus onder artikelenbeheer (binnen categorie “Joomla content”). Daar vinden we echter wel wat meer dan 3 artikelen. Bij refresh van de pagina krijg ik dezelfde artikelen te zien op de voorpagina. Er is dus niet sprake van een wisselen van de artikelen. Bij uitschakelen (depubliceren of deactiveren) van het eerste artikel (herkenbaar aan de titel, en altijd via “zoeken” in artikelbeheer te vinden), krijgen we wel een ander artikel te zien na “refresh”. De module blijkt te bepalen welke artikelen er getoond worden en de standaard (demo) setting van deze template is “Joomla order” wat betekent dat eerste drie artikelen (id 1,2 en 3 bijvoorbeeld) getoond worden en de rest niet. Conclusie: mooie optie om snel van voorpagina inhoud te kunnen wisselen en altijd actuele inhoud te kunnen bieden aan de bezoekers. Morgen verder.

Related articles

• Joomla Development: The Advantages and Disadvantages in CMS Features (newsagainstweb.wordpress.com)
• Important: Prevent your Joomla! site being hacked (heartinternet.co.uk)
• WordPress v Joomla: The Infographic (sitepoint.com)
• 25 High Quality Premium Responsive CMS Joomla Templates (prasadprechu.wordpress.com)
• The New Joomla 2.5 to 3 Pre-update Check (ostraining.com)

Template chooser, picker, selector binnen Joomla 2.5

Resultaat van deze dag is te bekijken op http://decmsmeester.nl/joomla2.5/

Nou, vandaag ben ik weer druk geweest met het oplossen van raadsels en na zo’n dag is het verstandig om bevindingen op te schrijven in een blogpost. Ik ben niet de enige met deze wens:
– Een Joomla website waarbinnen verschillende designs / templates zijn geinstalleerd en waarbij de bezoeker zelf kan kiezen tussen deze designs.
Na bladeren op Google lijken vele anderen met deze wens rond te lopen. Toch lijken weinigen hierin echt wat gerealiseerd te hebben.

Waarom?
Omdat ik websites verkoop en elke bezoeker aan mijn website(s) deze gelegenheid wil bieden. De toekomstige klant kan zo "live" en online een design bekijken en uitproberen.

Probleem?
Ja. Het lijkt makkelijk. Ik kan bijvoorbeeld een tien- twintigtal Joomla installaties plaatsen op de server en binnen elke installatie een nieuwe website plaatsen met elke een origineel design en layout. Maar: dat neemt serverruimte in beslag, dat neem database ruimte in beslag en boven alles: de bezoeker moet wel erg veel geduld hebben want elke keer als hij een ander design wil bekijken moet hij wachten totdat de hele website geladen is. Dat is traag. Te traag.

Oplossing?
Mogelijk. Na een dagje werken heb ik in ieder geval een paar antwoorden. De rest laat ik aan u over. Ik ben begonnen met de Joomla extensie "Template Selector" (deze link zou u direct naar deze extensie moeten leiden.) Het betreft een module en een plugin en beiden moeten geactiveerd worden. Als alleen de module gepubliceerd wordt en de plugin niet geactiveerd, dan wordt de template selecter wel zichtbaar (wel leuk, bezoeker ziet in ieder geval screenshots van de templates en dat biedt een miniatuur template gallery!) maar bij klikken op "switch", gebeurt er niets. Maar bij activeren van de plugin, zie je niet alleen de geinstalleerde templates maar is het dus ook mogelijk te "switchen". Het werkt. Ben ik nu klaar? Nee, nog lang niet.

Problemen en oplossingen
Ik wil dat de bezoeker kan kiezen uit tenminste 100 designs. Dan moet ik dus eerst 100 Joomla templates installeren. Dat is niet een probleem. Binnen de module Template Selector, klik ik aan welke van die 100 designs zichtbaar en verkiesbaar moeten worden. Ik kies ze allemaal. Vervolgens naar de frontend (voorpagina) en ik kies een willekeurig design. Daarbij zal ik direct ontdekken dat ik naast "Stijl" (css, style, kleuren, fonts) ook rekening moet houden met "Structuur" (layout, module posities). Het eerste (stijl) lijkt niet het probleem. Dat werkt prima. Maar bij kiezen voor een andere template, wordt de structuur door elkaar gegooid. Meest makkelijke oplossing: alleen templates installeren die allemaal de zelfde structuur hebben. Bijvoorbeeld: ik gebruik alleen templates van DiaBloDesign ; Die zijn allemaal volgens hetzelfde concept opgemaakt. Hetzelfde geldt voor een webbedrijfje als "Globbersthemes". Ook bedenk ik me dat het bekende software programma Artisteer altijd dezelfde structuur produceert en ik besluit daar wat mee te werken.

Ik probeer het met Artisteer versie 3.1 ; Nieuw design, exporteren als Joomla 1.7 design met standaard module posities (position-1, position-2….etc.), installeren als nieuwe template en binnen de module "Template Selector" aangeven dat ook dit design erbij hoort. Naar voorpagina, kiezen voor dit design en klikken op "switch" en……een totaal andere structuur……..; Natuurlijk, ik was tenslotte al begonnen met designs van DiaBloDesign en enkelen van Template Monster ("Architect" en "Traveller"). Die werkten redelijk. Artisteer templates lijken toch anders in elkaar te zitten.

Even een stapje terug: De eerste twee templates waren van Template Monster. Die switchen redelijk goed. Daarna installeer ik drie templates van DiaBloDesign en die tonen redelijk goed maar het topmenu ontbreekt. Vreemd. Nee, toch niet. Template Monster templates plaatsen main menu op positie "navigation" en die ontbreekt binnen DiaBloDesigns en ook binnen de Artisteer designs. Oplossing: main menu module kopieren en publiceren op positie "position-1". Dat werkt natuurlijk alleen als "position-1" op de juiste plaats aanwezig is binnen de nieuwe designs en niet aanwezig is binnen de al geinstalleerde templates. Dat is (vreemd genoeg) het geval. Indien "position-1" ook aanwezig is binnen de templates die ook "navigation" hebben, dan zou het resultaat zijn dat er twee main menu’s getoond worden. Dat kan eventueel opgelost worden door "Advance Module Manager" te installeren van "No Number" en daarin te kiezen dat deze extra main menu module niet getoond moet worden binnen bepaalde templates.

Dit verhaal wordt vervolgd want op dit moment heb ik "slechts" 8 templates naar tevredenheid geinstalleerd binnen de Template Selector en ik ga voor die 100. Nu maar hopen dat ik hierdoor klant krijg……..