Webb åt Originalmedia

För ett tag sedan fick jag kontakt med Anders på Originalmedia. De är ett göteborgsbaserat film-produktionsbolag som fokuserar på att göra dokumentär och informationsfilmer. De hade haft lite otur med ombyggnaden av sin webb. Det hade blivit pannkaka helt enkelt.

Jag visste direkt att jag ville visa en stor video på förstasidan. Det är så roligt med projekt där det finns fina bra material att utgå ifrån. Vi jobbade fram och sjösatte en WordPress-lösning.

Sten får ny webb!

För några dagar sedan laserade jag en ny webb för Sten! De tidigare webbsidorna har varit ok men inte lika helhjärtat som nu. Vi har precis börjat med ett ambassadörs-team och några fler roliga projekt är på väg 👍😀 Webben är tänkt som ett online-paraply för allt Sten och att ha en så flexibel plattform att vi kan göra limiterade special-produkter, event eller andra roliga saker lätt.

Förstasidan - STEN Climbing 2016

Fortsätt läsa ”Sten får ny webb!”

Uppdateringar för Göteborgs Stadsmission!

Nu i höst har jag arbetat som underkonsult åt byrån Spiro. Jättekul, inspirerande, och lärorikt att arbeta med nya människor och i större projekt!

Mitt första uppdrag har varit att städa upp, strukturera om och snygga till Stadsmissionens webb. Vi har pratat om att jag ska hjälpa dem mer så håll tummarna för att allt går i lås 🙂

gbg stadsmission 2015-12

Min IT-karriär började på reklambyrån DBI under IT-boomen för 15 år sedan. Jag hade en riktigt bra chef som lärde mig mycket om det mesta. Framförallt tryck och layout. Supertack för otroligt bra mentorskap Anders! På många sätt känns det att vara på byrå som att komma hem igen.

Då var det mer vilda western i IT-projekten och alla blev inte direkt färdiga. IT var ännu omognare och kunskaperna generellt var låga. Undra var man skulle landat om man hade de kunskaper man har nu då?

E-handel, blogg och hemsida till ValueLife!

ValueLife är ett nystartat företag i Kungsbacka som driver yogakurser, håller i olika events och aktiviteter och säljer produkter. Allt inom ramen för välmående och hälsa.

Under våren har jag hjälpt dem att skapa en hemsida med blogg och e-handel. Sidan är byggd i WordPress med WooCommerce.

En stor och viktig del i arbetet har varit att lära Catrin och Eva att själva arbeta med webben och att hitta rätt verktyg så de själva kan och vill använda hemsidan för att nå ut så bra som möjligt. Att börja tänka webb helt enkelt. Vi har haft utbildningar och workshops med många bra diskussioner där frågorna kan vara allt ifrån praktiska småsaker, som hur man sparar en bild för hemsida, till större strategiska frågor för att knyta ihop events med både sociala webben och egna hemsidan.

Tanken är att vi även framöver arbetar ihop för att utveckla hemsidan vidare. Men just nu är jag mer support och bollplank och det är så himla kul att se hur de själva jobbar vidare på hemsidan dagligen!

Twenty Fifteen: Nytt tema till WordPress!

På mina egna webbsidor brukar jag hålla mig till något av de tema som följer med WordPress. Jag började med WordPress redan på första temat så jag har använt alla utom Twenty Twelve. Dels för att jag tycker de är så välbyggda, för att jag gillar att de är enkla att jobba med, men också mycket för att det är smidigt att ta som exempel när jag undervisar i WordPress.

I början av 2014 när jag gick ifrån Twenty Thirteen till Twenty Fourteen kändes det först lite klumpigt men det har växt på mig. Skönt att ha nått som inte ser så ”bloggigt” ut som alla de tidigare temana. Det finns saker jag vill ändra men överlag är jag nöjd. Jag använder det på flera av de sidor jag byggt den senaste tiden. På mitt klättervarumärke STENs sida tycker jag det funkar utmärkt med de stora bilderna som får mig att vilja släppa datan och dra och klättra 🙂

Under hela 2014 körde jag temat Twenty Fourteen på min egen hemsida
Under hela 2014 körde jag temat Twenty Fourteen på min egen hemsida. Så här ser det ut idag när jag snart kommer byta ut det 🙂

