audiophonik

Tag: blogs

making a wordpress theme your own: part 1

by Phil on Jan.14, 2010, under tech

Over the last four months of 2009, I had the privilege of being part of the Linux Experiment – a four month period where me and some of my colleagues from school switched to Linux as our primary computing environment to test if we could move away from using windows. While the results were varied, I’ve now decided that I’d like to keep my online presence going.

There was a lot of technical stuff I discovered during the experiment, but not all of it was related to Linux so I couldn’t post it on the blog. Since some of my friends from the experiment have been using their blogs to post about their interests in technology and other related fields [check the links at the bottom of the page], I decided to re-purpose this blog yet again.

Part of re-purposing this blog has been getting a new theme. It turned out to be a fairly technical process, so I’ve decided I’ll chronicle the experience here – so that if nothing else I’ll remember all the steps required next time I do something like this. Let me just say that I’m kinda familiar with the workings of WordPress, but I’ve never made my own theme from scratch. All the theme tweaking I did for this blog was through trial and error, some PHP experience from dabbling and two courses I took in University, a general knack for all things technical and some Photoshop skills I picked up in highschool.

Lets start with my motivation. At first I wanted a light coloured blog, so that this site would have an air of professionalism to it. However, anyone who knows me probably knows that I really like pretty things. In fact, I like them far too much to go for the stark professional look for something as personal as my own website. On top of that, where is the fun in using some pre-canned theme? This blog is suppose to reflect me and my interests. After some searching I eventually found this theme called Pixel. I liked the layout and the visual effects, but the background just wasn’t really me.

Being the Photoshop connoisseur that I am, I decided I’d take a look at the theme and see if I could take a swing at changing it to suit my tastes. As I stated above, I’ve been exposed to WordPress before, and have tweaked themes in the past – but its all self taught by diving in and looking at what makes the guts of WordPress work. I hardly ever consult documentation about these things, which might be a good or a bad thing depending on how you look at it!

Recently I’ve been in love with this wallpaper I found on interfaceLIFT of the orion nebula. I decided to use that photo as the base for my blog’s theme. After downloading both the wallpaper and the theme, I started digging around. I went into the images folder of the Pixel theme and looked to see what combination of images was used to create the look. It turns out the entire background including the frosted header, the black category header, and the translucent overlay for the body of the blog was one image that is centered and set as the background image of the site with horizontal and vertical repetition disabled. This works nicely because this image fades to black on all edges, so a solid black background causes the whole site to look fluid.

In order to create a new version of the theme visually, all I had to do is replace this image with one of my own! Sounds easy right? No? Yeah probably not. I’ve a friend who I taught Photoshop to, and while he’s good – the idea of doing something like this seemed impossible to him. He watched me do some of the steps I’m about to detail and informed me that it was “really cool” and he would have had “no clue how to edit a theme like that”. The tricky part, is that I had no idea what I was doing when I started either. I just dove in and tried my best to create something new.

I started by creating a new PSD with the original background image as the background. I then recreated the regions of the image on individual layers. These regions were:

  • The header strip – The rectangle with the blog name / description
  • The category strip – Contains a link to the home of the blog / the post categories
  • The body of the blog – Contains the posts / pages of the blog
  • The background – Contains… everything!

All the first three layers contained was a white rectangle outlining the regions. The background layer I left blank for now. The category strip presented an interesting challenge as there were rounded corners, but I busted out the handy pen tool to create a nice rounded curve which I turned into a selection region and removed from the rectangle. After that I threw in the orion nebula image in the background, overtop of the existing background. I now had an interesting choice of what colours to make these regions. I toyed with white, black, and other colours from my chosen background image.

I ended up making the header and category strips one of the bright pinkish-purple colours from the orion nebula image, but changed the opacity so they’d be slightly see-through. The body I made black, but lowered the opacity on it as well. I then created a copy of the body layer, changed the opacity back to full, deleted the black, and created a transparent to black gradient from the top to the bottom.

