zondag 2 augustus 2009

Software Highlight: RapidPHP



Software is van groot belang als je aan de slag gaat met het maken en beheren van websites. In deze categorie 'Software Highlight' wordt zo af en toe een handig programma uitgelicht. Ditmaal: RapidPHP 2008.

RapidPHP is een text-editor. Geschikt voor o.a. HTML, PHP, CSS, JavaScript en XML. Voor al die script- en programmeertalen wordt syntax-highlighting geboden. Daarnaast biedt het programma een ingebouwde preview-mogelijkheid. In het geval van PHP moet je daarvoor nog wel server-software hebben geïnstalleerd.

Ook de 'find & replace'-mogelijkheid is prima geregeld in dit programma. Het kan in meerdere bestanden tegelijk tekst vervangen. Dus stel je hebt een website die bestaat uit 10 pagina's, dan kun je wijzigingen met 1 klik op de knop doorvoeren in alle tien bestanden. Dat kan behoorlijk wat tijd schelen.

RapidPHP beschikt over een ingebouwde FTP-client. Zo kun je bestanden up- en downloaden van en naar FTP-servers. Dat is niet alles. Je kunt ook bijv. een php-bestand openen vanaf de FTP-server, en zodra je 'm opslaat worden de wijzigingen direct op de FTP-server doorgevoerd.

Standaard zitten er ook tientallen code-snippets in, voor onder meer PHP, JavaScript, HTML en ASP. Je kunt zelf ook makkelijk snippets toevoegen. Als je vaak dezelfde stukjes code gebruikt is dit een mooie functie, die je veel tijd zal besparen.

RapidPHP beschikt ook over een SQL-explorer. Zo kun je zelfs je MySQL-database beheren zonder dat je moet switchen tussen PHPmyAdmin of een andere tool.

Ook kun je RapidPHP op je USB-stick installeren. Da's handig als je wel eens wisselt tussen computers. Zo heb je altijd je eigen ontwikkeltool bij de hand.

Het programma is niet gratis, het kost ongeveer 30 euro. Je kunt wel een volledig werkende gratis 30-dagen trial versie downloaden. Dat kan vanaf de website van de maker.

Klik hier om erheen te gaan: http://www.blumentals.net/rapidphp/

Aan de slag met JQuery - Beginnershandleiding deel 1


Onder webontwikkelaars is de Javscript-toolkit JQuery razendpopulair. Je kunt er ook ontzettend veel mee: effecten toevoegen aan je pagina's, je website gebruiksvriendelijker maken en aan php gekoppelde acties uitvoeren zonder de pagina te herladen.

In deze beginnershandleiding laat ik je zien hoe je simpel leuke dingen kunt bereiken met JQuery. Voorkennis van JQuery is absoluut niet nodig. Je moet wel overweg kunnen met HTML, en in latere delen misschien ook met PHP.

In dit eerste deel gaan we JQuery inladen in een webpagina, en maken we een knop. Wanneer je daarop klikt moet er een andere tekst zichtbaar worden op de pagina, uiteraard zonder de pagina te herladen.

Op de website van JQuery kun je overigens ook een boel informatie vinden, zowel handleidingen als documentatie. De website is www.jquery.com.

Je kunt vanaf daar ook JQuery downloaden. Dat kan je doen als je graag de javascript-bestanden van JQuery op je eigen server wilt hebben. In dit voorbeeld doen we dat niet. Google heeft biedt de benodigde bestanden namelijk ook gratis aan. Dat is iets makkelijker, en in veel gevallen werkt het nog sneller ook.

Open je favoriete web-editor, en maak een nieuw HTML-bestand aan. Zorg dat de inhoud er als volgt uitziet:



We gaan nu het JQuery-javascript-bestand tussen de head-tags plaatsen. Daarna kunnen we écht beginnen. Zet de volgende code tussen de head-tags:

<script src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.pack.js" type="text/javascript" charset="utf-8"></script>

