Installera WordPress på din egen dator

Detta vänder sig främst till avancerade WordPress-användare eller om du är nyfiken på att lära dig mer. Det finns risk att du behöver en del tålamod första gången :)

Vill man bygga teman eller plugins till WordPress är det oftast värt att installera WordPress på din egen dator. Detta gör att du slipper sitta och ladda upp filer fram och tillbaka till dit webbhotell. Istället kan du ändra i dina filer direkt från Finder eller Utforskaren.

Jag kommer gå igenom övergripande hur man gör så det finns många detaljer jag saknar. Detaljerna ändrar sig ändå så fort så det viktigaste för dig är att lära dig det övergripande tänket och hur man hittar lösningarna själv. Har du problem med något skriv gärna i kommentarsfältet nedanför oavsett om du löser det eller ej så kan vi säkert fixa det ihop.

För att kunna installera WordPress behöver du en webbserver med PHP och MySQL. Det finns massor med varianter. Den smidigaste jag sett heter Ampps. Testa gärna att installera den. När du installerat Ampps kan du förhoppningsvis surfa till: http://localhost/ som är din lokala webserver.

När du installerat Ampps behöver du skaffa en Databas och en databasanvändare. Det gör man lättast med programmet phpMyAdmin som går att installera i Ampps. Du kan installera det via Ampps kontrollpanel. För att surfa till phpMyAdmin surfar du till: http://localhost/phpmyadmin. Skapa en användare som heter wordpress med lösenordet wordpress och databasnamnet wordpress.

Ladda ner WordPress, packa upp filerna och kopiera hela wordpress-mappen till www-mappen i Ampps. För att hitta till rätt mapp öppna Ampps och gå in i den mappen. När WordPress-filerna är på plats kan du surfa till: http://localhost/wordpress och följa installationen av WordPress.

I Ampps såg jag även att det fanns en inställning för att installera WordPress via 1 klick. Testa gärna det och berätta hur det går :)

Lycka till!

WordPress on OSX (10.6.8), Apache, PHP & htaccess

I’ve just managed to get OSX 10.6.8 to work with mod_rewrite and .htaccess to be able to let WordPress rewrite it’s URLs. Here is what I did.

I installed WordPress to my homefolder so I’ll access it using http://localhost/~ola/wordpress. Apache is configured to use a split config in OSX so to change the directives for the home folder you change the file /private/etc/apache2/users/Ola.conf. I changed AllowOverride None to AllowOverride All and restarted Apache.

I got a 403 Permission denied message. I checked the Apache error log /var/log/apache2/error_log. It said: [Mon Nov 28 16:30:47 2011] [error] [client 127.0.0.1] Options FollowSymLinks or SymLinksIfOwnerMatch is off which implies that RewriteRule directive is forbidden: /Users/Ola/Sites/slipstream/wp-admin/options-permalink.php, referer: http://localhost/~ola/slipstream/wp-admin/options-permalink.php

I added the Options directive FollowSymLinks to /private/etc/apache2/users/Ola.conf, restarted Apache and it worked fine.

I’m only using this config as a development box so I’m not sure if it has any security implications. If you have any knowledge about this just let me know.

WordPress development environment – Aptana, Virtualbox and Google Code

At work we always have a pretty hefty development environment. At home I’ve never had any dedicated environment for my web development. It’s both a relief and something I miss.

Today I’ll try to set up a WordPress development environment that’s a bit more robust than my old setup where I download the file I need to change from my website to my desktop, change it, upload it and refresh the browser.

The idea is to:

Setup Google Code

I registered mypersonalblog on Google Code. For now I’ll probably mostly use the SVN features so you can swap out Google Code for any other repository.

I created a wp-themes folder in trunk where I’ll put one folder for each theme I use.

I download the theme I want to use from WordPress Themes. I add -ol to the end of the theme folder to not confuse the themes with the original folder names. Then I check it in. This is done to easily be able to track my changes compared to the version I started out from later. Both to be able to see what I have done but also to easily be able to merge updated theme versions further down the road.

I change the styles.css file and add some information. Here is an example from the  Simplr-ol style.css file.

THEME NAME: Simplr-ol
THEME URI: http://code.google.com/p/mypersonalblog/ (Simplr http://www.plaintxt.org/themes/simplr/)
DESCRIPTION: My customizations to Simplr; "The original minimalist one-column, content-centered theme for WordPress. A different type of theme. For WordPress 2.6.x."
VERSION: 4.6.1-0.1
AUTHOR: Ola Lindberg (Simplr by Scott Allan Wallick)
AUTHOR URI: http:///olalindberg.com/wp/ (Simplr http://scottwallick.com/)
TAGS: variable width, fixed width, one column, widgets, theme options, options page, white, orange, blue, microformats, hatom, hcard

If any theme diverges a lot from the original theme I’ll maybe come up with a new name and upload it to WordPress Themes. For now I think it’s good enough to have them all in one Google Code repository.

Setup VirtualBox, Ubuntu, Apache and WordPress

I installed VirtualBox, created an Ubuntu appliance and installed Ubuntu 9.10 desktop. I installed the guest add-ons and Apache. I changed the VirtualBox network to Bridge mode so it get’s its own IP address.

Screenshot from the Network Adapters in VirtualBox. Open it from Devices / Network Adapters...

