Posts from the ‘CMS’ Category

Meerdere gebruikers, 1 website, verschillende opties (WordPress)

Dit is een belangrijk concept en iets dat een webdeveloper in veel situaties nodig heeft: een website die de mogelijkheid biedt aan andere gebruikers (klanten) om zelf een website te onderhouden of te bouwen. Nu lijkt dat makkelijk te realiseren met een (open source) CMS maar algemene probleem lijkt mij dat medegebruikers standaard dezelfde mogelijkheden hebben als de administrator en de andere gebruikers. Bijvoorbeeld: zowel bij Joomla als WordPress hebben mede gebruikers beschikking over dezelfde templates en thema’s als de andere gebruikers. Het is nog niet zo makkelijk om verschillende gebruikers binnen 1 website, verschillende websites te laten bouwen en te onderhouden. Dewebmeester.nl onderzoekt de mogelijkheden en de beste worden op de markt gebracht. Deze week is dat het concept van http://www.mobilewebbuilder.nl : een website waar verschillende gebruikers allemaal verschillende mobiele websites kunnen maken en onderhouden.

In mijn vorige blogpost heb ik aandacht gegeven aan een mogelijkheid om een WordPress plugin beschikbaar te stellen aan andere gebruikers zonder hen toegang tot thema’s of posts van anderen te geven. Dat kan werken voor bepaalde plugins maar zal niet voor alle plugins even makkelijk werken. En in het geval van http://www.mobilewebbuilder.nl (www.mobielesitebuilder.nl) leidde dit niet tot een afdoende oplossing. Want de bedoeling is dat een gebruiker een unieke mobiele website maakt en onderhoudt, via de CMS publiceert en dat die website door een andere gebruiker uiteindelijk niet te bewerken is. En indien elke gebruiker toegang krijgt tot dezelfde plugin (een Mobiele Site Builder plugin), dan zijn die websites door alle andere gebruikers binnen de dashboard via de plugin te benaderen en aan te passen. Dat moet niet.

De oplossing (en ook voor veel andere gelijkende problemen)

De oplossing heeft “Multisite”. Deze optie kan tijdens de installatie van een WordPress geactiveerd worden of eventueel later (zie bijvoorbeeld deze blogpost). De Mulisite optie lost eigenlijk al onze problemen op zoals hierboven uitgelegd. Deze optie maakt ook de “Hack” zoals genoemd in de vorige blogpost onnodig. Dat is mooi omdat we nu geen files hoeven aan te passen (en opnieuw moeten aanpassen na elke update van de plugin). Maar we hebben nu wat andere problemen.

Wat is opgelost:

  1. elke gebruiker heeft een eigen dashboard en geen toegang tot dashboard van andere gebruikers
  2. dus elke gebruiker heeft alleen toegang tot posts van zichzelf en niet van anderen
  3. elke gebruiker heeft toegang tot plugins.

Nieuwe problemen:

  1. elke gebruiker heeft toegang tot alle templates en thema’s en dat lijkt me wat teveel luxe.
  2. elke gebruiker heeft toegang tot alle geactiveerd plugins en ook dat is wat teveel luxe.

