Test: snelheid van Joomla website aanpassen

Joomla is een uitgebreid CMS systeem. Het biedt zoveel mogelijkheden dat er een probleem kan ontstaan: de website wordt traag. Nu lijkt Joomla 1.7 sneller dan 1.5 maar toch is het goed om het een en ander te testen. Gisteren heb ik daar aardig wat tijd aan verloren en om dit goed te maken deel ik hierbij mijn ervaring. Ik bedacht drie mogelijkheden en heb die vergeleken:

1. Uitgebreide joomla website op een trage server in de USA


2. Zelfde Joomla website, zelfde server met versnellers (componenten, plugin, extensies) geinstalleerd (http://www.webogroup.com/)


3. Kopieren van de Joomla website (zelfde site, zelfde server) als HTML/CSS website en opnieuw uploaden (zelfde server in USA) en laden als HTML/CSS site in plaats van een Joomla php site. (Heeft iemand hier wel eens aan gedacht? Lijkt een rare mogelijkheid omdat CMS hiermee wordt uitgeschakeld en daar ging het toch om? Maar: stel dat het lukt om alleen de voorpagina compleet te kopieren en verder de rest door te linken naar de Joomla installatie, en stel dat dit snelheidwinst oplevert, dan komen de bezoekers tenminste snel op de homepagina zonder te hoeven wachten.....)


4. Verhuizen van deze Joomla website naar een server in Engeland (dichter bij).

Uitslag:

1. - Het duurt 15 seconden voordat de website verschijnt. Soms zelfs 20 seconden. Dat betekent dat de website mogelijk beter niet zou kunnen bestaan. Een trage website is echt antireclame: http://decmsmeester.nl/joomlapakketten/


2. - Versnellers versnellen. Maar niet genoeg. En ook nu duurt het minstens 12 seconden voordat de website verschijnt. (meer aandacht aan versnellers in ander artikel)


3. - Dat gaat een stuk sneller! 5 seconden. http://decmsmeester.nl/joomlapakketten2/ Maar: het is niet gemakkelijk om een Joomla website op de juiste wijze te kopieren en een aantal functies van de homepagina kunnen natuurlijk verloren gaan tijdens dit kopieren. En: Joomla CMS werkt nu niet meer voor de voorpagina. Maar een heel serieuze optie waar www.dewebmeester.nl in een aantal gevallen zeker gebruik van gaat maken. Ook interesse om uw Joomla website (geheel) om te zetten naar HTML/CSS? Dat kan vanaf 99 Euro inclusief installatie. Stuur even een mailtje. IN een ander artikel zal ik aandacht geven aan de zin en onzin van het kopieren van een website en de technische mogelijkheden.


4. - Ook dit levert veel winst op. http://joomlamarket.info/dejoomlameester.nl/ Twee keer zo snel in vergelijking tot de server in de USA: laadtijd tijdens test was 8 seconden. Duurder? Nee, goedkoper. Ongeveer 7 Euro per maand. Via www.decmsmeester.nl vanaf 2.50 Euro (zie de getoonde website in dit artikel).

Ik denk dat ik de uitdaging aanga en www.dejoomlameester.nl koppel aan de HTML/CSS frontpage. Ben benieuwd of iemand van jullie het verschil bemerkt.
Groeten; info

Nieuwe Joomla designs bij dewebmeester.nl

Deze week ben ik aan het werken met de premium Joomla designs van Gavick.com ; Die zien er niet alleen fantastisch uit maar ze blijken ook nog goed in elkaar te zitten. Ik heb een aantal op de www.joomlaweb.info server geplaatst en hier kunt u meekijken:







- http://joomlaweb.info/cuttingedge/
- http://joomlaweb.info/gomu/
- http://joomlaweb.info/shoptrix2/

Ik krijg nog te vaak de vraag: "Is het verstandig om zo'n compleet design te bestellen of kan ik beter kiezen voor een eigen ontwerp?" Het antwoord is tien keer: kies voor een compleet ontwerp. Bij Joomla gaat het niet alleen om de buitenkant (de plaatjes, layout, css) maar net zo goed om de binnenkant. En daarmee bedoel ik het afgestemd zijn van de verschillende componenten en modules en de wijze waarom die samenwerken met de layout. Grote voordelen van het bestellen van zo'n compleet design:

- snelle start mogelijkheid
- direct inzicht in de mogelijkheden van de modules en moduleposities
- goedkoop (vanwege tijdsbesparing)
- je surft mee op de jarenlange ervaring van een professioneel designer die zijn product voor een habbekrats op de markt verkoopt.

Waarom niet? Tegenargument is: "ik wil geen kloon, ik wil iets unieks." Helaas, dat werkt niet. U kunt niet verwachten om vanuit nul ervaring een unieke website te kunnen fabriceren. Het webbureau dat u dit aanbiedt, zadelt u op met de onnodige last om origineel materiaal aan te leveren. Het goede nieuws luidt: als u uw logo aanlevert, uw eigen wensen betreffende layout en illustraties, uw teksten en productillustraties en u laadt mij toe om 1 van de duizenden professionele designs op te maken naar uw wensen, dan heeft u snel, en voor een eerlijk tarief de meest unieke website die u maar kunt bedenken en tegelijkertijd een website om trots op te zijn omdat het de handtekening draagt van een gerenommeerde en professionele webdesigner. En dat alles kan het webbureau om de hoek u niet bieden voor 249 Euro. Wij wel.

Iedere week een nieuw design en uitleg

Elke week zijn er nieuwe acties bij Spiderman Webdesign. We zoeken de hele wereld door en stropen het internet af op zoek naar het beste van het beste op gebied van webdesign. Zo zijn we uitgekomen bij de beste designers en tevens de beste webbeheer systemen. En die beide zaken combineren we en stoppen we in pakketten die het beste aanbod van Nederland vertegenwoordigen.
Maar in de praktijk levert dit veel vragen op. Wat is er allemaal nodig om een goede website te starten? Zijn er bijkomende kosten? Hoe ga ik zelf mijn website onderhouden? Of kan ik dit beter overlaten aan www.dewebmeester.nl? Elk design heeft hierin zijn eigen verhaal. Er zijn standaard antwoorden maar er zijn ook niet standaard antwoorden. Nu hebben we besloten om elke week extra aandacht te geven aan deze niet standaard antwoorden. Elke week publiceren we nieuwe designs en die zullen we bekent maken via Twitter en op www.dewebhulp.nl ; We zullen vervolgens elke week 1 nieuw design extra aandacht geven door informatie te geven over (bijkomende) kosten, mogelijkheden om snel te starten met dit design, hostingmogelijkheden, technische details en beheersmogelijkheden. Dit zou in de loop van de tijd een heerlijk handboek moeten worden betreffende webdesign en webbeheer, cms systemen en design mogelijkheden voor startende ondernemers maar ook voor iedereen die een eigen website heeft of zou willen hebben. Uw vragen zijn altijd welkom en probeer bij elke vraag aan te geven op welk design uw vraag betrekking heeft.
Hartelijke groeten namens www.dewebmeester.nl
Ir. Meindert A. Jorna

html2joomla ; Hoe makkelijk is het?

Dat is vandaag de centrale vraag. Laat ik beginnen met een antwoord: het is niet makkelijk.

Start: ik neem een mooi design van dreamtemplate.com ; hij staat online op http://decmsmeester.nl/html2joomla/ Deze gaan we ombouwen naar een compleet werkende Joomla template (voorlopig resultaat is te zien op: http://decmsmeester.nl/joomla/ ).



Hierbij een aantal moeilijkheden die te overwinnen zijn:
- belangrijk om te beginnen met een html/css site
- index.html moet index.php worden
- Code in index.php file (de vroegere index.html file) moet worden aangepast en eerste stap is: alle code voor de <body> tag vervangen met:

<?php // no direct access defined( '_JEXEC' ) or die( 'Restricted access' ); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" > <head> <jdoc:include type="head" /> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" /> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" /> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/your_template_name/your_css_directory/your_css_file.css" type="text/css" /> </head>

Vervolgens moet natuurlijk de linken naar de stylesheets worden aangepast en tevens eventuele linken naar javascript files worden toegevoegd. Voorbeeld:

<script type="text/javascript" src="js/jquery.v1.4.2.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.min.js"></script>
<script type="text/javascript" src="js/custom.js"></script>

Module posities bepalen

Vervolgens moeten de moduleposities binnen de index.php file worden aangegeven. Dit doen we via de code:

<jdoc:include type="modules" name="top" />

Elke modulepositie heeft een eigen naam en die moet natuurlijk worden aangepast.
Nu zitten we zo'n beetje op het moeilijke gedeelte: waar zetten we die code precies neer? De meest zekere weg: ik maak gebruik van de standaard template binnen de standaard Joomla 1.5 installatie. Open de index.php file binnen van die template binnen notepad+ en zoek waar ik de tekst jdoc:include type="modules" kan vinden. Elke keer als ik die tekst tegenkom, kopieer is de verwijzing (de eerste is: <jdoc:include type="modules" name="top" /> ) en plak die binnen de nieuwe index.php file op een plaats die overeenkomt met de plaats binnen de standaard index.php template file. Dat doe ik voor alle module posities. (Let op: het verwachte resultaat wordt een website in de stijl van de html/css file maar met de structuur van de standaard joomla template. Als je een andere structuur wilt dan is het verstandig om eerst op zoek te gaan naar een andere template met de gewenste structuur.)

Na plaatsen module posities en de code voor plaatsen componenten:

<jdoc:include type="component" />

Vervolgens moet de 'templateDetails.xml' file worden aangemaakt en daartoe gebruik ik de templateDetails.xml file die bij de template hoort waarvan je de module structuur heb overgenomen (de standaard Joomla template in mijn geval). De linken die binnen deze file genoemd worden (file openen in notepad+) moeten allemaal verwijzen naar bestanden binnen de templatefolder. Kortom: alle links moeten aangepast worden. Ook moet er hier een template_thumbnail.png file worden aangemaakt zoals in deze XML file genoemd wordt.

Installeren van de nieuwe template

Alles wordt daarna ingepakt in een .zip file en via de extension manager als template geinstalleerd binnen de standaard Joomla installatie.


En zelfs als dit dan werkt, heb je nog heel veel tijd nodig om alles zo aan te passen dat het er goed uitziet...

Uploaden images naar root image map

Dit vond ik vreemd: de installatie van de template verliep prima en het instellen van de template als standaard ook. Maar: ik zag geen enkele image. Terwijl in templateDetails.xml file was aangegeven welke image files behoorden bij dit design, moeten images toch nog worden geupload naar de image folder binnen de root en niet binnen de image folder van de template folder. En ja hoor, de images verschijnen: http://decmsmeester.nl/joomla/

Javascript laten werken binnen Joomla design

Javascript blijkt nog niet te werken. Daar ga ik even aan werken......

Ja, ook dat werkt nu! Ook hier was het probleem de verwijzing naar de javascript files. Ik heb  nu niet de files verhuisd maar wel de linkverwijzing in de index.php file behorend bij de template. Omdat de CMS geinstalleerd staat binnen een subfolder van de root http://decmsmeester.nl (folder: joomla) moet ik voor alle linkverwijzingen naar javascript files gewoon /joomla plaatsen en het werkt (zie de slider bovenaan de pagina: http://decmsmeester.nl/joomla/ )

Nu nog even 'finetunen'.

p.s. Vergeet niet te kijken naar de blogpost over het ombouwen van een html site naar een Joomla 2.5 template! Dat lijkt makkelijker te zijn: http://dewebmeester.wordpress.com/2012/04/12/html2joomla-gelukt-voor-dreamtemplate-com-template-naar-joomla-2-5-theme/

SEO? Back in the race wat betreft Joomla!

Een jaar lang heb ik me niet druk gemaakt wat betreft vindbaarheid via Google voor wat betreft mijn Joomla onderneming. Joomla is uitgegroeid tot een gigantisch netwerk en community en het lijkt bij voorbaat uitgesloten om wat betreft zo'n populair onderwerp ergens boven in de ranking van Google terecht te komen. Al was me dat overigens wel eerder gelukt wat betreft "Advies Kroatie". Tijdens die SEO campagne had ik de Nederlandse ambassades en Ministerie van Buitenlandse Zaken achter me gelaten en vertelde Google aan iedere bezoeker die daarom vroeg, dat ik een betere adviseur was betreffende Kroatie dan welke Nederlandse ambtenaar dan ook.
SEO is een sport en het kan klanten opleveren. En zo heb ik toch weer een maand mijn best willen doen om ook wat betreft Joomla de bovenste regionen van Google Nederland te bereiken. En dat is gelukt. Ik bewaar de screenshots even als aandenken en bemoediging: serieuze ondernemers kunnen gevonden worden. Dat is goed te regelen door de juiste aandacht te geven aan SEO (Search Engine Optmalization). De illustraties hieronder zijn het bewijs. (Voor het zoekwoord "Joomla" - zonder ander zoekwoord - sta ik op dit moment op de elfde plaats maar dat was niet leuk op een afbeelding te krijgen. Bedenk bij onderstaande afbeeldingen dat de concepten 'decmsmeester.nl' en 'Spiderman Webdesign' concepten zijn van mijn bedrijf: Samuel Services)
[gallery]

Weebly en SEO

Vandaag zit ik weer heerlijk te worstelen met alle mogelijkheden en onmogelijkheden van de Weebly webbuilder. Ik raak er steeds meer van overtuigd dat deze 'sitebuilder tool' onderschat wordt en te weinig gebruikt wordt. Na een periode van boosheid en frustratie (waarom zoveel betalen voor verwijderen reclame?) volgde ene periode van heerlijke ontdekking. Nee, ik ga zeker niet al mijn geheimen prijsgeven. Ik ben tenslotte ondernemer. Maar toch even een tipje van des sluier oplichten

Het probleem: SEO optimalisatie

Bij gebruik van de Weebly webbouwer, wordt je een subdomeinnaam aangeboden. Bijvoorbeeld: cheap-web.weebly.com Mijn domeinnaam www.dewebmeester.nl laat ik doorverwijzen naar dit Weebly subdomein. Resultaat: bij intikken van dewebmeester.nl , wordt de bezoeker netjes doorverwezen naar cheap-web.weebly.com en wordt zichtbaar wat ik binnen die online webbouwer gemaakt heb. So far so good. Toch?

Nee, niet goed. Want wat betekent dit voor de vindbaarheid (SEO) voor mijn website. Twee antwoorden. cheap-web.weebly.com wordt goed gelezen (tags, metatags, content, header, footer, alles wordt geindexeerd) maar dewebmeester.nl is een lege huls. Op zich niet een heel groot probleem omdat de website via cheap-web.weebly.com dus toch geindexeerd wordt. Maar toch ook wel een probleem want als ik mijn website aanmeldt bij bijvoorbeeld een startpagina (webdesign.intrastart.nl) dan geef ik daar natuurlijk de domeinnaam dewebmeester.nl door en niet cheap-web.weebly.com Stel: Ik wil me slechts druk maken om 1 domeinnaam, dan heb ik het volgende bedacht:

Oplossing?

Weebly biedt echt erg professionele (en vrij onbekende) mogelijkheden. Mijn doel: de complete website zoals binnen Weebly gemaakt, verhuizen naar mijn eigen server zodat ik domeinnaam direct kan linken aan de website (en niet via een subdomeinnaam van Weebly). Na inloggen in mijn weebly account klik ik op tab 'settings' en dan zie ik onderaan een optie "archive/ unpublish" en daar klik ik op.

Vervolgens kan ik de hele site als .zip file opslaan om mijn computer en uitpakken en uploaden naar de server van mijn keus. Nu heb ik ineens 2 websites. De ene wordt opgemaakt en onderhouden via de Weebly online sitebuilder en is te zien via cheap-web.weebly.com, de andere staat op mijn server en is gekoppeld aan domeinnaam dewebmeester.nl Nu heb ik twee 'searchable' sites.

Wordt vervolgt (ik ga eerst even dit alles toepassen en SEO aanpassen).

Groeten!

Nieuwe actie: de boekenplank van dewebmeester.nl

Beste mensen,



Na de leuke ipad2 actie (die nog steeds loopt), heb ik besloten om op info en laat dit design geheel voor u opmaken voor: 299 Euro. (ex BTW); Nee, dat doe ik niet. Die actie geldt voor alle twittervolgers. Wat ik wel doe: voor alle bestaande en oude klanten wil ik zo'n uniek design inclusief functionaliteit installeren bij ons op de server en ik doe er vervolgens nog 12 maanden gratis Joomla hosting bij en stel een database in en...... stuur maar op die wensen en dan doe ik dat voor: 249 Euro. (ex BTW). Weet je wat, ik haal de BTW er ook nog even af voor jullie. 249 Euro inclusief BTW, eenmaal, andermaal, verkocht? Om de boekenplank te bekijken surf je naar www.dewebmeester.nl

Let op: deze actie is geldig 5 oktober 2011;

Ir. Meindert A. Jorna (Msc.)

Savornin Lohmanstraat 45

6702BN Wageningen

☎ 0317 795149

Mob. 06 412 86716

☒ info

www.meindert.info

My profiles: Facebook LinkedIn Flickr Twitter
My blog: dewebmeester.nl is weer in Wageningen

Latest tweet: Nieuwe websites op de boekenplank van dewebmeester.nl: http://t.co/19lNJy6E compleet: opmaak en cms voor 299 Euro! Follow @dewebmeester Reply Retweet 10:32 Sep-21

Get this email app!

cms binnen facebook, deboekenplank.nu en meer nieuws

Beste mensen,

Het is maandag, ook bekent als de dag waarop de werkweek weer begint. Ik hoop dat jullie er allemaal net zo'n zin in hebben als ik. Om de week op te vrolijken hier het nieuws van dewebmeester.nl:

- Er staan nieuwe designs en websites op de boekenplank van www.dewebmeester.nl! Net zoals vorige week worden deze aan bekende klanten van dewebmeester.nl tegen actietarief verkocht. En "unlike" anderen: hier wordt niet alleen het design gekocht maar tevens de complete opmaak van de website.

- De actiewebsites zijn te vinden op www.deboekenplank.nu en is dus onderdeel van www.dewebmeester.nl (ook via die website te bereiken)

- Waarom heb ik nu geen prijs genoemd? Omdat ik jullie wil uitdagen zelf een prijs te noemen. dewebmeester.nl werkt aan een nieuw prijzensysteem waar de grotere en commercielere bedrijven meer gaan betalen en privepersonen of stichtingen minder. Deze week zijn prijzen nog niet 'fixed' en is de uitdaging om voor een zo laag mogelijk tarief een zo professioneel mogelijke website te krijgen. Kijk op www.deboekenplank.nu of zoek op www.dewebmeester.nl naar een leuk ontwerp, maak een lijstje met wensen en geef aan hoeveel je wensen waard zijn en hoeveel je ervoor zou willen betalen om die wensen te realiseren. De kans is groot (alleen deze week) dat het bod geaccepteerd wordt.

- Nieuw project: al eerder heb ik aangegeven dat dewebmeester.nl prachtige Facebook designs aanbiedt en dat het ook mogelijk is om een bestaande website te integreren in Facebook. Maar: wat dacht u van een complete CMS binnen Facebook? U surft op Facebook, chat met vrienden en ondertussen beheert u uw eigen website, plaatst foto's, past teksten aan enzovoorts. Daarna klikt u op "Save" en uw Facebook pagina geeft weer de actuele informatie van uw bedrijf. Dat betekent dat u voor het onderhoud van uw Facebook pagina nooit meer een webmaster nodig heeft en zelfs niet dewebmeester(.nl). Interesse? Vraag om een demonstratie en mogelijkheden.

Hartelijke groeten en tot snel!

U heeft een website maar geen webmeester? Dan is uw website "out of date" en was het beter geweest als u helemaal geen website had.
U heeft een webmeester maar niet DEwebmeester(.nl)? Dan heeft u waarschijnlijk hoge kosten en veel kopzorgen.

Ir. Meindert A. Jorna (Msc.)

Savornin Lohmanstraat 45

6702BN Wageningen

☎ 0317 795149

Mob. 06 412 86716

☒ info

www.meindert.info

My profiles: Facebook LinkedIn Flickr Twitter
My blog: dewebmeester.nl is weer in Wageningen

Latest tweet: De beste acties van www.dewebmeester.nl nu op www.deboekenplank.nu Follow @dewebmeester Reply Retweet 23:56 Sep-23

Get this email app!

Facebook integratie

Een succes product van ww.dewebmeester.nl is de integratie van een (bestaande) website binnen Facebook. Hierbij dan ook een verkort overzicht betreffende dit onderwerp.
Facebook integratie van een bestaande template (design in eigendom van klant):
- Kosten: 49 Euro ex BTW
- inclusief hosting (tenzij de klant de template zelf wil aanpassen)
- inclusief 1 maand ondersteuning
Opmaken van template (voor integratie):
- Kosten: 49 Euro ex BTW
- inclusief aanpassen basisillustraties
- inclusief plaatsen informatie (tekst)
Hosting (in geval klant template zelf wil onderhouden)
- 2 euro per maand (ex. BTW)
Facebook design
- Vanaf 25 Euro; tot 60 Euro. Dit betekent een compleet werkende website en eventueel inclusief webshop.

Integratie binnen Facebook pagina wordt binnen 24 uur gerealiseerd; Opdrachten worden alleen geaccepteerd na ontvangst betaling. Klant wordt geadviseerd om alle wensen samen te vatten en als eerste om een offerte te vragen.

Hartelijke groeten,

Ir. Meindert A. Jorna (Msc.)

Savornin Lohmanstraat 45

6702BN Wageningen

☎ 0317 795149

Mob. 06 412 86716

☒ info

www.meindert.info

My profiles: Facebook LinkedIn Flickr Twitter
My blog: dewebmeester.nl is weer in Wageningen

Latest tweet: Nieuw op http://t.co/VIaNRJx2 : de ipad http://t.co/z2kKOCUs Follow @dewebmeester Reply Retweet 14:43 Sep-27

Get this email app!

dewebmeester.nl is weer in Wageningen

Beste mensen,

Het is gelukt: we zijn weer in Wageningen. Vanaf morgen verwacht ik vol goede moed het werk weer op te pakken. Zeker gezien het feit dat de reis een grote financiele tegenslag was (pech onderweg en daardoor vertraging, reparatie, extra overnachtingen) ben ik zeer gemotiveerd om hard aan het werk te gaan. Laat dus gerust weten als je haast hebt met bepaalde zaken. Ik verwacht op zich tot dinsdag alle lopende zaken / bestellingen op orde te hebben.
Hartelijke groeten en tot horens, bellens, schrijfs of tot ziens,
Meindert A. Jorna
www.dewebmeester.nl
www.dewebmeester.info
www.dewebmeester.com
www.cheap-web.nl

Ir. Meindert A. Jorna (Msc.)

Savornin Lohmanstraat 45

6702BN Wageningen

☎ 0317 795149

Mob. 06 412 86716

☒ info

www.meindert.info

My profiles: Facebook LinkedIn Flickr Twitter
My blog: Een eigen unieke webpagina binnen een facebook pagina

Latest tweet: Ik kom naar Nederland! Nieuwe kansen voor (nieuwe) klanten voor overleg!Follow @dewebmeester Reply Retweet 09:31 Sep-01

Get this email app!

Een eigen unieke webpagina binnen een facebook pagina

Dit leek me een perfecte oplossing: Facebook.com is inmiddels zo ongeveer de best bezochte website van de wereld en groeit alleen maar in populariteit. Maar een facebook pagina kan niet concurreren met een eigen persoonlijke en professionele webpagina. Daarvoor is facebook niet serieus genoeg en wordt er nog teveel onzin verkocht en geschreven. Maar een combinative leek me perfect: een eigen persoonlijke en professionele webpagina binnen een facebook (bedrijfs) pagina. En het is me gelukt. Het resultaat is te zien door:

• In te loggen in facebook.com
  
• Zoeken op ' Spiderman Webdesign' en vervolgens zie je aan de linkerkant van die pagina een aantal linken met ' webpagina, webpagina2, webpagina3, webpagina4, webpagina5….' ; Klik op een link om het resultaat te zien;
  
• Sneller is de directe link: http://www.facebook.com/pages/Spiderman-Webdesign/187978994572024 (om op pagina van Spiderman Webdesign te komen) of http://apps.facebook.com/spidermanwebdesign/ om een voorbeeld van een geintegreerde website die hier geplaatst is als applicatie binnen facebook.com (maar dat is een technisch verhaal wat u mogelijk niet nodig heeft).
  

Wat ik hier verder schrijf is als eerste voor mezelf bedoeld. Het duizelt me nogal. Ik ben blij dat het me gelukt is deze unieke functie te activeren en mij facebook pagina ziet er nu tenminste wat professioneler uit dan het kale facebook design. Maar hoe heb ik dit gedaan? Ik heb gebruik gemaakt van twee verschillende mogelijkheden. 1) Static FBML en 2) iframe applicatie waarbij nummer 1 heel wat makkelijk is. Maar het slechte nieuws is dat facebook vanaf 18 maart geen nieuwe FMBL applicaties meer accepteert. Dat is dan ook de reden dat ik vandaag via FBML nog even snel een lijstje met website designs ga integreren zodat die in ieder geval nog dit jaar zichtbaar zijn voor klanten van Spiderman Webdesign. Maar optie 2 is dus eigenlijk belangrijker omdat deze optie ook na 18 maart de geldende optie zal blijven. Het stappenplan hiervoor:

1. Aanmelden op facebook en in zoekbalk van facebook zoeken op ' developer' ; deze applicatie toevoegen aan pagina
   
2. Naar de applicatie toegaan en nieuwe applicatie aanmaken
   
3. Alle gegevens invullen.
   
4. Het design en websitebestanden uploaden naar een bepaalde map op de server
   
5. De canvas URL binnen developer applicatie aanpassen; Ziet er zo uit bij mij:
   

   Canvas Pagehttp://apps.facebook.com// (dit is een zelfbedachte naam om later de applicatie en bijbehorende webpagina makkelijk terug te vinden)
   

   The base URL of your app on FacebookCanvas URL (de root map van het design)
   

6. Onder tab 'mijn toepassingen' klikken op de aangemaakt toepassing en onderin staat een link
   

Zie er als volgt uit: Voorbeeldcode

Snel aan de slag met wat voorbeeldcode!

1. Klikken op die link, de getoonde code kopieren naar een nieuw aan te maken index.php bestand (via notepad++) en dit nieuwe bestand ook uploaden naar de rootmap van het design op de server.
   
2. De bestanden downloaden zoals getoond op de applicatiepagina onderaan. " Download the client library" ; deze uitpakken, de map uploaden naar de root van het design en de naam van de map op de server aanpassen zoals getoond in ' voorbeeldcode' .
   
3. En toen bleek de pagina zichtbaar te worden via http://apps.facebook.com/spidermanwebdesign/ terwijl ik gewoon de andere facebookactiviteiten zoals chat kan voortzetten.
   

Importeren van complete html website in weebly sitebuilder

Vandaag is weer eens een dag dat het onmogelijk waarheid lijkt te worden. Even zoeken op internet leert ons dat het niet mogelijk is een complete website te importeren in de gratis weebly.com sitebuilder. Dat zegt Weebly. Logisch. Stelt u eens voor: u koopt een mooi design (via www.dewebmeester.nl voor 19 Euro,éénmalig) en stopt dit in de gratis weebly sitebuilder en vervolgens maakt u fluitend uw website verder op……. Wat heeft Weebly daar aan? Niets. Het resultaat zou zijn dat hun servers overspannen zouden raken. Nou, beste Weebly, maak uw borst maar nat! (Vreemde uitdrukking overigens….). Het lukt me. Op het eerste gezicht heel veel makkelijker dan gedacht maar in tweede instantie toch nog wel een hele klus om dit goed te doen. Maar het bericht gaat de wereld in: via www.dewebmeester.nl kunt u voortaan uw bestaande website of design laten importeren in de online en zeer professionele websitebuilder van www.Weebly.com . Natuurlijk ga ik hier het proces beschrijven en ik wil iedereen vragen die dit leest en zelf gaat proberen om bevindingen te plaatsen in dit blog (heel makkelijk, gewoon een commentaar schrijven en na goedkeuring wordt uw bijdrage geplaatst; inclusief linken).