Även om Twenty Fourteen har funkat bra så har jag på min egen sida (denna) letat efter att få fram en enklare, tydligare och personligare känsla. Jag har velat ha mer fokus kring innehållet.

Jag har smygkört Twenty Fifteen ett par månader på min test-WordPress och har fått stångas en del för att tämja de.

På nästan alla teman har man ett horisontellt sidhuvud längst upp med plats för stora bilder men här har man istället valt att arbeta stora vertikala bilder för sidhuvudet (de gröna fältet i bilden). När jag försökte få till ett trevligt foto som bakgrund bakades bilden och texten ihop för mycket hur jag än gjorde. Så istället fick jag arbeta mer med bara färger och istället använda stora bilder längst upp på varje sida eller inlägg istället.

Under 2015 vill jag ha en renare, enklare och mer fokuserad upplevelse från både min hemsida och livet i stort :)
Under 2015 vill jag ha en renare, enklare och mer fokuserad upplevelse från både min hemsida och livet i stort 🙂

Jag har valt personliga, lugna och trevliga färger. Tror jag. Men jag inget färgproffs. Det som gjorde hela skillnaden för mig var när jag började arbeta mer med funktionen Utvalda bilder som jag tycker ligger snyggt längst upp på både sidor och inlägg i Twenty Fifteen. Jag tycker också menyn är snygg med sina vänliga beskrivningar under varje inlägg. Menyn håller nog inte för att ha stora hemsidor men min är ju inte stor så 🙂 Jag önskar mig en sidfot där jag kunde lägga egna widgets men det finns inte som standard men förutom det tror jag att jag är nöjd just nu.

När jag såg första skissen på Twenty Fifteen i somras kände jag direkt att jag ville använda det som nästa tema på Klätterbilder. Jag har testat lite men inte riktigt fått till det än. En sak jag tänkte på är att det inte finns plats för en logo som standard i temat utan man fick göra ett child-theme för det.

Jag har stångats lite med att få till Twenty fifteen på Klätterbilder men här har jag inte nått hela vägen fram än.
Jag har stångats lite med att få till Twenty fifteen på Klätterbilder men här har jag inte nått hela vägen fram än.

Måste det alltid vara en balansgång mellan funktion och hur enkelt något är? Vad tror ni? Har ni testat Twenty Fifteen? Kommer ni testa det?

Här kommer jag installera det så fort 4.1 släpps!

Yogastudions hemsida uppe!

För någon månad sedan träffade jag Linda som precis då köpt Yogastudion – ett yogaställe i Göteborg som är proffs på KundaliniYoga. Hon frågade om jag kunde hjälpa henne med helheten kring IT, webb, marknadsföring och foto. När jag cyklade från mötet var jag upprymd, det är exakt den här sortens långsiktiga och sunda uppdrag jag tycker så mycket om!

Sedan dess har vi jobbat med många olika saker. Allt ifrån foto till rena IT-administrativa uppgifter som webbhotellsflytt och domännamnstransfers.  Från idag ligger grundbulten i Yogastudions online-marknadsföring uppe! Besök gärna yogastudion.com men ännu viktigare besök Yogastudion i Linnéstaden i Göteborg!

Sat nam och väl mött!

Ny yogahemsida!

Jag har hjälpt Cecilia och Helena på Mind your yoga Yoga your mind igång med deras första hemsida!

Vi lägger krutet på att komma igång och få ut budskapet och informationen så smidigt och enkelt det bara går. Vi har jobbat ihop på hemsidan vid två tillfällen där jag har guidat och Cecilia och Helena har jobbat. Så himla kul att se att det går smidigt att komma igång med en egen WordPress bara man har lite vägledning. Bra jobbat båda två!

Jag har gått på Yoga hos Cecilia tre terminer och det kan jag verkligen rekommendera!

Mind your yoga Yoga your mind screenshot

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.

New web site for Section C!

I have just published the web site for the Swedish skateboard distributor Section C! It’s running on WordPress with a custom theme. Much black, to get the nice contrasts with all the photos.

Some screenshots

Home / first -page screenshot
An example of a brand sub page

SpecialRosteriet web site

SpecialRosteriet is a small coffee shop in Laholm. They import and roast coffee beans.