Vandaag los ik alleen dit eerste probleem op: ik wil binnen de hoofdwebsite (http://www.mobilewebbuilder.nl) een mooi premium design installeren en kies hiervoor WowWay. Maar vervolgens kan elke medegebruiker (elke klant) ook gebruik maken van dit thema zonder deze template te hoeven kopen en dus zonder een gebruikers licentie te hebben. Nee, dat wil ik niet. De oplossing is de volgende code in wp-config.php:

define(‘WP_DEFAULT_THEME’, ‘wowway’);

Vervolgens activeer ik de template voor het hele netwerk, ga naar dashboard van eigen website en activeer dit thema. Daarna ga ik teru gnaar Network dashboard en deactiveer ik het thema voor het netwerk. Probleem opgelost: mijn eigen site heeft een mooi design, de andere gebruikers hebben niet de beschikking gekregen over dit thema maar kunnen wel aan het werk met de Mobiele Sitebuilder.

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 So...

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

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”.

Joomla template "Motif" van joomlaxtc template club

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.

Marktplaats of Speurders website deel 2

Deze blogpost is een vervolg op blogpost: https://dewebmeester.wordpress.com/2012/11/07/een-marktplaats-nl-website-de-mogelijkheden-prijzen-en-andere-adviezen/ (deel1)

Idee: marktplaats.nl is een populiare website en een populair website idee. Bezoekers kunnen hier niet alleen spullen kopen (= webwinkel / webshop) maar kunnen ook zelf spullen plaatsen en verkopen. De beheerder van de website verdiend niet met de verkoop van spullen maar met de verkoop van advertentie mogelijkheden. Kortom: de bezoeker doet het werk en de beheerder krijgt automatisch verdiensten. Maar welke mogelijkheden zijn er (= biedt dewebmeester.nl) om zelf zo’n website te hebben en te beheren?

Deel 2: Marktplaats/ Speurders website binnen Joomla
De test en demonstratie website: http://decmsmeester.nl/speurders/
Op deze website heb ik “simpelweg” een marktplaats component geinstalleerd. Om die component zichtbaar te maken op de voorpagina (zodat bezoekers er mee kunnen werken), is er een apart menu aangemaakt (ads menu) waarbij de linken koppelen naar de verschillende mogelijkheden van dit marktplaats script.
Zie afbeelding:

Daaronder een extra menu item in Main Menu met de optie “Buy Credits”. De bezoeker kan Credits kopen om zo advertenties te mogen plaatsen. Het verdienen kan beginnen. Verder zijn er natuurlijk allerlei modules verwerkt om de producten leuk en mooi zichtbaar te maken op de voorpagina. Mogelijk belangrijk voor u:
Mocht u een eigen Speurders.nl of Marktplaats.nl website hebben? Dan kan dit makkelijk geintegreerd worden in elke bestaande Joomla website. Daarvoor hoeft u niet een nieuwe Joomla website te laten ontwerpen. Dat kan wel. Op http://www.dewebmeester.nl/joomla-design.html heeft u de keus over honderden zeer professionele Joomla designs voor een kleine prijs. Integratie van het marktplaatsscript in een Joomla website kost via dewebmeester.nl 99 Euro.
Reageren kan via deze blogpost (te vinden op www.dewebhulp.nl) of via email: info@dewebmeester.nl

De volgende blogpost over dit onderwerp gaat over integratie van een marktplaats script in een WordPress website.

Aanpassen menu stijl / layout / css van weebly design

Dit is een vervolg op een vorige blogpost over het importeren van een html website in de online Weebly website builder. Dit importeren is prima gegaan en vervolgens heb ik een aantal zaken aangepast. Heel belangrijk: de {menu} en {content} tags zijn geplaatst en menu en content worden op de juiste plaats weergegeven. Maar wat te doen als ik de layout (stijl) van het menu wil aanpassen? Genoemde voorbeelden hebben betrekking op http://timmerbedrijfstraatman.weebly.com/ , de website die ontstaan is vanuit een PSD file die klant heeft aangeleverd. Zie link.
1) Waarbinnen staat de tag {menu}? In mijn geval binnen een <div id=””> container die betrekking heeft op de achtergrond afbeelding (afbeelding die achter het menu zichtbaar is. Helemaal ok want deze div container bepaald de positie van de afbeelding (div container is geimporteerd bij importeren van het html / css design) en door de {menu} tag binnen deze container te plaatsen (in de index.html file) wordt het menu weergegeven op dezelfde positie als de afbeelding en is de afbeelding dus een achtergrond afbeelding geworden.
2) Wens van de klant is om menu rechts uit te lijnen. In de main_style.css file van weebly
3) Conclusie is dus: de {menu} tag heeft geen eigen stijl definiering en moet een unieke <div class=””> of <div id=””> krijgen om aanpassingen te kunnen doen. Ik ga daartoe naar weebly.com, log in en ga naar de te bewerken website. Kies “all themes” en kies een design waar de menu weergave enigszins overeen komt met de gewenste weergave. Ik bekijk de css / html en kopieer alle relevante css en html code naar Notepad+; Interessant is dat de index.html file slechts 1 menu verwijzing kent terwijl de css file 9 #pietjepuk stijl definities laat zien. Maar alleen de #avmenu definiering is terug te vinden in de index.html file via

<div id=”avmenu”>{menu}</div>

4) Deze code plak ik in oorspronkelijke design (waarvan ik de menu layout wil aanpassen). Oftewel: <div id=”avmenu”>{menu}</div> plaats ik waar nu alleen nog {menu} staat en de nieuwe css verwijzingen plak ik in de main_style.css file (via weebly.com dus eerst weer terug schakelen naar het aan te passen design.). Gebruikte code:

/* side-nav
——————————————————————————–*/

