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

Gmail: illustraties (images) in standaardantwoorden

Het werkte zo mooi: via Gmail kon je een standaardantwoord aanmaken (kan nog steeds) daarbinnen illustraties plaatsen (visitekaartje bijvoorbeeld) en vervolgens dit sjabloon opslaan en heel makkelijk in een nieuwe email invoegen. Maar sinds enkele weken blijkt het niet meer te werken. Een Google Bug. Ja dit bestaan ook. Even wat zoeken op Google en er blijkt nog geen antwoord gevonden te zijn op dit probleem. Dan maar zelf aan de slag:

Vanavond met hetzelfde probleem geworsteld en uiteindelijk is het me gelukt om opnieuw de afbeeldingen in standaardantwoorden weer te geven. Als eerste opgemerkt: als je een beetje Googled in het Engels op dit onderwerp zul je al snel ontdekken dat het probleem bij Gmail (google) ligt en dat het probleem zich "plotseling" heeft voorgedaan en dat zij zoeken naar een oplossing. Mij lukt het op dit moment om afbeeldingen in standaardantwoorden te plaatsen door een combinatie van gevonden antwoorden.
1) in internetinstellingen onder tab 'veiligheidsinstellingen' klikken op 'aangepaste instellingen' en aanvinken 'gemengde inhoud toestaan'
2) niet voortborduren op een eerder aangemaakt standaardantwoord maar een lege nieuwe mail aanmaken, een origineel 'onderwerp' intypen, klikken op 'nieuw standaardantwoord' en opslaan volgens ingetikte 'onderwerp'.
3) je nieuwe standaardantwoord opmaken door eerst afbeeldingen naar desktop te downloaden, en vervolgens uploaden vanuit Gmail in je standaardantwoord
4) je email versturen
5) nu pas opslaan (onder dezelfde naam en het eerder aangemaakte standaardantwoord vervangen)
Via dit stappenplan kun je een aantal Google bugs omzeilen maar is geen garantie dat het morgen ook nog werkt..... Succes ermee!
www.meindert.info

Ir. Meindert A. Jorna (Msc.)

Savornin Lohmanstraat 45

6702BN Wageningen

(0031) (0)317 795149

(Mob.) 06 41286716

info@dewebmeester.nl

My profiles:
Blijf op de hoogte: Module positie toevoegen aan Joomla template

Latest tweet: Tja, vandaag kocht ik een toiletrolhouder voor 1,39Euro en liet hen liggen bij de Action... Wie is duurder uit? Follow @dewebmeester Reply Retweet 22:44 Feb-16

Get this email app!

Module positie toevoegen aan Joomla template

Ik heb er weer helemaal zin in: Ik ga enkele mogelijkheden beschrijven die het mogelijk maken om elke html/css webpagina om te zetten in een bruikbaar Joomla template. Voordelen: Joomla is HET open source management system voor Joomla websites en omdat dit het meest uitgebreide CMS is ter wereld, is het gewoon rechtvaardig om een mogelijkheid te kennen om een "gewone" HTML pagina te importeren in dit CMS. Dat zal het gemakkelijk maken om één of meerdere van de duizenden (gratis) beschikbare Joomla componenten en modules te integreren in een HTML website, gebruikersaccounts aan te maken en te beheren, artikelen en andere inhoud online bij te houden, enzovoorts, enzovoorts.

In deze bijdrage het onderwerp:

Module posities. Voorbeeld: aanpassing van de purity_ii template van Joomlart


Module posities staan genoemd in de templatedetails.xml file die onderdeel uitmaakt van de gebruikte joomla template. Deze file is the vinden in de folder 'templates' en dan natuurlijk binnen de subfolder van de betreffende template. Om een modulepositie toe te voegen of te verwijderen hoef je alleen aanpassingen te maken binnen het rijtje. In mijn voorbeeld: ik wil een modulepositie toevoegen met naam "bottombar" en voeg de regel <position>bottombar</position> toe aan het rijtje.

"positions>

<position>hornav</position>

<position>breadcrumbs</position>

<position>bottombar</position>


<position>banner</position>

<position>left</position>

<position>right</position>

<position>top</position>

<position>user1</position>

<position>user2</position>

Etc./>

