Adaptive Blog Theme: Homepage Layout
videos

Adaptive Blog Theme: Homepage Layout

on Nov 1st 2012 with 18 comments
Tutorial Details
  • Screencast duration: 53 mins
  • Difficulty: Beginner
  • Topic: Photoshop

Final Product What You'll Be Creating

Download Source Files
This entry is part 3 of 14 in the Adaptive Blog Theme: From Photoshop to WordPress Session
« PreviousNext »

Continuing on with our Photoshop layout, let’s now finish off the homepage design. We’ll be looking at the main content area, the sidebar and the footer.

Main Content Area


Alternatively, Download the video, or subscribe to Webdesigntuts+ screencasts via YouTube

Sidebar and Footer


Alternatively, Download the video, or subscribe to Webdesigntuts+ screencasts via YouTube

Further Resources

Adi Purdila is AdiPurdila on Themeforest
 
Enjoyed this Post?

Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!

By

Rollover to read this author's bio or click through to see a full list of posts by this author.

Whether it’s websites, logos or print materials, my work philosophy is the same: never take any shortcuts and always put my heart and soul into each project because in the end, it’s the small details that count and the more effort I put into a project, the better it represents myself as a person and a designer and at the same time, it represents my client in a manner that’s appropriate to his needs. If you’re interested in the HTML Templates and Landing Pages I’m developing, you can check them out on my portfolio page on ThemeForest.  

Plus Premium
 
 
Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
  • http://twitter.com/vladimir_light Vladimir L

    this “command-alt-c” for fancy color-picker magnifier. Is this a built-in feature of CS6 or some plugin?

    • Adi Purdila
      Author

      That’s an app called Color Snapper: http://colorsnapper.com/

      • http://twitter.com/borowskirafal Rafał Borowski

        I was wondering if there is something familliar for windows as well?

  • Pingback: Tutorials. Daily Digest (01.11.12) | Design Daily

  • krim belkacem

    thank you adi purdila
    you’re the best
    we were waiting for this
    thank you very mutch

  • http://www.facebook.com/andersgson79 Anders Gustavsson

    Whera can I find all shape tool to photoshop?

  • http://twitter.com/deifosv Vladimir Palacio

    Thank you so much for this Adi, I know I will learn so much from this series, I will start tonight and can’t wait.

    all the best

  • Theo Styles

    Where do I download the less.css file?

    • ianyates

      We’re releasing all the source files along with the relevant tutorials.

      At the moment we’re still focused on Photoshop, so the source contains PSD files. The next set of tutorials will be looking at HTML and CSS (where you’ll find the style.less source file) then ultimately, on Wptuts+, we’ll be making the whole WordPress theme source available for download.

      Hope that helps!

      • Theo Styles

        Ah okay cheers, been following the html and css ones on YouTube I must be going too fast haha!

  • Neil

    I like Adi’s tutorials. I’m very excited about this course. Good luck.

  • ucrazydating

    I find this course so long time online. Thank you share this for us.

  • Wasif Khan

    How did you generate Lorem Ipsum text in Photoshop?

    • Adi Purdila
      Author

      I’m using TextExpander for that, but latest versions of Photoshop CS6 have a useful option: “Type>Paste Lorem Ipsum”.

  • Tomz

    Thank you for best series. where do I download photoshop custom shapes like you?

  • Pingback: From Photoshop to Wordpress Theme | MBAx.me