#avmenu {
clear: left;
float: left;
width: 200px;
margin: 0;
font-size: 17px;
}

#avmenu ul {
list-style: none;
width: 200px;
margin: 0;
padding: 0;
}

#avmenu li {
list-style: none;
padding: 0 0 4px;
}

#avmenu li a {
line-height: 1;
text-decoration: none;
color: #878787;
font-family: “Glegoo”, “Myriad Pro”, Arial, Helvetica, sans-serif;
font-size: 14px;
display: block;
padding: 10px 5px 12px 22px;
border: none;
}

#avmenu li#active a,
#avmenu a:hover {
color: #fff;
background: #8fc563;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
}

/* Navigation Drop-Down Menu Customization
——————————————————————————–*/

#wsite-menus > .wsite-menu-wrap {
margin-left: -20px !important;
}

#wsite-menus .wsite-menu li a {
padding: 6px 15px 7px 15px;
background: #8fc563;
border: none;
border-bottom: 1px solid #abd986;
text-decoration: none;
font-family: Tahoma, Geneva, sans-serif;
color: #fff;
}

#wsite-menus .wsite-menu li a:hover {
color: #fff;
background: #6ca33f;
}

5) Perfect. Nu heb ik een menu wat enigszins overeenkomt met het gewenste menu maar belangrijker: ik heb nu een menu wat volledige is aan te passen via de stylesheet (main_style.css). Oftewel: nu kan ik aanpassingen doen door bijvoorbeeld via Firefox en Firebug de code te bekijken en in Notepad+ aan te passen.
Groeten en laat weten of dit helpt of als je aanvullingen hebt.

Caching fijn-tunen van Joomla website

Een kort bericht als vervolg op mijn vorige blogpost over “Page Speed”. Onderstaande afbeelding laat zien hoe ik inmiddels voor www.projektduga.nl een Page Speed heb bereikt van 95/100 en daarmee is deze uitgebreide Joomla website bijna net zo snel als Google.

Dat had ik niet verwacht van Joomla. De “Clue” in dit alles is het gebruik van caching en van compressie. Dat moet op de juiste wijze gebeuren. Caching betekent het tijdelijk opslaan van bestanden die bij de website horen op een server waarbij de computer van elke gebruiker ook een soort “server” is. Compressie is het samenvoegen en verkleinen van meerdere bestanden tot pakketten.

Waar op te letten:

1) Joomla kent een eigen cache en compressie systeem. Het is een goed idee daarmee te beginnen via algemene instellingen    —–> server en ook —— > system. Om dit goed te laten werken moet via pluginbeheer de cache plugin geactiveerd worden.

2) De template heeft mogelijk een eigen cache systeem. Ik gebruik voor http://www.projektduga.nl het Gantry systeem (daar draaien bijvoorbeeld de rockettheme.com templates op). Via tab Advanced kom je bij de cache instellingen voor Gantry en voor de template. Aanzetten is een goed idee.

3) Rocketheme biedt een aantal zeer goede cache plugins (gratis) zoals RokGzipper en Rokbooster. Ik heb RockGzipper aangezet en alles lijkt versnelt goed te werken. Totdat een collega me de volgende doorgeeft dat de layout door elkaar ligt. Met name de fonts zijn anders (groter). Na legen van de cache is alles weer normaal. (Daar kom ik dan ook pas een uur later achter hoor). Geen goede zaak omdat het niet handig is om elke dag de cache te moeten legen en daarmee schakel ik de cache dus eigenlijk uit.

4) Fijn tunen: Advies via Google en Rockettheme forum levert op dat het verstandig is de Gantry cache uit te zetten als Rokbooster (wat ik dan nog niet gebruik) gebruikt wordt. Ik test eerst even door (alleen) de Gantry cache te legen (button rechtsboven binnen Gantry in template manager), browsercache legen en website opnieuw te laden. Ja, de website is dan ook in orde terwijl Joomla cache nog steeds niet geleegd is.

5) Installeren van Rokbooster levert vervolgens alleen maar problemen op.

Kortom de conclusie voor http://www.projektduga.nl is:     Joomlacache aan, Joomla Gzip aan, Rokzipper aan, Gantry cache en Gantry Gzip uit en Rokbooster uit.

Zolang de website een Page Speed van 95/100 heeft, ben ik tevreden.

Ook een Page Speed van 95/100 nodig? Neem even contact op met dewebmeester.nl via info@dewebmeester.nl (Ja dat emailadres bestaat echt. Bij de Gouden Gids leken ze daar niet in te geloven…..)

