Create a Killer Band Site with Drupal: A 6-part Tutorial Series

Jan 10

Tutorials, Web Design

This tutorial is another special series written guest author Sean Hodge from aiburn.com and Connection Cube. He is an expert in Drupal, which I am totally not familar with. He intrigued me when he told me that the majority of the bands on Sony’s record label are powered by Drupal. Drupal is basically an open source CMS, and I was interested in learning more about it. So that’s why he’s writing this tutorial for us. You can learn along with me!

The Complete Lesson Index:

Read Part 1 – Design it Illustrator
Read Part 2 – Slicing it Illustrator
Read Part 3 – XHTML
Read Part 4 – Theming in Drupal
Read Part 5 -Drupal Admin
Read Part 6 -Wrap Up and Additional Resources

Introduction

sitelayout.jpg

In this six-part Drupal tutorial series we’ll be reviewing how to create a Drupal website from scratch for the fictitious GoBand . Also, we’ll review an alternative development path for website design by using Adobe Illustrator. You will learn exactly how to build a fully functional dynamic band website from start to finish in this lesson. This first part will go over what Drupal is and why you should use it.

drupal1.jpg

If you are not familiar with Drupal, I’ll briefly outline some reasons to choose it as your platform of choice for website design:

* Drupal is a robust platform and Content Management System. Its used for bands, communities, ecommerce, and more. It is used on many sizes of sites from small companies, to non-profit groups, and all the way up to large corporate entities.
* Anything you want to do can be done with Drupal. It will fold your laundry if you program it to.
* Drupal is very modular. At the code level it is made to be tapped into with its system of hooks.
* Drupal is one of the fastest growing Open Source Projects there is.
* And for the purposes of this tutorial, Drupal is used by numerous Bands.

Sites that use Drupal:

Sony BMG Records has a multi-site install of Drupal that shares the same code base for many of its bands’ individual websites. So, this gives you a good idea of how large Drupal can scale. Here are a handful of their band websites that are built with Drupal:

http://www.ozzyosbourne.com
ozzy.jpg

http://www.daughtryofficial.com
daughtry.jpg

http://www.goodcharlotte.com
goodcharlotte.jpg

And of course, many more.

This is a great example of how powerful Drupal is. We’re going to get you started with making bands websites in Drupal. And believe me if you become an expert at this there is a huge market for talented Drupal Developers and Web Designers out there.

Here is a rundown of the tutorials to follow in this series:

Tutorial 1 – Follow along as we build a design for the fictitious band, “GoBand.” We’ll use freely available Go Media Arsenal elements to add some flair to the website design in Illustrator.

Tutorial 2 – Get out your virtual knives because we’ll be slicing and dicing our design and prepping the images for the web.

Tutorial 3 – Put on your coding hat, mine is a tucker style cap that says, “Coding the Distance”. We’ll be converting our design to standards based xhtml and Cascading Stylesheets.

Tutorial 4 – Don’t take that cap off yet. We’ll be converting our xhtml/css into a working drupal theme. Yes this means opening up some scary php template files.

Tutorial 5 – We’ll get familiar with the Drupal interface and set up our website.

Tutorial 6 – We’ll wrap up the series with some Final details and leave you with some excellent Drupal resources.

What skills do these tutorials assume you have?

To take advantage of this whole series you should have a familiarity with xhtml and cascading style sheets. Though to be a Drupal Ninja you need great php chops for the purposes of creating basic Drupal themes and this tutorial series you can get by fine without. We’ll cover the deceptive black art of the copy and paste of proven workable php code. It would help to have some familiarity with Illustrator or a similar program. Though a desire to learn and access to the program is all you really need.

Check out the Next Lesson:

Read Part 1 – Design it Illustrator
Read Part 2 – Slicing it Illustrator
Read Part 3 – XHTML
Read Part 4 – Theming in Drupal
Read Part 5 -Drupal Admin
Read Part 6 -Wrap Up and Additional Resources

Go Media is a creative agency based in Cleveland, Ohio. Besides the GoMediaZine, we also work for clients and sell stock artwork and design files on the Arsenal.

grunge, tutorial, web

This post was written by:

Jeff Finley - who has written 202 posts on GoMediaZine.

I'm one of three owners of Go Media and admin of the GoMediaZine. I've been designing professionally since 2004 and I also play drums. Follow me on twitter!