Voorbeelden

Ok, eerste het bewijs. Ik nam een willekeurige HTML pagina (zie foto hiernaast) en heb dit ontwerp aangepast zodat het past binnen weebly.com. Het resultaat is dan ook te zien op: http://dewebmeester.weebly.com Wat is nu bereikt: Gratis hosting. Ja, niet verkeerd natuurlijk alleen moet u er wel rekening mee houden dat er onderaan de pagina een kleine link verschijnt. --à Create a free website with Weebly
ß-- Het laten verwijderen van deze link kost iets van 4 dollar per maand maar via www.dewebmeester.nl krijgt u hier al snel 50% korting op. (Let op: kijk goed onder aan de pagina van de hier getoonde voorbeelden en u zult zien dat de link ontbreekt.)

Vervolgens was mijn vraag of het mogelijk is een design inclusief javascript te importeren in Weebly. Ja, ook dat is me gelukt. Het voorbeeld is te zien op http://spidermanweb.weebly.com ; Uw vraag: ik heb een eigen domeinnaam en wil niet een domeinnaam met 'weebly' daarin, kan dat? Ja natuurlijk. De voorbeelden zijn alleen om te laten zien dat ik deze templates/ design werkelijk host onder www.weebly.com en dus onderdeel uitmaken van de weebly sitebuilder binnen mijn (gratis) weebly account.