Wat vind je van WordPress?

Het is al laat maar ik ben enthousiast en dat wil ik graag even opschrijven. Na een dag teleurstellend “aanrommelen” (kon maar geen inspiratie vinden) heb ik de dag toch afgesloten met motivatie. En deze keer betreft dat: WordPress. Ik heb al vrij vaak vragen gehad zoals: “Wat vind je van WordPress?” en “Doen jullie ook iets met WordPress?”. In deze blog post mijn eerste reactie op die vragen:

Wat vind dewebmeester.nl van WordPress?
Basaal, eenvoudig. Dat kan een reden zijn om er niet aan te beginnen. Dat zou heel erg jammer zijn. WordPress is een kleine, snelle sportwagen. Een soort “Porsche”. Joomla is meer een “Hummer”. Bij openen van de motorkap van WordPress (admin panel) zie je mogelijk niet direct de kracht en de mogelijkheden. Maar die zijn er wel degelijk. Bij Joomla lijken klanten bij het openen van “Administrator” vaak overweldigd te worden door de mogelijkheden. Een lijstje; wat vind dewebmeester.nl van WordPress (ten opzichte van Joomla):
Snel. Vooral het admin panel opent snel en ik ben vooral enthousiast over de button “Save” die je overal tegenkomt en die de aangepaste gegevens zo snel opslaat dat ik soms me wat onzeker voel. Is het nu echt opgeslagen of word ik voor de gek gehouden? Joomla ververst de hele pagina na iedere “Save”. Vraag me af wanneer ze dat gaan aanpassen.
Simpel. Joomla kent componenten (uitgebreide toepassingen), modules (zichtbare eenheden aan de buitenkant), plugins (onzichtbare code) en content (de artikelen). WordPress kent “Posts”, “posts”, “posts” en dan nog een paar plugins en versleepbare widgets.
Drag en drop. Daar ben ik een voorstander van. Gewoon omdat dit prettig is. Ook daarbij geldt: dat gaat snel. Gewoon slepen naar de juiste plaats en de widget en aanpassingen hoeven vervolgens niet eens opgeslagen te worden. Na het slepen is de aanpassing al doorgevoerd.
– Snelle uitbreiding mogelijk. Het pluginbeheer is uniek in verhouding tot Joomla (al denk ik dat dit in Joomla ooit aangepast gaat worden). Plugins geven iets extra’s aan de website. Ik had vanavond een contact formulier nodig. Ik ga naar “plugins” en daat zie ik een zoekbalk. Kijk, bij Joomla ontbreekt dat. Daar moet ik eerst naar Google en aan meneer Google vragen of er ergens in de wereld een Joomla extensie bestaan die te gebruiken is binnen mijn idee en concept. Maar WordPress heeft gewoon zijn eigen geintegreerde zoekfunctie. Ik type “Contact form” em jawel, ik zie een twintigtal mogelijkheden die ik met enkele klikken kan integreren in mijn website. 1) zoeken, 2) installeren 3) activeren en 4) slepen naar de juiste positie. Snel geleerd en nog leuk ook.

Doet de webmeester.nl ook aan WordPress?
Jazeker! Ik onderhoud een vrij populair blog wat te vinden is via www.dewebhulp.nl (dewebmeester.wordpress.com ). O ja, dat wist u al want dat is het WordPress blog waar u zich nu bevindt. Elke dag vinden tientallen mensen hier antwoorden op hun vragen. Ook biedt de webmeester.nl via de website een overzicht aan WordPress mogelijkheden en designs (http://dewebmeester.nl/wordpress.html ). Verder zijn er in het verleden verschillende acties geweest betreffende WordPress sites (zie: https://twitter.com/dewebmeester/status/243573824753385472 ). Maar ik heb vanavond sterk het gevoel dat we te weinig aandacht hebben gegeven aan WordPress in verhouding tot de aandacht die Joomla bij ons heeft gekregen. Beide systemen hebben zo hun voor- en nadelen en ik zal daar in andere blog posts meer aandacht aan geven. Reacties gewenst!

P.s.: Bijna vergeten te vermelden maar www.dewebmeester.nl heeft zich verbonden aan het concept www.dewordpressmeester.nl ; Daarmee is denk ik wel duidelijk gemaakt hoe dewebmeester.nl WordPress wardeert. Positief! Neem ook even een kijkje op www.dewordpressmeester.nl (WordPress website van dewebmeester.nl).

%d bloggers liken dit: