Beautiful designs coming to life it's what we do...

Smashing Theme

Many of us know and read Smashing Magazine. Last week SM had their First Anniversary celebration and Vitaly ask me to do a wordpress theme for this occasion. This was an honor for me and say thanks in a special way to this magazine for the content they provide.

I haven’t got so much time (around 4 days) but i came with an idea and did the theme. Vitaly asked me also to detail the creation process of this colorful theme. You will find that information on the release post on Smashing Magazine.

Smashing Magazine Theme

The Smashing theme has a plug-in integrated into the functions.php, so modifying this file you should have some basic knowledge about PHP. The theme is Widget Ready.

Last Update:  February 03 2009

149 Responses to “Smashing Theme”

1

Avatar

I’ve downloaded your theme when it came up on smashing magazines and am using it right now on my blog. I love the design and the layout.. The colors are something i might want to change sometime in the future, but the design is super! Thanks for sharing.

2

Avatar

You guys are getting each time better… no words… this theme is amazing!

3

Avatar

i love the colors and the design, everything…

the only thing that i’ll probably add, is that every time i add a widget it doesn´t take new colors… i don’t know if i’am beign clear… sorry about my english

keep on with your designs that are very nice

4

Avatar

Hey Kindly let me know how to change the color of second Sidebar ( Right One). I want the single color there.

Plz help me,

5

Avatar

Wonderful theme! As others have mentiond, however, I too am having some problems with the sidebar colors. Any suggestions?
Thank you!

6

Avatar

In wordpress you can change the CSS of the Side bar -> Presentation -> Theme Editor

If you look at the sidebar.php you can see the following

This means you that the design for the sidebar with the Meta information is given in the stylesheet as #SR.

Select the stylesheet.css

Find the following:

.SR { background: url(images/SR.gif) no-repeat right top; width: 400px; float: right; }

Here you can see that the grey sidebar is made by using the SR.gif images as a background. You can change this in the stylesheet.

For example: if you want a white sidebar: use #FFFFFF instead of url(images/SR.gif)

This will probably change some of it, so make a backup of the orignal css file before starting.

Hope this helps out..

Note: this will not only change the sidebar with the information, you’ll still have to change the css code for the sidebar as it goes past the tekst..

7

Avatar

great theme , fantastic colors :)
thanks…

8

Avatar

I’m sorry — I’m new at CSS and having some problems. Can you provide more information? :)

9

Avatar

fantastic colors :)
thanks…

10

Avatar

Good, thanks

11

Avatar

I am having problems with the search feature. On the search results, lets say you search and there are 3 pages of results, when you click page 2 it doesn’t pass the s= variable and thus you get the 2nd page of ALL your posts ?

Any ideas ?

12

Avatar

fixed

in header change “post” to “Get” :)

all working now.

13

Avatar

yay… happy that you fix the issue.

14

Avatar

It is a great theme it really is – love it !

15

Avatar

I just put this design on my blog – it rocks. cheers

16

Avatar

grate design! thanks.
I need some help. I have the comments very close to the next post, so its look like they were of the next one. I think the dot line look like the finish of each post. how can I get it better?

17

Avatar

@david
No Idea sorry!.

@francisco
Try explain better, I didn’t understand.

18

Avatar

I would like to enlarge the space between the comments of a post and the title of the next one. if you see mi blog, you will see they are very close and they look like if they were of the same post. sory because of mi english… thanks

19

Avatar

Edit this css line from:

.post {
padding: 0px; position: relative; clear: left;
}

to

.post {
padding: 20px 0px; position: relative; clear: left;
}

20

Avatar

PERFECT !!!! THANKS!!!

21

Avatar

how do you make your comments standout like that ? it looks amazing!

22

Avatar

hey thanks, i love colors for this themes.i am using it on my new book site.check it out.
http://bookdirt.blogspot.com/

23

Avatar

Just saw your theme on hoovaloo.com. they made their own custom logo for the top that looks really good.

24

Avatar

Hi,
i have adapted the theme for dblog, an opensource platform in .asp

Thanks Elena and Smashing!

25

Avatar

Hey I love your great script. Can you tell me how I can add a border to any images dispayed, thanks !

26

Avatar

I’m using the theme at http://www.tastitunes.com but when looking at it at work on IE6 the sidebar contents is all the way on the bottom.

27

Avatar

How can I make the far right sidebar wider?

28

Avatar

@david
There is a plugin called Official Comments.

@Silvio
Good to hear that.

@MB
Isn’t a script…The border is in the image.

@Lisky
You can not…the sidebar is fixed. You made some changes in the css or what you placed in the sidebar is larger.