Vervolgens plaats je binnen de index.php de code <jdoc:include type="modules" name="<naam van modulepositie>"/> op de plaats waar de module binnen de template zou moeten verschijnen en vervang je <naam van modulepositie> door de naam van de modulepositie precies zoals je die hebt beschreven in het bovengenoemde rijtje. Nu kan dit overigens wel eens tot problemen leiden omdat de nieuwe design (joomla templates) niet allemaal zo standaard zijn. Oftewel: de index.php file van een joomla site heeft mogelijk helemaal geen HTML tags zoals je gewend bent. Ga in dat geval op zoek de .php file die beschrijft welke modules op elke positie geladen moeten worden. Die .php file zit waarschijnlijk in de /templates folder. In mijn geval was het de file joomla2/templates/purity_ii/layouts/header.php waarin ik de jdoc:include betreffende "bottombar" heb geplaatst (lijkt niet logisch om een 'bottombar' te plaatsen in header.php maar in footer.php bleek de module niet te werken zoals behoort.) Resultaat: er verschijnt binnen mijn site een mooi menu helemaal beneden op het scherm die mooi meescrollt binnen de pagina (www.decmsmeester.nl/joomla2) op een nieuwe positie die ik 'bottombar' heb genoemd.

Zo leren we langzaam hoe een Joomla template is opgebouwd. We moeten proberen zoveel mogelijk zaken te ontdekken. Het zijn allemaal puzzelstukjes die ons zullen helpen om uiteindelijk zelf een Joomla template te maken of om van een bestaande HTML pagina om te zetten naar een Joomla template. In deze aflevering leerden we om een modulepositie te definieren en om te bepalen op welke plaats binnen een (html)pagina de module moet verschijnen.

Plaatsen foto binnen artikel in Joomla! Drie manieren.

Drie manieren:
1) Open artikel in editor door vanaf homepage (na inloggen) te klikken op potlood rechtsboven artikel. Artikel opent zich in tekstverwerker. Onderaan artikel zie je een grote knop 'afbeelding' en daar klik je op. Er opent zich een mooie lightbox. Je ziet nu alle beschikbare foto's op de server. Of eigenlijk: alle fotos in de map images/stories (dat is nu eenmaal de standaard instelling in Joomla wat op zich is aan te passen). Zit de foto die je wilt gebruiken er niet bij, dan ga je naar 'upload' onderaan de lightbox. Eerst even klikken op 'bladeren', foto kiezen en 'upload'. Je foto wordt nu in de map images/stories geplaatst. Je klikt op die foto en vervolgens op 'invoegen' en je foto verschijnt binnen je artikel.
2) Open een ftp programma en upload alle foto's die je wilt gebruiken op je website naar de folder images/stories van je joomla website. Open artikel in tekstverwerken zoals beschreven onder 1) en klik op 'afbeelding' onder artikel. Nu opent zich opnieuw de lightbox met daarin alle foto's die je in de folder images/stories hebt geplaatst. De rest wijst zich vanzelf.
3) Een wel erg makkelijke manier maar niet zo bekend: Zoek een foto op internet die je wilt plaatsen binnen je website. Natuurlijk moet je wel even bekijken of je recht hebt die foto te gebruiken maar op zich heb je dat omdat de foto openbaar beschikbaar is (je mag hem niet verkopen en op zich doe je er niets mee: lees verder.) In een ander tabblad van je browser open je het artikel in de teksteditor zoals hierboven beschreven. Nu klik je op de gewenste foto, houdt je linkermuis kant ingedrukt en sleept te foto naar het andere tabblad direct naar de plaats in het artikel waar de foto moet verschijnen. Als je bent belandt op die plaats, laat je de muis los en je foto 'landt' netjes in je artikel. Niet vergeten op 'opslaan' te klikken. Heb je nu de foto 'gejat'? Nee. Je hebt binnen je artikel alleen een verwijzing geplaatst naar een foto die ergens anders op het web te vinden is. Je hebt de foto dus niet eens gekopieerd. Net zomin als dat het strafbaar is om in een artikel een verwijzing naar een bankroof te plaatsen, is het strafbaar om een verwijzing naar een foto te plaatsen. Niet strafbaar dus. Minpunt: als de link ergens ver weg op internet wordt aangepast, dan is direct je foto binnen je artikel niet meer zichtbaar.