Maar helaas: het lijkt nu wat makkelijk dan het is. Ik was iets te snel blij met het resultaat. Wat ik was vergeten was dat het design binnen de sitebuilder niet was aan te passen (al werd de website prachtig weergegeven) wat de sitebuilder dus nutteloos maakte. En dus ging ik op zoek naar de oplossing…….

Werkwijze om website te kunnen onderhouden binnen www.weebly.com

Nu wordt het spannend. Wat als eerste opvalt bij het openen van het design binnen de sitebuilder (vraag even om inlogcodes bij info@dewebmeester.nl om zelf dit alles te bekijken en te proberen )was dat er geen werkbare blokken waren binnen het design. Opnieuw: logisch. De aanpassingen kon ik doen via het schakelen tussen en standaard weebly design (die met die wolkenlucht bovenaan is prima) en mijn geïmporteerde design. Eerst naar het standaarddesign, (via tab 'design') en klikken op 'edit HTML/CSS' daar onder tab 'HTML' zie je de code voor het plaatsen van 'editable blocks' binnen de webpagina.

//// <div class="body-content">
    <div id="content-main">
             %%CONTENT%%
          </div>
     </div>////

Deze code kopieer ik, klik op 'cancel', schakel terug naar eigen design, opnieuw klikken op 'edit HTML/CSS' en ik plak de code binnen de content van de website waar ik content wil weergeven. Klikken op 'save' en we zijn weer terug bij ons design waar niets gebeurd lijkt te zijn. Geen nood. Ik schakel weer terug naar standaard design, klik op 'elements' en 'drap and drop' een element op de plaats waar ik de code voor het contentblok heb geplaatst. Als het goed is zie je nu dat het element blijft 'plakken'. Nu weer terug schakelen naar eigen design en element aanpassen naar eigen wensen. Ik zal proberen zo snel mogelijk een instructie filmpje te plaatsen op www.youtube.com en ook binnen dit blog.

