Today I would like to talk about blogs that have a unique design for each post. They break the traditional blog layout by designing a different theme for each post based on the topic. Designing a different layout for each topic requires a lot of time and creativity. So, we should appreciate these blogazines who spend their extra time to make your reading more pleasurable. If you would like to join this unique post trend, below are some excellent examples and WordPress tips on how to implement it.

72ave

Every post on 72ave is well planned and designed — from color theme to layout to typography. Truely amazing work!

screenshot

Dustin Curtis

Dustin shows a table of content on his landing page. For each post, there is a different theme that goes with the topic.

screenshot

Kyle Fiedler

screenshot

Paddy Donnelly

The interesting feature about Paddy’s blog is he gives hint about the next topic at the end of each post.

screenshot

Jack Cheng

Beside the unique blog posts, I’m particularly impressed by the scrolling timeline navigation located at the top.

screenshot

Gregory Wood

screenshot

David DeSandro

If you worry about site branding and consistency, here is a good example to solve this problem. David DeSandro plays around with the content and comment area, but the header and footer remain the same.

screenshot

Jason Santa Maria

screenshot

Trent Walton

Trent Walton made it so easy to manage his blog posts by keeping the header and footer black which goes well with any light color theme. What make this blog stands out are the background images, color theme, and typesetting.

screenshot

Occasional Unique Posts

Is unique blog post design taking too much of your time? Try to do it occasionally or on a special post like Smashing Magazine and Designer Informer.

screenshot

screenshot

screenshot

Tips For Creating Unique Posts With WordPress

Creating custom post layout with WordPress is relatively easy. I find the easiest way is to design the blog posts on your local computer and then call the custom stylesheets with the WordPress’s custom field feature.

  • On your local computer, first create a folder (eg. drafts) to store your blog posts. Duplicate a copy of your theme’s style.css file in the draft folder. For every blog post, create a new folder (eg. custom-post-title).
  • For each post, create a new HTML file for writing and a new CSS file for custom layout where you override the theme’s style.css.
  • When you are done with the draft and the post design, upload the custom stylesheet to your server. In the backend, create a custom field (eg. custom-style) where you input the path of the custom CSS file.

custom stylesheet

Now in your theme header.php file, add the following code after the main style.css.

<?php $customcss = get_post_meta($post->ID, 'custom-style', true); ?>

<?php  if ($customcss != "") { ?>
  <link href="<?php echo $customcss ?>" rel="stylesheet" type="text/css" />
<?php } ?>

117 Comments

1 4 5 6
  1. web designing
    Jun 11, 2011 @ 3:38 am

    I like the look of the Web Designing Wall blog both the designing and their content is cool.

    Reply

  2. aandroid
    Jun 16, 2011 @ 12:14 am

    I thank you all. writing on the web is truly inspiring in building and designing in a modern web interface.. Great,,

    Reply

  3. complex41
    Aug 23, 2011 @ 12:17 pm

    And then he handed you the thirty-five 45

    Reply

  4. Jhun
    Oct 11, 2011 @ 3:56 pm

    Nice blog you got here. It really helps a lot on the info you are giving. I also created a blog similar to this one. You might wanna take a look at my blog http://www.phil-gabriel.com/ too. Please keep updating your posts. I will bookmark your page.

    Reply

  5. Moliva
    Dec 9, 2011 @ 9:24 am

    I thank you all.

    Reply

  6. Singapore Web Design Company
    Feb 2, 2012 @ 10:04 am

    I have introduced a lot of friends look at this article, the content of the articles there will be a lot of attractive people to appreciate, I have to thank you for such an article.

    Reply

  7. maxOman
    Feb 2, 2012 @ 11:06 am

    Thanks for the WordPress tips… now I have some more ideas for my blog

    Reply

  8. Richard Hanley Jr.
    Apr 3, 2012 @ 1:49 pm

    Just beautiful. That is the way the web should be.
    Hats off to all of them.

    Reply

  9. odesk test answer
    Apr 15, 2012 @ 9:38 am

    Suddenly i got this blog really interesting .I know all of guys are well developer .

    thanks
    Shahin

    Reply

  10. myclemash
    Apr 17, 2012 @ 8:27 am

    I thank you for all web designer wall

    Reply

  11. tori
    Apr 18, 2012 @ 3:51 am

    Such kind of template’s very helpful for create good ideas and create immaculate design so thanks for shared valuable post with us,
    Web Design Michigan

    Reply

  12. Danny
    Jun 20, 2012 @ 6:10 am

    Some great wordpress blogs on here. I like the idea of David DeSandro blog

    Reply

  13. Free wordpress installations
    Jul 16, 2012 @ 11:09 pm

    Cool, thanks for sharing will definitely bookmark this!

    Reply

  14. John Ryder
    Jul 17, 2012 @ 7:58 am

    Really great site. Your ”Trent Walton” topic is good. i read this topic.

    Reply

  15. nhteoman
    Aug 27, 2012 @ 1:32 pm

    NHTE specializes in providing web design and development, Graphics design, Seo with excellent product to ensure 100% customer satisfaction at best price.

    Reply

  16. iWeb Expert
    Nov 15, 2012 @ 8:45 am

    Thank you so much for sharing these superb tips! I am so impressed of the designs and I complement the creativity behind these works. The designs are catchy and will surely get the user’s interest in reading the blog post.

    Reply

  17. DymoLabels
    Jun 1, 2013 @ 3:50 am

    hi sir
    it really nice work
    I love those designs
    thanks for sharing
    keep it up

    Reply

1 4 5 6

Leave a Reply