29

Avatar

Hi, I’ve been using this theme and its really great. I’ve just updated WP and it seems to have header sending problems on this theme. Maybe I’m wrong about this also. Cheers.

30

Avatar

I haven’t changed anything in the CSS – I’ve tried to slowly remove all the stuff in sidebar but still dropping all the way to the bottom on IE6

31

Avatar

It’s all working!!

I might have this get this fab Elena to do a special Tasti theme for me!!

32

Avatar

Hi
i have problem
After activating and viewing the smashing theme on a brand new wordpress installation, each post and page only displays the first character of that post or page. For example, on the default HELLO WORLD post on a fresh WordPress install, I only see the “W” in the actual “Welcome to WordPress” post.

33

Avatar

Thank you very much..

34

Avatar

This is a wonderful theme! Thank you very much.

Elaine, could you assist me a little please? I can’t seem to get it to display the coloured boxes on the left sidebar. I checked and the permissions of all files are okay (664) directories are (775) and ownership is good.

I wonder if it is a plugin that is causing this problem? Have you come across this before?

I’ve installed your excellent them on http://mahmoodsgarden.com

Thanks!

35

Avatar

Sorry, tried it with the latest versions of Safari and Firefox but problem exists in both. (Mac OSX)

36

Avatar

@tom
Try to upgrade wordpress and make sure you haven’t made any change on the theme.

@Mahmood Al-Yousif
Try to use the original theme boxes. Insert your content into this div.

<div class="Panel PBlue"> …your text here… </div>

37

Avatar

Thanks Elena, I didn’t realise that there are “original theme boxes”! Can you please explain? Are those standard widgets? As I do not see them in the widgets control panel.

38

Avatar

Ah, they’re hard coded.. I just looked into the sidebar.php…

39

Avatar

How can I put an ad after each post on the main page?

40

Avatar

Liski, I think you need to use ad management plugin to do that. Anyway, this is a great theme. Seriously considering it for my blog.

41

Avatar

I’m also having the same problem as Mahmood Al-Yousif where the coloured boxes in the sidebar disappear when I’m using widget. However, they will reappear once I stop using widget for the side right left bar. Hope you can help.

42

Avatar

