![Coffee Break Coffee Break](https://woocommerce.com/wp-content/uploads/2009/08/mqxol2-550x383.png?strip=all&w=1500)
It’s been quite a while since I’ve contributed anything to the WooThemes repository, so when I finally managed to sneak in some Photoshop time, I wanted to draw inspiration from our own WooThemes website design, as we have been getting quite a few e-mails asking if our theme is available for sale. Obviously we want to keep our own design unique, but IÂ designed Coffee Break with a similar layout, so we could offer the public something similar in style.
The homepage layout consists of a jQuery slider at the top, which is great for showing of your most important content. We then added a nice mini-featured area below the slider, similar to the one we have on our homepage. You can add the sections with an icon to the left by just adding WP pages, and adding them to your options panel. We also added two sidebars, one for the homepage and one for the blog, and also a nice 2-column footer where you can have some basic information about the website.
Do you like the theme demo and the 17 alternative styles? Any other features that you think we missed? Let us know in the comments.
About
Looks pretty good, although the last page of the slider looks weird. How difficult would it be to make the fonts a sans-serif font for the main menu?
Cheers
Alex
What looks weird? 🙂
And yeah, changing the font is as easy as changing one line in the CSS.
I tried to make the slider pages as generic as possible… There is a H2 and H4 style in Georgia, and the rest is Arial.
I added some styles in FireBug for you to see how easy it is to edit style.css and change it to what you want: http://www.jepson.no/u/xyyhjj.png
Nice work Magatron. Love your trademark “Fresh” style 🙂
I love it! it has a clean and fresh design and that makes it easy to get the most important marketing message out to your clients!
Congrats on an awesome piece of work!
Thanks Debbie, I appreciate it!
Good to see the new theme released, it is a short time since last theme released!
This might be a little more than your looking for…
How about adding another default homepage setting, one that allows you to just pop in a 960X320 image/graphic. It could be a .jpg or .swf, whatever.
I have made that sort of modification to The Station via the css but it is actually a lot of work.
It would be great to just go into Theme Options > Default Homepage Settings then tick a box for ‘Just A Graphic’ or something and then have an upload option like there is for General Settings > Custom Logo.
You can just insert a big image in the post. The max width is 840px.
I’m not sure it will look that good with the type of fluid background that this theme has compared to VibrantCMS…
Nice Layout Clean
i love the full width page option! perfect for iframes and such. i hope to keep seeing the full width page option with future releases. thanks for the great new theme!!
I think one of the trademarks of WooThemes is that there’s an option to make pages FULL width in the control panel.
Yes we try to include that in all our themes 🙂
Very nice theme.
Color selection pretty good but very corporate colors.
Was hoping for some fresh/funky colors like sleek/bright orange, or refreshing lime.
The orange color as of now looks more brownish than anything. At best, maybe dull orange.
But overall nice theme.. especially the layout.
Thanks, Mike
Thanks Mike, I’ll try to spend a bit of time in photoshop mixing some colors and adding to the theme… I agree their a bit corporate 😉
I added 3 extra styles now… Chrome, Yellow and Orange (changed other to Brown).
Thanks.
The Orange and the Black color combination has a powerful impact.
Nice work! This is one of my favorites. I love the portfolio feature in The Big Easy. It would be great if Coffee Break had something very similar.
Thanks for the great theme!
Levi
That would be neat, but I don’t want to make the theme into a beast to setup, and more than it really is meant to be 🙂
Very nice theme. The Woo business themes just keep on getting better. I am currently using Over Easy and Coffee Break might be a worthy theme upgrade.
Over Easy & Coffee Break are definitely in the same mould… I mean Magnus designed it, so you can definitely consider a bit of an upgrade! 🙂
hmmm… yep – looks good but I got some troubles with the layout – doesn´t work well on screen.
Would be nice to have some more interactive themes with jquery sliders and a navi slider would be great.
The groovy blog is great with those features but still missing some tools.
As I would like to make a Salsa school layout, I search for a funky style with music, video, eventcalender….
any ideas or planned styles like that?
but you are absolutly the best guys in this biz with themes. I just renewed my account.
thanks
The theme looks great but you already know that since it is admittedly modeled after Woo2. Good stuff, Jepson!
One question… how many cups of coffee does it take to complete a “Coffee Break”?
🙂
I think Magnus thrives on his cold beers, instead of coffee… 🙂
Only up for 2 days and I’ve already had one client pick this one for the theme he wants for his site redesign. Ha! Keep up the good work. My only comment is that sometimes I feel like the color schemes on these themes prevent it from being considered as a true business theme. A lot of the choices are way too dark for the header for business – personal, sure, but not business. Maybe something to consider in the long run?
Thanks, I’ll make a note of that 🙂
I really like this theme and I’m considering it. (think I’ll wait until Daily Edition comes out and choose those two) I think the color choices are great, but I prefer a header that is is white. Some logos look good against dark backgrounds, but many don’t. I imagine that would be easy to change. Do you feel the theme will still have balance if the header is changed to white? Be nice to have a white with a bit of shading.
I tried to mock up a style in Photoshop that uses a white header: http://www.jepson.no/u/golwm2.png and http://www.jepson.no/u/2mf2vv.png
Do these look ok?
I like those colors. Especially the green. It has a nice contrast. Maybe see if the creamy one can be pushed even further?
Ok, i’ll work on some more and add them on Monday
(Edited)
Hi,
If I may add my own opinion to this topic also:
Sorry to be a nit-picker, but as with Leslie, I would also like to see some more all white background colour schemes added to WooTheme’s excellently designed themes and usability, and have been searching for one.
I believe a theme that uses white backrounds and good white space can show a certain degree of sophistication, elegance and maturity, such as with Gazzette the for example.
Some sites of authority that come to mind are Google, Flickr, The Guardian, The Times, NY Times, CNN (which is almost identical to Gazzette except with rounded corners), Innocent drinks.
I think the Web ‘2.0 colour schemes’ (since everyone is calling it that now) here are great, but having an all white option that only keeps the lines and drop shadows around the lines (in grey and other colours) would be a very much welcome addition.
(…mmm hope that makes sense, hard to describe here, but think about the minimal look Ian D Stuart’s Thematic theme has out of the box jazzed up a bit?)
Maybe WoohThemes could go a step further than all those ultra minimal bloggy themes that are becoming popular such as Cutline, Manifest, Modern Clix, WPUnlimited (out of the box), Information Architects etc, and make more ‘web 2.0 minimal static business themes’ if such a thing exists?
Some examples of what I’m trying to describe are the excellent Flickr site, which has all that chunky web 2.0 typography also, but in particular the uTorrent site:
uTorrent(dot)com (coudn’t post the link here)
…which I think is sophisticated, very pleasing on the eye, cutting edge and just beautiful.
Could a white background version of this theme be made with a similar idea to what they’ve done with the uTorrent theme? ie, completely white header bar, as with most of the sections, but instead of making it ALL a light pastel, just have only a slight shadow or pastel gradient covering 5mm or whatever above the jQuery segment dividing line? (as they have with the header and fat-footer on uTorrent for example)
Some colour can always be provided with the dividing lines and shadows/grandients immediately above or bellow those lines, and through chunky titles in Georgia or Arial as is the trend just now.
just an idea …
Too dark? What would you change it to? Lighter, pastel-like colours perhaps?
Peach with bows and flowers, but of course! I just know that the bright yellows and pea greens are something clients tend to want to avoid, as well as the dark bands on the top – I think half of them have some sort of dark brown, dark gray or black thing going. Just a suggestion because I know what my clients ask for … but no matter for me, I just change it. 🙂
Replying more to Ray’s post. I (re) second that. I think the color schemes on Woo are very nicely balanced and work really well for many types of blogs, but I usually like much less color, especially in the header. Perhaps because I’m a photographer and a designer and usually see things as being a frame or back drop to the photographs AND I really want my logo’s to be against a light color (usually). I love Fresh News “whitey” style. It reminds me of 100% rag museum board we use to matt photo’s. The soft shading, quiet elegance. I love it!
I really love Busy Bee as well and think it looks so lovely for the sites I’ve seen in the showcase, but I’ve struggled with it for my own content. I’m probably going to end up stripping it to it’s petticoats. 😉 So I’ll say, keep on with the great, balanced color themes, but would love it as well if you offered minimalist versions. They are still a cut above other minimalist styles as the “bones” of the theme and the detailing are so lovely.
Yup, just to add to what Leslie has said…
I also very much agree with the philosophy of stripping the design and colour elements of a theme, if it’s going to be used to display photography or graphics, as they already provide enough colour and this works as a non-distracting background to draw eyes in to what matters.
It’s the same philosophy of mounting printed graphics or photography work on white boards (or occasionally black depending on the content), the preferred choice for displays – never ever multi-colourd boards! Smashing Magazine uses this philosophy to great effect and success on their site which is really quite minimal in a ‘web 2.0′ style if you catch my drift.
I love the Woo themes designs and in particular Magnuses’, I’ve been looking for a business theme with a full width fat footer, like Coffee Break footer for a while now. Various themes just need a minimal white option whilst maintaining the cutting edge web 2.0 look, and I’ll buy!
Thanks for the feedback.
I’ll add a minimal style tomorrow along with some that have light header.
Hi, I haven’t purchased yet but if there a way to make the slider automatically switch from one item to the next after a set interval like 5 seconds or something?
Thanks!
Not currently, but I see it is possible in the newest version of the slider, so it shouldn’t be a big issue to upgrade the theme with it. I’ll see what I can do on Monday.
Great thanks for the reply. If I buy it over the weekend am I eligible to receive the update if I dont have the club subscription? If you do update it please reply again as I am subscribed to this.
Thanks again!
Yes, your are eligible to receive updates if you purchase the theme or a subscription. Will update here if I find a solution for it, but might have to wait for Foxinni to come back from holiday, since he is the jQuery master.
Hey Magnus, just wondering if you were able to check if the home page slider can auto scroll with a set interval? I bought the theme and am trying to finish up my customisations. Many thanks.
Please use the support forum for questions like these! 🙂
I can’t I’m not a customer, yet. 🙁
Seems like the same kinds of questions everyone else had above, and were answered.
Sharon – Feel free to drop us a mail on info[at]woocommerce.com and we’ll answer any question you may have! 🙂
Sorry, just noticed the post on the forums which I think will fix this, will give it a try 😀
Hi,
I love this theme and this might have been the tipping point to persuade me to purchase a WooTheme or subscription for a new translation website I’m planning.
A couple of questions:
1) Can the jQuery slider be swapped for a tabbed option simular to the Station theme?
2) I love the corporate colours, – clean fresh corporate themes is what Magnus excells in and I hope he doesn’t keel over to persuasions to do yet more silly ‘funky’ ‘trendy’ themes for spotty bloggers; there’s plenty of them on the web and Woo already.
Could a version of this be made with corporate blues and greys (as already exists), but also with a touch of orange? (the standard and good for corporate translation websites).
3) Also, I would like to add a ‘Free Quote’ page. This will probably be done by changing the ‘Take a Tour’ button on the jQuery slider.
Could I somehow easily attach a contact form to this theme that not only that asks for the visitors name and business etc, but also lets them upload a file to the contact form? (this is essential for ‘Free Quote’ forms on translation sites, as they can upload the documents so word-counts can be made for providing accurate quotes.
Many thanks,
Ray
… Oh yes, and lastly:
4) Is there a reason there is no RSS logo and link?
It’s on the Blog page. The other pages are static pages, yes?
Leslie, Yes correct, it is a static site but I thought it would be nice for visitors to be able to access the RRS feed from the front page – just as other static business sites. To take two from Woo as an example, Suit and Tie which has an RRS logo within the widget which pulls the latest news articles on the front page. Also, The Station has one in the header as-well as within the widget bellow that pulls the latest articles.
This theme has a latest news widget but no RSS feed within that, I guess it would be quite simple to one myself at the end of the day.
It’s interesting. I was just reading an article on copyblogger about landing pages. The author was saying it’s best to have nothing on the landing page that would distract the person. No comments, no widgets. I don’t remember if that included RSS, but they said go so far as to have a static html landing page if you need to.
I had the impression one wanted people to jump straight to the blog, but maybe that’s if the blog IS what you are selling, not a product? The site they were doing a “makeover” for was a product site. Any thoughts?
Woo team, I haven’t really checked into this, do all the themes have an option to have the landing page be a static page ?
I don’t see any reason for having a subscribe to the blog on the landing page, for various reasons, but mostly because you don’t usually subscribe to a blog before you are reading it. But you can always add one to the widget section.
Hey Ray,
1) Unfortunately no
2) The colors are easily tweaked to your liking by changing a couple of images and some CSS
3) Adding a quote page is probably as easy as adding a WP page? The buttons on the demo are just an excample and you can have them say what you want.
You’ll have to search for a suitable plugin for your contact form at http://www.wordpress.org/extend/plugins
Just got back from vacation to see this new great theme… outstanding work! I can’t wait to see how this one gets changed up in the showcase!
Sorry for the double-post…just found this thread. Are there any more of those fabulous little coffee break icons (life preserver, graph, people’s heads) available anywhere? I’d love to use some different ones for other topics…not sure if there are from a set or are all custom to this design.
Great theme!
Thanks in advance!
-David V.
All the icons are made by http://www.wefunction.com and can be purchased here: http://graphicriver.net/item/function-premium-icon-set/29644
I’ve added 6 new styles to the theme now, to satisfy those that want a lighter header: http://woocommerce.com/demo/?t=42
That brings it up to 17 alternative color styles, which should be enough show the possibilities with this theme. As always, we expect you to customize the colors to suit your site 🙂
There is also a minimalist style that doesn’t use any background images for the top or slider section, so you can easily modify it in the CSS to suit your needs.
Awesome! Wow, is this just too cool. We talk. Woo listens and delivers. Pronto.
Glad you like the new ones Leslie, and thanks for your input!
The new variations are simply amazing! Now I’m having trouble choosing over the Minimalist, Ice and Ice-Blue for my new site.
This is possibly Woo’s best theme so far IMO (Magnus’ others and Gazette in close second), so simple yet so effective. One for the aficionados!
Hi Magnus,
Great job on the theme. Would you be able to update the theme to use the new autoStart feature?
Thanks,
David
This would be possible. Post the request in our support forum and we’ll be able to follow up from there! 🙂
Hey there!
Great new theme. I have been stalking Woo Themes for months trying to decide which was best for me. I love this one. But a couple questions that I didn’t see above.
Are there integrated ad spaces? I need square ad spaces for the blog pages. Do they come with all Woo Themes so it’s not mentioned or is that not an option?
And how about giving purple a little love??
Thanks!
Hey Sharon,
There is only a 300x250px sidebar widget in this theme. I’ll see if I can add purple later in the week 🙂
Cheers Magnus!
It’s funny. At first I thought this theme was quite ordinary and dull. Yet after really studying it for a while it was a perfect fit for my latest job and has turned out brilliantly (with some excellent support tweaks).
It’s always the quiet ones ! 🙂
It’s like music… the good albums are the ones you have to listen to a few times 🙂
Or maybe it’s like good typography. They say if you are reading a book, the typography is good when you DON’T notice it. For me, a well-designed blog is a support for my content, not there to compete with it. Good design, good functionality may not have obvious, disco-light bells and whistles, but it lets YOU shine. That’s my euro 2 cents! 🙂
Love the theme!
One issue – When I first load my site, the 1st slide in the slider has a smaller bottom border that increases when you advance to the next slide. Then when you navigate thru the entire deck it is ok. This just appears when it is first loaded. Any answer?
Jeffrey
http://restaurantwebsitespro.com
Love the theme, just wondering before I look into purchasing, would it be possible to run the theme as just a standard blog? So the blog posts feature on the frontpage, rather than the slider etc
Hope that makes sense, thanks in advance!
John
Hello,
Yes, It’s possible with a bit of tweaking of the template files.
Sure, you’ll need to modify the template files slightly, but we can assist with that in our support forum. 🙂
I am considering buying this (great-looking) theme, but I have one major question:
I have several products, each of which would require a “Take a tour/Buy now” type of a page. Does this theme allow only one page like that? Magnus, your description said that this is a homepage design – can I have more than one homepage?
Ideally, I would want the button bar on top to have buttons for “Product 1″/Product 2/ Product 3, and I’d like each of those to link to products'”homepages” (slider + mini-featured area).
I would want only one blog and about page across all products, though, so having multiple instances of WP just to have multiple homepages would not work for me.
Oleg – This is entirely possible, but would require significant and extensive tweaks to the template files. We have some Affiliated Woo Workers available who could help you out in this regard too, but the theme definitely does not support this out-of-box.
Thanks, Adii! That sounds like quite a lot of work.
Thinking of alternative approaches, could I make the buttons on the top navigation bar to link to pages outside of WP? That could solve my problem.
Sure, that’s much easier. You’d need to include their code in there manually, but this is a much easier task of course and we’d be able to help you with that in the support forums.
I suggest you could have at least replied to Oleg if it is possible or not?
If you go back to her question, it asks specifically yes or no: “Does this theme allow only one page like that?”
Or should she just buy the theme for $70, and keep her fingers crossed to find out on the forum?
Please note that my response below wasn’t directed to Oleg’s question, but instead a little miss-placed due to a bug in WP’s comment threading… 🙂