Contact the author

  • webmasterforumu2011seoyarmas
    Does this mean a New Zune soon?
  • Drupal is thousands of developers working together. Drupal makes your life very easy, but that's no excuse for being lazy. Using open technologies such as Drupal, PHP, CSS, AJAX, MySQL you can create media-rich, dynamic and interactive web-sites with a focus on clarity, texture and usability.
  • ulsuoyevdeneve
    so nice thankss
  • Great to see Drupal rather than Worpdress, for a change. You get much more chance of getting the look that you really want.

    Kind regards,

    John
  • I am very excited for this write
  • film izle
    cok güzel olmus elinize saglik :)film izlefilm izle
    bedava film izlebedava film izle
  • Come to think of it, Drupal has put a lot of effort in making things easy for their users so you might be right. Anyone can make a very nice site with little or no coding knowledge
  • youtubeizle1
    Thanks for sharing these info with us! I was reading something similar on youtube website that i was researching. I will be sure to look around more. thanks...
  • mfarney
    You make it all sound so easy...Come to think of it, Drupal has put a lot of effort in making things easy for their users so you might be right. Anyone can make a very nice site with little or no coding knowledge.
    __________
    Mathew Farney - Web Hosting
  • Personal website of Dries Buytaert. Dries is the original creator and project lead of Drupal, co-founder and chief
  • thanks for sharing it is really informative
  • Thank you admin
  • Adam Pickering
    For wordpress band website templates, I like what http://bandwebsitetemplate.com/ and http://www.bandthemer.com have done to develop band wordpress themes
  • Adam Pickering
    For wordpress band website templates, I like what http://bandwebsitetemplate.com/ and http://www.bandthemer.com have done to develop band wordpress themes
  • CMS to be honest are a custom programmers worst nightmare. but very good for the noobies. thank you veryy good
  • Thank you for this.
  • CMS to be honest are a custom programmers worst nightmare. but very good for the noobies.
  • Just got my hand on Drupal. How is it compare to Wordpress?

    Looking forward with the tutorials.
  • If you are using Drupal and are looking for a customize Drupal theme or are looking for more videos, then you should checkout the Drupal official website. There are over a hundred Drupal tutorials and videos listed under the theme developer handbooks. If you want to look at another great theme that could be used for your Band website checkout the one made at Ion Drum Rocker Reviews. www.iondrumrocker.com
  • dsd
    I'm thankful to the one who wrote this passage. I always read and write this style of articles. youtube Also, as a daily writer, I present my respects to the all writers. Lately, I have watched a video resembling that in

    In my opinion, people should research first and write then.

    Regards.
  • this was like a gift from heaven..thnx mate for sharing your knowledge :)
    really appreciate it.
  • CMS to be honest are a custom programmers worst nightmare. but very good for the noobies.

    even though i must add there very entertaining to develop modular plugins for and look rather nice when there all done, but have a closer look at the way a CMS generates code...notice any horrible quality code? cms breed bad code like a std in africa.

    but dont listen to me, because if it works it shouldnt matter, thats just coming from someone that has been custom programming for about 13 years.
  • Glad to see Drupal is getting some love. It's a great platform and theming a beautiful site really isn't that hard with little practice. Thanks for the series!
  • amazing tutorial series

    thanks!
  • this is one hell of a tutorial! i can't imagine how much effort and time was put into this!

    i run a community site running on drupal and this is just what i was looking for!

    thanks!
  • George
    thanks, i think the whole tourdates,attendees and reviews module is fantastic. I hope part 5 and 6 will shed some light on those features. Great tutorial.
  • George, some of the key pieces that were built for the Sony Multisites are the Fivestar rating module, the Custom Breadcrumbs and Custom Pagers module, and a number of other bits.
  • George
    Jeff, you say the SOnyBMG artist mods are available?! And where would be find those mods?

    thanks
    G.
  • Let me know if I missed any questions. Thanks.
  • @Firewalker
    I have little experience with Wordpress at the moment. But from what I've read its a great system as well. I can't directly compare them without more experience. I will be working on blog redesign in Wordpress for a friend during the time these tutorials are being written though. So, I might have more direct comparisons as we move forward.

    @branden hughes
    Before learning any content management system I would work on having solid html and cascading style sheet understanding. http://www.w3schools.com served as a resource for me when I was learning that years ago. If any readers have some good resources for Branden then feel free to comment about that.

    @Avangelist
    I found there was a learning curve for me with installing Drupal for me as well. Lullabot has some great videos that helped out there. We will be using Drupal 5 for this tutorial series, so, this is a good link, http://www.lullabot.com/videocast/installing_dr...

    For me, getting Drupal do what I want took some time. A lot of my learning came from looking at other themes and how they did things. I would copy the code, make a note of what it does, and save it for when I need it. You'll find that 80% - 90% of what you need to do is easy. The last percentage usually requires some php code.

    I'll be showing you how to iron out those creases in your trousers by using free code available to copy and then paste into your theme. If you are good with php then I envy you.

    @Jan
    Glad your following along. I'm not really trying to convert anyone. I'm just presenting knowledge that I've gained over the last year of working with Drupal. Maybe you'll see some advantages that Drupal could be used for in some projects in the future.

    @Nicole
    "If you spend the time to learn the tech and have decent logic thinking - you can make any system fit your needs."
    This is a good point you made Nicole. I think some CMS's are a better fit for certain projects as they may have tools already in place that you can leverage. As with any project it depends on your experience and the time it will take you to use the tools at hand. A CMS is a huge tool.

    @Jan
    You make points that I agree with. I liked investing my time in Drupal because it can output any type of site well and there are tons of tools available for it. Its made to hook into. Though I've gotten really into blogging and Wordpress is used by so many potential clients that I would like to invest the time in learning that system in the future. I decided to stop working with Joomla as I found to much table based code used in its core and in many contributed modules. Though newer versions of Joomla will likely fix that.

    @MattLikeALion
    Try the video I recommended about and see if that helps. There are a few other videos on Lullabot as well that I found very helpful. http://www.lullabot.com/videocast

    Its possible that there is an issue with your host. Though I would check to make sure its not something more basic occurring. Try setting up a local test environment on your cpu. That's a good way to see that you know how to set it up correctly. Then try setting it up on your host's server. That's how I learned. Lullabot has a video on setting up a local test environment as well.
  • @Aaron
    I think its great that someone with a lot of experience with building band sites can add some feedback to this series. With Drupal resources are spread out over multiple places on the net. There is more than enough information online though.

    As we go along I'll point out resources for you to bookmark if your interested in learning Drupal. The series will also wrap up with a list of great Drupal resources. There are also a handful of great Drupal books out now with more on the horizon for 2008. So, finding resources is as simple as buying a book.

    As far as a Drupal look. I've worked with Joomla in the Past and I found the templating system to be almost identical to work with. My experience with Joomla meant very little learning curve with jumping over to Drupal for theming. If you can do it with xhtml/css it can be done in Drupal. And the process is usually straightforward.

    Let me know if you have any questions as we go along.


    @MattLikeALion
    That's great that you are excited about the series. With my schedule the way it is right now weekly releases is the quickest I can get them out the door though. Let me know if any questions come up as we go along though.


    @Jeff Eaton
    I'm a long-time Lullabot podcast listener. You guys have taught me a lot about Drupal. I'll say your team's enthusiasm for the system really won me over to using Drupal. Thanks.
  • Hey All,

    I went on Vacation with my family last week. Aruba is beautiful. I'm back now though. So, I have some comments to catch up on. I'll answer any questions that have come up last week. And thanks for all the support and excitement.
  • MattLikeALion
    In preparation for this series I tried to go ahead and set up drupal on a database for one of my sites, but could never get it to install correctly. I'm hosted with 1and1 - great pricing and packages but poor tech support service.

    Nevertheless, I'm excited about friday's (?) installment.
  • GLAx.
    I'm also wondering.. :)
    It looks already very nice :D
    And I have no experience with Drupal.. so this is my first time.. :)
  • Swoopy B
    Which day will the fist tutorial actually start on?
  • Yo Jeff!

    I have decided to re-work my site and I am going to follow your tutorial whilst doing so.

    I will email you with an idea!
  • Jan
    @ Nicole - I absolutely agree. But some CMS have let's say a tendency to a certain kind of final website. In wordpress its of course the Blog but there are so many plugins that you can make any other type of website out of it. I see Joomla as an opposite of this. It comes up with many included functions and settings and you don't have to 'paste' them together like in wordpress. On the other hand there are many functions not every website uses and the result is higher performance needs and complications.
    The interesting thing about Drupal is that it's more focused on allround websites not only blogs.
  • @branden - the best place to start with Wordpress is Wordpress Codex. It has all the link to very basic programming in WP to how to create your own plugin.

    I do a lot of Wordpress work but have also worked in other custom CMS sites. I haven't worked too much with Drupal but I'm excited to see what it's all about. In the end, if you spend the time to learn the tech and have decent logic thinking - you can make any system fit your needs.
  • MattLikeALion - we use Wordpress here
  • MattLikeALion
    Jeff,

    What CMS do you guys use for the GoMediaZine?

    Also, I just noticed that you might want to up your © notice at the bottom of the zine to 2008.
  • Jan
    I'm using wordpress right now. Happy to see if you will convert me to drupal in which I'm interested for some time now but never had to time to take a closer look.
  • @Aaron - You're not a downer, it's cool. I'd like to see what your methods are for building a band site though. If you have some good ideas and methods I might be interested in hiring you to contribute a tutorial of your own.
  • You know I have tried to do two things with drupal in the past:

    Install it - failed miserably, total pain.

    Get it to fold my washing - ended up with massive creases in my trousers, scrunched up cuffs on my tops and very stiff cardboard like underpants.
  • where can i go to find out more on wordpress and or drupal and how to become more equipt in writing the code to design websites? i have a very strong background in illustrator and photoshop but my coding skills are very very generic.
  • Just got my hand on Drupal. How is it compare to Wordpress?

    Looking forward with the tutorials.
  • Great topic for a series of articles! I'm looking forward to seeing how it unfolds. After working on the artist sites you mentioned above, it's gratifying to see them being used as proof that Drupal can rock for... rock. ;)

    For those who are interested, quite a few of the custom modules that were designed for the Ozzy, Daughtry, Good Charlotte, and other Sony BMG artist sites are now available for the entire Drupal community to use. Three cheers for Open Source!
  • BoB
    this is the business!
  • MattLikeALion
    Can you get excited about the tutorials, to the extent that you complete them quicker than weekly? Pretty please?

    I'm in the midst of learning about CMS's and deciding which one to dedicate to learning. This is going to kill me having to wait for the continuing GoMedia tutorials.

    I am so glad you guys are adding this to the already super-informative catalog of tutorials.

    Thanks to the whole GoMedia teem for all the selfless time put into helping us newer designers grow.

    #ILAL~*
  • Not to be a downer, but I build band sites everyday and I am not at all impressed with the Sony sites. The functionality presented is not typical of what most bands desire. I have also used Drupal a lot, and find it very limited when it comes too the details, and the details can make it or break it in my opinion.

    A not entirely unique, but nearly universal, trait that a band desires for their site to posses is to be as individualistic as the band (perhaps, even more so). Drupal, in it's complex and broad scope, inevitably "looks" like a drupal site, unless you really know what you are doing. The Sony sites, all look how I expected them to, like a template, and convoluted.

    I will be tuning in, however, and hope that I will stand corrected.

    Keep up the good work.
  • sounds very interesting....looking forward to hearing more!
  • hehe, right at the time, I might be starting to build a bands website next week :D

    First I wanted to build it on wordpress, but this preview is getting me really curious!
  • Pat
    If you send me an email (patdryburgh@gmail.com) I am more than cool with sharing what I'm doing as I'm doing it.
  • I too am currently building a musician's website in wordpress. Though, I am nearly completed. I am intrigued by what cn be accomplished with drupal.
  • ilginc
    think that's great. I've gotten really into blogging and I'm interested in knowing Wordpress as well as I know Drupa
  • belenbelen
    I think that's great. I've gotten really into blogging and I'm interested in knowing Wordpress as well as I know Drupal. I think the Open Source CMS community as a whole film izle can learn a lot by sharing with each other. Each system has its strengths and weaknesses.
  • @ Pat

    I think that's great. I've gotten really into blogging and I'm interested in knowing Wordpress as well as I know Drupal. I think the Open Source CMS community as a whole can learn a lot by sharing with each other. Each system has its strengths and weaknesses.

    And thanks to GoMedia for sponsoring this series and this discussion.
  • Pat
    This looks great! I am currently building a band website using wordpress as my CMS. It's been quite the experience! I will keep track and make little comments here and there (if you don't mind) about what you can do in wordpress.

    Pat
blog comments powered by Disqus