A while ago we discussed web sites. We talked back and forth and after some discussions we agreed to start with a small, tight and easy to use web site. Based on a system where they themselves could update everything. And focus on getting used to put up information on the web. Just keeping it simple.

I have been using WordPress for several web sites. It’s a fantastic software package. The right balance between complexity and limitations with a high finish and great usability. In the past I have recommended to buy a web host and install WordPress there. This time we are using WordPress.com and letting them host the site.

It’s easy to set up. You register an account and a blog name on WordPress.com. The default URL was http://specialrosteriet.wordpress.com/ in our case. We started to build the web site with this address to get a feel for it. We created a custom top banner image with their logo and pointed their own URL, http://specialrosteriet.se/, to WordPress.com.

There are some main advantages. You don’t need to make the security updates to the WordPress software yourself, it’s cheap, you get 3 GB of storage and unlimited bandwidth usage. Tying your domain name to WordPress.com costs you about $10 per (+ the name fee to your registrar, about $10 per year).

The greatest disadvantage is that you loose flexibility. You cannot install your own plugins and you are more limited in theme design. Currently that’s not a problem but when it is I’m sure it will be a fairly easy process to migrate the data to another system.

It’s easy to take small steps using this technique. They could do most of it themselves. Just having me to ask and explain. So far I have only good things to say about using WordPress.com for these types of web sites.

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: /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 /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.

One.com allowed image upload max image size

I’ve had some problems uploading images to my one.com hosted WordPress (v 2.9.2) blog. It seems like they have increased the allowed upload sizes / allowed memory so I’ll make a test with some different images.

If I’m not wrong these results are better than the last time I tried but I can’t remember any details. This time I’ll save the results here so I can compare them later.

300 kb – 3000 x 1281 px – works

800 kb – 2000 x 2000 px – works

1 mb – 2200 x 2200 – fails – The image is uploaded but it fails to scale it.

1,1 mb – 2500 x 2500 – fails – The image is uploaded but it fails to scale it.

1,5 mb – 3000 x 3000 – fails – The image is uploaded but it fails to scale it.

If fails with the following error

Fatal error: Out of memory (allocated 44564480) (tried to allocate 4096 bytes) in
/xxx/xxx/xxx/httpd.www/blog/wp-includes/media.php  on line 913

Wider panoramas on my photo blog!

I’ve just updated my custom version of the AutoFocus WordPress theme to support wider panoramas. Before the update it could handle 800 px wide panoramas and now it works with 1024 px wide!

I also removed one feature of AutoFocus that automatically embeds the last attached image instead of the complete post content. It’s a nice feature but not what I want. One drawback is that I’m getting the title above the image instead of below, so I think I’ll have to make some adjustments to it but that’s for another day!

Old version did only support 800 px wide panoramas
Updated to support 1024 px wide panoramas

Add colors to your tag cloud for readability

I’m using the A better tag cloud WordPress widget to be able to configure the tag cloud on my blog. It’s a nice widget that I really recommend!

I wanted to make it easier (and prettier) to use by adding colors to the tags. A darker color means a more used tag, a lighter means that the tag is less used. I based my colors on the Tango palette.

The tag cloud with the original CSS to the left and my customized to the right

All different sizes in A better tag cloud already had their different CSS classes so adding colors were easy. All I had to do was to add the following CSS to the bottom of my styles.css file.

/* Add colors to A better tag cloud */
.nktagcloud-8 {
  background-color:#fce94f;
}
.nktagcloud-9 {
  background-color:#edd400;
}
.nktagcloud-10 {
  background-color:#fcaf3e;
}
.nktagcloud-11 {
  background-color:#f57900;
}
.nktagcloud-12 {
  background-color:#ce5c00;
}
.nktagcloud-13 {
  background-color:#e9b96e;
}
.nktagcloud-14 {
  background-color:#8ae234;
}
.nktagcloud-15 {
  background-color:#73d216;
}
.nktagcloud-16 {
  background-color:#4e9a06;
}
.nktagcloud-17 {
  background-color:#729fcf;
}
.nktagcloud-18 {
  background-color:#3465a4;
}
.nktagcloud-19 {
  background-color:#204a87;
}
.nktagcloud-20 {
  background-color:#ad7fa8;
}
.nktagcloud-21 {
  background-color:#ef2929;
}
.nktagcloud-22 {
  background-color:#cc0000;
}

Enjoy!