Update 101118: I recently wanted to make this setup on another computer (using a wireless network card) where I couldn’t get the Bridged Adapter to work. I searched around a bit and it and it seemed like some people had similar issues. Instead I configured VirtualBox to use two network cards. One using NAT (giving internet access) and one using Host-only Adapter.

2 nic setup. The first using NAT providing internet access from my guest
2 nic setup. The second card using Host-only Adapter to be accessible through my Host system.

With this setup you should access you guest os from your host os with the IP address your 2nd network card gets (in Windows).

I created an Apache Virtual Host and installed WordPress to that folder. The production URL is http:///olalindberg.com/wp/ and for the local URL I use http://o/blog. I added the IP for my virtual Ubuntu to the name o i my hosts file. Now I can surf to http://o/blog.

My virtual host is configured like this

	ServerName o
	DocumentRoot /home/ola/shared/web/ola
	#Only put the log file like this in the web root on a local server
	CustomLog /home/ola/shared/web/ola/ola-access.log combined

Share files between my workstation and the virtual Ubuntu server

To share files in VirtualBox I use SharedFolders. The folder on my Windows workstation where I checked out the repository is D:CodingMyPersonalBlog and it’s mapped to the name MyPersonalBlog in Ubuntu.

The VirtualBox Shared Folder dialog. Open it via Devices / Shared Folders...

To mount the folder MyPersonalBlog to /home/ola/MyPersonalBlog in Ubuntu you run the following from an Ubuntu terminal

sudo mount -t vboxsf mypersonalblog /home/ola/MyPersonalBlog

Make sure that the files are visible in you Ubuntu server by running ls -la in the folder.

Note! You need to run this every time you login or you can create a script and make it auto run.

ola@ubuntudevserver:~/MyPersonalBlog/wp-themes$ ls -la
total 28
drwxrwxrwx 1 root root 4096 2010-03-27 11:08 .
drwxrwxrwx 1 root root 4096 2010-01-01 19:09 ..
drwxrwxrwx 1 root root 4096 2009-12-29 11:45 AutoFocus-ol
drwxrwxrwx 1 root root 4096 2010-03-27 11:12 room-34-baseline-ol
drwxrwxrwx 1 root root 4096 2009-12-29 11:13 Simplr-ol
drwxrwxrwx 1 root root 4096 2010-03-27 11:13 .svn
drwxrwxrwx 1 root root 4096 2009-12-29 10:58 veryplaintxt-ol

The last thing to do is to tell WordPress that the themes exists. I do that by creating soft links in the theme folders

ola@ubuntudevserver:~/www/olalindberg.com/wp/wp-content/themes$ ls -la
total 24
drwxrwxrwx 5 www-data www-data 4096 2010-03-27 11:48 .
drwxrwxrwx 6 www-data www-data 4096 2010-03-27 11:20 ..
drwxrwxrwx 2 www-data www-data 4096 2009-12-19 00:22 classic
drwxrwxrwx 3 www-data www-data 4096 2009-12-19 00:22 default
-rw-r--r-- 1 www-data www-data   30 2010-03-27 11:01 index.php
lrwxrwxrwx 1 ola      ola        55 2010-03-27 11:48 room-34-baseline-ol -> /home/ola/MyPersonalBlog/wp-themes/room-34-baseline-ol/
drwxr-xr-x 3 www-data www-data 4096 2009-12-29 10:42 simplr
lrwxrwxrwx 1 ola      ola        45 2010-03-27 11:06 Simplr-ol -> /home/ola/MyPersonalBlog/wp-themes/Simplr-ol/

Now I can enable the themes in the WordPress admin panel.

The WordPress theme administration page

Note! If WordPress can’t see the themes look at the permissions for the shared folder. I set mine to 0777 since it’s a local setup.

Import all posts from the production setup

I use the build in WordPress feature to export all posts and pages to an XML-file. I import that file to my local setup. I include all attachments. Some minutes later I have all my posts in my local development environment.

If I need to re-import all posts I use the plugin Bulk Delete to empty my current local database. Then I empty the Media Library in the WordPress admin panel. One tip is to increase the number Media items per page via the Screen Options.

Setup Aptana

I installed Aptana, created a project file and added all my theme files to it. I have never used Aptana before so it’s a test. We’ll see how it goes.

Upload with Uploadify running in public_html folder

Just to try it out I tried to get Uploadify to work in my public_html folder. I set it up according to the guidelines in the docs/example and ran. It returned success but the file wasn’t uploaded.

My first debug idea was to add an alert to the onError event. It wasn’t triggered.

My second idea was to try and print the response in the onComplete event. I added:

'onComplete': function(event, queueID, fileObj, response, data) {
    alert('onComplete: ' + response)
}

and it returned:

Warning: move_uploaded_file(/var/www/home/ola/public_html/uploadify/uploads-folder/test-image.jpg) [function.move-uploaded-file]: failed to open stream: No such file or directory in /home/ola/public_html/uploadify/_lib/uploadify.php on line 40

Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move '/tmp/php1rJUsg' to '/var/www/home/ola/public_html/uploadify/uploads-folder/test-image.jpg' in /home/ola/public_html/uploadify/_lib/uploadify.php on line 40

I guess it’s some rewrite issues when Apache rewrites the /home/ola/public_html folder to /~ola.

I opened uploadify.php (the ”server side code” for Uploadify) and replaced:

$targetPath = $_SERVER['DOCUMENT_ROOT'] . $_REQUEST['folder'] . '/';

with:

$targetPath = $_REQUEST['folder'] . '/';

And it worked.