De HTML-code
Nu we een opzetje hebben voor het HTML-bestand, en we klaar zijn om aan de slag te gaan met JQuery gaan we een stukje HTML-code schrijven. Die code bestaat uit een hyperlink, en een stuk tekst dat in eerste instantie verborgen is. Als je op de hyperlink klikt moet de tekst zichtbaar worden.

Zet tussen de body-tags de volgende HTML-code:

<h1 style="display:none;" class="verborgen">De verborgen tekst</h1><br /><a class="link">Klik hier om de tekst zichtbaar te maken</a>

Tot zover de html code. Die spreekt voor zich, naar mijn idee.

De JQuery-code plaatsen we tussen de head-tags. Deze code komt tussen javascript-tags. Het gaat om de volgende code:



<script type="text/javascript">

$(document).ready(function(){
$("a.link").click(function () {
$("h1.verborgen").slideToggle("slow");
});});
</script>

De eerste regel binnen de script-tags geeft aan dat de code tussen de {-tekens moet worden uitgevoerd zodra het 'document ready' is. D.w.z.: de pagina is geladen.

Met de regel daaronder koppelen we een click-functie aan de hyperlink met de class 'link'.

Zodra er op wordt geklikt moet er een slide-toggle-effect worden uitgevoerd op een h1-titel met de class 'verborgen'. Het slide-toggle-effect is een simpel fade-effect.

In de documentatie van JQuery kun je meer effecten vinden. Kijk daarvoor op de pagina over effects.

Tot zover dit eerste deel. De volgende keer zullen we ingaan op het werken met HTML-formulieren gecombineerd met JQuery. We kijken dan wat dit voor mogelijkheden bied.

Mocht je nog vragen hebben, dan kun je ze hieronder in de reacties stellen. Veel succes!




Een website met database: MySQL en PHP


Heel wat mensen maken een website met PHP. Dat komt vooral omdat PHP makkelijk te leren is, en je al snel kunt doen wat je wil. Maar er is meer mogelijk, zo kun je PHP laten samenwerken met een MySQL-database. In de database sla je al je data op, zoals de content voor je pagina's. Met PHP haal je de data uit de database, en weergeef je deze. Ik zal in deze handleiding uitleggen hoe je dat doet.

Het samenwerken van PHP met een database verloopt iedere keer volgens een bepaald patroon:
  1. Je maakt verbinding met de database
  2. PHP laat de database een opdracht (query) uitvoeren
  3. PHP ontvangt de resultaten
  4. Met de resultaten voor je een bewerking uit (bijv. de resultaten weergeven)
1. Verbinding maken met de MySQL-database
PHP heeft een groot aantal functies om te werken met MySQL-databases. De eerste die we gaan gebruiken is de mysql_connect-functie. Hiermee maken we verbinding met de database-server. Vervolgens gaan we met de mysql_select_db-functie de juiste database selecteren.

$database = mysql_connect('localhost','gebruikersnaam','wachtwoord');
mysql_select_db($database,'databasenaam'';
?>

Sla de bovenstaande code op als een .php-bestand op je webserver. Je hebt nu een verbinding met de database tot stand gebracht.

De volgende stap is het opstellen van een query: de opdracht die uitgevoerd moet worden.

2. Een query uitvoeren
In dit voorbeeld gaan we informatie uit de database ophalen. Stel je hebt een tabel genaamd 'paginas' met twee kolommen: titel en bericht. We willen een overzicht van alle titels in de database. De query ziet er dan als volgt uit:

"SELECT titel FROM `paginas`";

Hiermee selecteer je alle titels. Je kunt er ook voor kiezen om alle data te selecteren, dus ook de berichten. De query wordt dan de volgende:

"SELECT * FROM `paginas`";

Een ander voorbeeld. Stel je wilt 1 specifieke titel selecteren, en het bijbehorend bericht. Dat kan je doen met onderstaande query:

"SELECT * FROM `paginas` WHERE titel='De te selecteren titel'";

De querys die je hierboven ziet kun je laten uitvoeren door de php-functie mysql_query(); Hieronder zie je een voorbeeld hoe je dat doet:

$query = mysql_query("SELECT * FROM `paginas`");

Deze regel komt in je php-bestand onder de twee regels die je er al hebt staan om verbinding te maken en de juiste database te selecteren.

Als je het bestand nu zou uitvoeren zou je niets zien op je scherm. Dat wil niet zeggen dat er niets gebeurt; in tegendeel: PHP heeft de data al wel voor je uit de database opgehaalt. We kunnen nu overgaan tot het verwerken van de resultaten van de query.

3. Verwerken van het Query-resultaat
Omdat we met de bovenstaande query een lijst met pagina-titels ophalen gaan we de titels stuk voor stuk verwerken. Het verwerken doen we met het onderstaande stukje code.

while($resultaat = mysql_fetch_array($query))
{
echo $resultaat['titel'];
}

Laten we dit stukje een nader bekijken. Het resultaat van de query halen we op met de mysql_fetch_array()-functie. Hiermee stopt PHP de resultaten netjes in een array.

Deze array gaan we doorlopen. Dat doen we door ieder item uit de array stuk voor stuk door te lopen. Dat gaat met de while-functie. Binnen de while functie kun je vervolgens iedere rij weer als een array benaderen.

Met het echo'en van de titel uit de array van het resultaat wordt de titel weergegeven. Je kunt hier uiteraard nog HTML-opmaak aan toevoegen. Nu worden alle titels achter elkaar weergegeven, maar dit kan natuurlijk ook onder elkaar.

Tot zover. Mocht je ergens vragen over hebben, dan moedig ik je aan om ze hieronder te stellen. Met het antwoord wordt niet alleen jij geholopen, maar ook anderen die tegen hetzelfde probleem aanlopen kunnen er iets aan hebben!

Vind passende zoekwoorden met Google Wonder Wheel

Een website zoekmachine vriendelijk maken (SEO) omvat meer dan alleen een goede linkstructuur en seo-vriendelijke links. De pagina's op je website, en dan met name de teksten op die pagina's (de content) spelen bij SEO ook een zeer grote rol. Als je een onderwerp voor je website gekozen hebt, is het handig om te bepalen op welke zoekwoorden mensen in Google zoeken die gerelateerd zijn aan je onderwerp.

Eén van de manieren om gerelateerde zoekwoorden te vinden is een redelijk nieuwe functie van Google: het Wonder Wheel. Hieronder zie je een screenshot daarvan voor het keyword stoelen.



Zoals je ziet krijg je nu allerlei suggesties van gerelateerde zoekwoorden, waarop ook veel gezocht wordt. Als je website over stoelen gaat, dan is het dus goed om losse pagina's temaken over kussens, tafels, banken maar ook over de verschillende materiaalsoorten.

Door meer pagina's, die dicht bij je onderwerp liggen, te schrijven en op je website te plaatsen kom je met meer pagina's in Google en zullen dus meer mensen je website weten te vinden.

Hoe kom je bij het Google Wonder Wheel?
Je gaat naar www.google.com. Je zorgt dan dat Google in het Engels staat ingesteld. Is dat niet het geval, dan klik je rechtsonder op Google.com in English. Je typt vervolgens een zoekwoord in, en klikt op Google Search.

In de blauwe balk bovenaan klik je vervolgens op Show Options. Je ziet dan linksonder het kopje 'Standard View'. Daaronder klik je op Wonder Wheel.



Je ziet nu het wonderwheel. Klik nu eens op één van de vertakkingen van het Wonder Wheel. Je zult nu weer zoekwoorden zien gerelateerd aan het sub-onderwerp. Je kijkt nu of er nog interessante suggesties bij zitten, en hiermee kun je dus een analyse maken van onderwerpen die interessant zijn om over te schrijven op je website of weblog.