This allowed for the image to blend into an all black background, so that I didn’t need to use more images to create the look of the blog. The header I replaced with a black to pinkish-purple to black gradient, so that it blended into back on the left and right sides. After throwing some white borders on the bottom of the header layer, around the category layer, and down the sides of the body layer I was almost done. I faded some of the white borders to black so they’d blend properly [just using my eraser tool at a really low opacity]. To finish up, I placed a solid black layer beneath all the layers except the original background and erased the edges of the orion nebula image so it also blended into black. After all this work, I had the base for my new look!

Sometime soon, I’ll post about some of the CSS tweaks I had to make, the layout changes I made, and the custom logo I designed!

2 Comments :, , , , , more...

indulge your food craving with cookthink.

by Phil on May.14, 2008, under food

I was reading up on Adam Schwabe‘s blog [who is a friend of a friend of mine] and found a link to the site cookthink. It basically takes keywords of things you’re craving and provides you with recipes that might be to your fancy. After throwing in “cajun chicken” I was greeted with some interesting gumbo and jambalaya recipes.

Its a very interesting idea, and as Adam points out – it uses a tag cloud to present options to the user incase they can’t quite but their finger tongue on what they’re craving. Its already got my mouth watering even more for some cajun, alas I’m lacking with ingredients.

A powerful use I see this site being used for is to find recipes when you’ve got a few ingredients floating in the fridge. Combining leftovers has provided me with greatness before, but using real recipes is usually a safer bet.

Original Post: What Are You Craving

Cookthink beta

Leave a Comment :, , , more...

where should i get new music?

by Phil on May.14, 2008, under music, tech

This post discusses tools that can, but are not designed to, aid copyright infringement. Leaving aside potential legal issues, this post is intended to serve an educational purpose and merely describes already available services and software.

A few days back my friend Jake posted an article about the state of downloading music in a post-LimeWire age. Over the years, there have been a few ways that people have gone about getting music from the internet, the most popular being:

  • Napster
  • Morpheus
  • Kazaa
  • LimeWire
  • BitTorrent
  • The iTunes Store [and its ilk]

Jake mentions another alternative – newsgroups. Its a viable option, but most people don’t want to pay a monthly subscription fee for content. Another up and coming site, especially for electronic music is Beatport. Lots of artists are putting their songs up on this site, and the prices aren’t too bad.

A big question now is, where do you find new music? Thanks to the explosion in social networking sites like Facebook and sharing sites like Youtube, there are new methods of finding your music. There are a few websites that allow you to stream audio at any time, but you can’t download it. The bonus is these sites are not like LAUNCHcast or even Last.FM radio – you still get to choose what you listen to.

Some of the best sites for this are:

The Hype Machine: “The Hype Machine tracks a variety of MP3 blogs. If a post contains MP3 links, it adds those links to its database and displays them on the front page.”1 It also provides links to the iTunes Store and AmazonMP3 to purchase the music. The Hype Machine is unique when compared to the other services listed here because it indexes new music much faster than the others, and if you’re looking for a brand new track, you’re most likely to find it on the Hype Machine.

Imeem: I don ‘t use the service, but it seems like users are allowed to post MP3′s, videos, make playlists, and all other sorts of goodies. This site seems to focus on a lot of the social aspect of sharing.

Skreemr: Like Google for .mp3 files. It scours the web for MP3s and then provides an interface to listen to them, a link to the site that hosts the files, as well as a link to Amazon for the song.

iLike: The most commercial of the listings here, this site looks at your existing tastes and recommends artists to you, much like Last.fm. However, I’ve noticed there seems to be a much higher quantity of full songs on iLike than Last.fm. iLike also focuses a lot on the social aspect of sharing.

The best part about all of these services, in my opinion, is the ability to listen to your music right away. No downloading required [unless you want to, in some cases], you just press play and you’re good. I actually use the Hype Machine more often than I use iTunes now, because there’s no hastle and I can listen to it on any computer, not just on my personal machine.

Have you tried any of these services out? Let me know in the comments.

From http://hypem.com/about1

2 Comments :, , more...

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Visit our friends!

A few highly recommended friends...

Archives

All entries, chronologically...