Just wanted to send my appreciation to Elena, DD and Smashing for this great theme. I’ve just refreshed my site (http://ronaldlewis.com) with this theme.

Many thanks.

43

Avatar

Elena,

I’ve emailed you a few times for a qoute!

44

Avatar

Nice theme.. using it in my blog now….
keep up the good work!

45

Avatar

Hi Elena, thanks for sharing this awesome theme. It’s really pretty!
I’m having the same problem reported by Liski: the whole sidebar goes to the bottom on IE6. It looks great in Firefox but most of my readers are still using MSFT’s sorry excuse for a web browser so I need to fix the sidebar… any idea?
thanks
LR

46

Avatar

I’m having the same problem Tom mentioned… i looked at the smashingmagazine comments and 2 other people had it too… i’m talking about the “only the first character of the post showing up” issue… i have a clean wordpress (latest version) install and didn’t make changes to the theme…

47

Avatar

Just to add something I discovered as follow up of my previous comment (54). I checked the code in the two latests posts published. The second one had a tag on it. It was only the opening tag so I deleted that and problem solved. Maybe it was just about a misplaced tag??

48

Avatar

Amazing theme! The color combination is fantastic. Thanks for sharing it!

49

Avatar

@Ginn Wei
I am working on the improved version of Smashing Theme and there the widget sidebar will work and look ok.

If you have IE6 errors on the sidebar, please make sure the content doesn’t exceed the column size.

50

Avatar

@John
Please send me an email with this error. I don’t know what it is.

51

Avatar

Hello, is there a way to limit the homepage to show post_excerpt instead of the whole post?

I can’t find it anywhere and the whole posts are shown. :(

Thanks for the great work

52

Avatar

I love this theme, I’m trying to get it to work on my blog, but unfortunately I’m running into the colored boxes disappearing on the left sidebar again. I haven’t touched the source code. Is there a widget/plugin interfering?

53

Avatar

Gah, well I installed the theme with the same untouched files on another blog of mine and the left sidebar works fine. I deactivated all plugins, but the sidebar colors still aren’t showing up. I can’t understand it. Any suggestions would be appreciated, I really would love to use this theme on my blog!

54

Avatar

Any suggestions would be appreciated, I really would love to use this theme on my blog!

55

Avatar

I love this theme… have installed it and playing around!!

Thanks :)

56

Avatar

Having problems with getting whole posts to appear on the main blog – only titles of my posts are showing up! How do I fix this?

57

Avatar

Actually, even when I click the single link for a blog post no posts actually show up, just the comments :(

58

Avatar

Hi, I’ve got the same problem as John (comment 55) & tom (comment 40), only the first character of any post is showing up. If an image was inserted, then the HTML character “

59

Avatar

Oops sorry, I typed the HTML open bracket & that caused the rest of my comment to disappear.

Basically this problem only happened with WP 2.3.1, I had no problems with WP 2.3 before the upgrade. This was with a clean install of WP 2.3.1 and latest download of Smashing, with no files or settings changed at all.

Any fix would be appreciated as this is a lovely theme & I would really love to use it!

60

Avatar

Hello, traduction en français ici : http://wordpress-tuto.fr/theme-wordpress-smashing-magazine-250

61

Avatar

wmwebtr ödüllü seo yarışması

62

Avatar

I’ve used it for my new idol site. Like it. Thanks Elena.

63

Avatar

Thank you for the link! It definitely is an interesting paper, and I hope more researchers look into how such a system came about now that we have more details on how it works.

64

Avatar

Love the theme!

I have created a custom header and I would like to apply it to the Smashing theme, but I am not sure how to edit the theme within WP. (I’ve been w/ Movable type for several years and just recently made the transition).

I tried editing the header.php file and ftp’ing it to the site, but was not successful.

Any suggestions?

Thank you:)

65

Avatar

so i recently adopted this amazing theme for my blog and the only problem i have with it so far is that i want the default category listing to be alphabetical, not by category ID. I’ve tried a number of plugin’s but none seem to fix the problem. If I import my own sidebar widget of categories it screws everything up. Is there something easy I can change that will sort the categories alphabetically?

66

Avatar

COOL THEME I LIKE I AM TRYING TO USE BUT CAN YOU TELL ME HOW TO ADD MY OWN LOGO UNDER THE STRIP AT THE TOP HEADERBFG.GIF???

PLZ HELP

67

Avatar

Any news on a widget ready version? I love the theme and I’m trying to adapt it for use on my site but I need a widget-able version.

Thanks!

68

Avatar

I also have the problem of the “first character”/”first letter” in this theme; but i solved it.
The solution is very simple:

This is the original code of “menu.php”

" href="/">Home
]+)>%U','', $pages);
$pages = str_replace('
','', $pages);
echo $pages; ?>

if you remplase “menu.php” for this code:

" href="/">Home
]+)>%U','', $pages);
$pages = str_replace('
','', $pages);
echo $pages;
unset($pages); ?>

the bug is solved.

Maybe is a WordPress or even PHP bug… im new in PHP, but this works for me… ;-)

69

Avatar

oh, well… i cant post “code blocks” here… but… telling the solution in “easy mode”, put the line: unset($pages); in the first php code block, and remove the second php code block in menu.php, and the problem is solved…

And i forget it… :-)
This is a really good theme. ;-)

70

Avatar

I translated it to Turkish.

http://www.myerdogan.com/wordpress-temasi-smashing-theme

71

Avatar

Very beatiful, thank you.

72

Avatar

I just noticed something with the theme, I use tags heavily on my site, and for some reason when you view a tag, it doesn’t paginate any posts? It only shows the top ten posts for that tag. Anyone else having this issue?

73

Avatar

i am having an issue with the page issue, i don’t know why it is not recognizing the pagingate function, elena, do you have a solution?

74

Avatar

Great theme. I changed a bit this theme using Photoshop … take a look http://www.aaaod.com

75

Avatar

I am experienced a blank content when using this theme

76

Avatar

hello elena,

as with everyone, i fell in love with your design. i just want to know how can i put a custom logo in the header, just like in the gossip city theme.

thanks and more power.

77

Avatar

Elena,

How can I put a custom logo in the header…like the way it is in gossip city?

One more thing is that the first sidebar doesn’t have the colors that I saw in the demo……..it’s all in grey……please check out http://www.pointlesslycool.org and help me out with this! I need colors like it is in your smashing theme demo.

Thanks in advance. And by the way, the theme is fantastic! :)

Manu.

78

Avatar

Hi Elena,

I just found that when i keep the left sidebar to default, it is doing fine. But when I drag and drop something to it, the whole sidebar changes to grey……..what do I do now?

Manu.

79

Avatar

great theme , nice colors thanks…

80

Avatar

It’s very nice theme, which I used now,

But I really do not know how to make the avatar works in wp 2.5.

81

Avatar

Hi i just want to say nice theme Elena, right now i am using it on my blog. Thank you for your creation