Software review: Adobe Widget Browser for Dreamweaver CS5

Version: 4.6 (brief review)
1.0 (brief review)
Developer: Adobe Systems Incorporated    

Developer's contact form/e-mail: http://www.adobe.com/aboutadobe/contact.html

License type: Freeware      

Cost: 0,00 $

Category: Web Development -> Wizards & Components

Program tags:
widgets,dreamweaver cs5,webbuilder,webdesign,insert,html page

 

Description:
If you need an easy way to insert all kind of professional "widgets" like dhtml menu's, gallerys, google maps or other into your html page, the Adobe Widget Browser, together with Dreamweaver CS5, offers this possibility. You only need to have a (free) account with Adobe Exchange and browsing free or commercial widgets and inserting them into your webpage is very easy. After installation, you can go directly to the Widget Browser without opening Dreamweaver and start browsing. You can even store your favourite widgets into a "My Widgets" album to find the easily when working with Dreamweaver. At the moment the Widget Browser offers 35 free widgets and hundreds of commercial widgets. Easy to install, easy to find in Dreamweaver CS5 and easy to use. Just open any HTML page in Dreamweawer CS5, click on 'insert', choose 'widgets' and you can choose "My Widgets" or "Widget Browser". To show it's functionality: you can create an complete html.css/flash webpage from scratch in seconds by just using the widgets fro the widget browser!

 