82

Avatar

Hi, thanks for the beautiful template.

One question though, I get two errors when I try to validate the page with the w3c validator, could you check this?

83

Avatar

It would be really nice if this is widget-ready…

84

Avatar

hi,
i love it soo much thx :)
i adore how its done. its simple & clean. i use it for my coming 1st website. MonstersCube.com.

85

Avatar

Hey, I really love this theme! It’s very beautiful.

However, it seems to have a conflict with the WP Thread Comments plugin. When you try to reply to a comment in Ajax, the “submit post” button disappears. I think it may be something with the CSS.

86

Avatar

Hi! I translated it in italian
http://www.rmsoft.net/?p=62

87

Avatar

Hi there. Is there any way to make the colour boxes on the left sidebar show? I saw them working at http://www.pointlesslycool.org but there’s only one colour. Thanks for the beautiful theme and we would really appreciate your help.

88

Avatar

Beautiful :)

89

Avatar

it’s doesn’t seems to work for IMAGE CAPTION on wordpress 2.6.2
is there any solution for it?


[caption id="" align="alignleft" width="158" caption="Test 1"]


[/caption]

90

Avatar

gravator icon doesn’t displays on comments ??
what is the problem do I need to use another plugins for the same.

91

Avatar

thank you designdisease.

92

Avatar

Hi

Just started using the theme on one of my new blogs, but I ran into the “First Character” bug mentioned above.

There is a much simple fix.

In menu.php, find the line that reads…

…and change it to…

Worked straight away for me, posts showed up and blog working fine!

Great theme :)

93

Avatar

The code didn’t show, sorry! (I used code tags..?)

Find the line in menu.php that reads…

…and change it to…

…and it should work for you!

94

Avatar

Try again… it’s reading my PHP :)

Find the section…

“? unset($pages);”

…and change it to…

“?php unset($pages);”

And it should work. Hope this comment will!

95

Avatar

Hello! I love this theme, but am having a hard time getting little things to work. I want to add a “stumble it” button but following Stumble Upon’s directions, it’s not working. Also, I can’t get my ads to show up in my sidebars. I’ve tried using the built in ad widgets and I’ve tried adding the code directly to the pages…neither work. What am I doing wrong? I really love this, but I just can’t get it to behave how I want!

96

Avatar

Hi there. Is there any way to make the colour boxes on the left sidebar show? I saw them working at http://www.pointlesslycool.org but there’s only one colour. Thanks for the beautiful theme and we would really appreciate your help.

97

Avatar

Hi

Thank you for this theme which I want to use on my upcoming non-profit project. I am currently testing your theme on my site jimmy.gs. I have done away with the right sidebar to give space to the main sidebar. What i would like to see is to extent the width of the content portion from the present 505 px to around 650px and the sidebar 350px. I have altered the sidebar width to 390px and that works fine. But i ended up messing with the code when i tried to extent the content width. Also let me know if you mind placing theme credits in a post from footer.Any help will be highly appreciated.

98

Avatar

Very nice. thanks

99

Avatar

Hi,

I love this template, and while uploading the CSS file, I get this error:

We were unable to save your template
Please correct the error below, and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: Content is not allowed in prolog.

Could you please help, I’d really like to use this template!

Thanks
Jyoti.

100

Avatar

I love this theme, thank you! I just have one problem though, that I was hoping you could help me with.

I have the ReCaptcha plugin installed on my WordPress 2.8 blog and I was hoping that the ReCaptcha box could appear above the “Post” button in the comment section as opposed to below, as it is now. I tried to fix it by going into the comments.php section but what I added did not seem to work.

If anyone knows how to fix this problem, I would greatly appreciate it. Thank you =)

101

Avatar

Hi,

I am having problems with the colors on the side bars as well. I LOVE this theme but would love to make it better with the color side bars. See curent site here: http://www.angelaschrempf.com

Please help!

Angela

102

Avatar

I love this theme. It is clear theme with nice color. Thank you for sharing this elegant theme!

103

Avatar

I installed this theme on my new blog. I really love this theme. The sidebar has beautiful color.

104

Avatar

You have some great theme designs here. I guess we are all after something special for our blogs and you have plenty of those templates here

105

Avatar

Hi! I downloaded this theme and found it very amazing. Thanks for sharing this.

106

Avatar

Tnx this theme

107

Avatar

i love this theme!

108

Avatar

Thanks, best theme. Ezel dizisi son bölüm izle.

Leave a reply

Sum of 3 + 4 ?

You can use these tags: <em>, <strong>, <code>, <blockquote>, <a href="">