Medium description:
Easy to use browser to help inserting widgets like dhtml menu's, (flash) gallerys, social marketing tools and other professional content into your webpage. Easy implementation into Dreamweaver CS5 and designed to use only with this program. Free software with 35 free widgets and possibilty to browse all widgets from the Adobe Exchange Program.

 

Short description:
Easy to use Dreamweaver CS5 tool for inserting professional widgets in webpages.

 

Developer's description:
The Adobe® Dreamweaver® Widget Browser is an Adobe AIR® application that lets you preview and configure widgets using a visual interface. The Widget Browser solves the problem of having to work with confusing or obscure CSS and JavaScript by providing designers with a tool for editing widget properties to suit their needs. With the Widget Browser, you can: * Preview and download all of the OpenAjax widgets available on the Adobe Exchange * Add widgets to Adobe Dreamweaver so that you can easily insert them in your web pages * Export and package widgets for use in any other HTML editing tool The Widget Browser also offers widget developers the ability to make their widgets available to a wider audience. The Widget Browser's developer tools let developers package their widgets into a format that they can then upload to the Adobe Exchange. Developers interested in creating a widget package can find more details in the Widget Browser Developer's Guide. The Widget Browser uses an OpenAjax Alliance XML format as its basis. The OpenAjax Alliance is a group of industry leaders who are helping to define a common way of communicating between frameworks. Download and Discuss * Download the Dreamweaver Widget BrowserDownload the Widget Browser now * Discuss the Widget BrowserDiscuss the Widget Browser in the Labs forums The OAA Widget Metadata spec describes how to create the XML file for a widget, as well as a widget's dependencies, markup, and options. Adobe has been a part of the OAA since its inception and has helped to define this specification.

New in version:
The release of the Adobe Widget Browser is designed for evaluation purposes only. The software contained within the installer is not final; but, many portions of the technology are fully implemented and ready for you to try and discuss.

Advantages:	Disadvantages:
Easy to use with professional results in seconds	Only for implementation into Adobe Dreamweaver CS5

Home URL:http://labs.adobe.com/technologies/widgetbrowser

Buy URL:http://labs.adobe.com/downloads/widgetbrowser.html

Download URL:http://download.macromedia.com/pub/labs/widgetbrowser/widgetbrowser_543.air

Download URL mirror:http://download.macromedia.com/pub/labs/widgetbrowser/widgetbrowser_543.air

File size (bytes): 1790078

Rate the program:   3/5
Screenshots:

1	[2011-02-16 07:57:59]   File format: jpg Widget browser startup view
2	[2011-02-16 07:58:00]   File format: jpg Implementation into Dreamweaver

 

3	[2011-02-16 07:58:01]   File format: jpg Example of widget in browser