ThemeLab's Blog

Stay up to date with our newest WordPress themes, WordPress plugins, WordPress tutorials, and other announcements.

Tasty Showcase – Free WordPress Theme

Last Updated on by

Finally, presenting the winner of theme battle #3. Tasty Showcase was a template designed by Brad of DemusDesign, who also coded it in XHTML/CSS/JS. I then took the coded template and ported it to WordPress. It has a ton of widgetized areas, including widgetized footers (plural).

Tasty Showcase screenshot

Download

Read on to see the features, including how to use the slider, in more detail…

The Slider

Displayed on the homepage, this Karmic Flow powered slider will display your four latest posts with a custom image should you choose.

Once you have a custom image sized 653×367 (653 pixels wide, 367 pixels high) simply input the absolute URL to the image in the built-in custom write panel.

Tasty Showcase Post Settings

If you don’t have an image, the theme will automatically use one of the placeholder images (depending on which slot it is) if you don’t specify one yourself. That means even if you don’t have any images, there will still be a different picture for each one.

Widgetized Areas

This theme is chock-full of widgetized areas, 14 to be exact. Here’s where they are, and what they do:

  • Sidebar – Four areas, one full width above, two half widths, and one full width below
  • Footer – Five areas, one for each column
  • Home Footer – Four areas, one for each column
  • 404 Template – One area, so you can customize your 404 pages

Keep in mind the “Home Footer” areas are only used on the homepage (where the slider is). The rest of the footer widget areas are controlled through the “Footer” ones, and affect every other page on the site besides the homepage.

Tasty Showcase Widgets

The above diagram shows all the “Sidebar” and “Footer” widget areas. Not pictured are the “Home Footer” areas (basically the same place as the regular footer, except on the homepage) and the 404 template widget areas.

Conclusion

I bet you all forgot about theme battles, didn’t you? I know it was a few months between the conclusion of the voting and the release of the winning theme (this one) but better late than never.

Brad from DemusDesign was kind enough to code this one into XHTML/CSS and integrated the Javascript for the slider even though I usually code the winning theme battle themes myself. This time I just did the WordPress portion. You can get the static (non-WordPress) version on his site.

I’d also like to thank Cristian Antohe of Cozmos Labs for spotting a bug on the theme via Twitter. Also a special thanks to Omar Corrales of Slimmity who tested the theme himself and provided some good feedback, including several bug fixes before the release.

Anyway, since the time RS16 was released, I got the forums back online (with a matching bbPress theme) so if you have any support questions, they go there.

Let me know what you think of the theme in the comments, I’d really love to hear your feedback.

  • http://jaypeeonline.net Jaypee

    Great looking theme Leland! Good job porting it to WordPress. I’ll do a review of this theme as soon as I can. :D

    • Leland

      Thanks Jaypee, that would be greatly appreciated!

    • http://jaypeeonline.net Jaypee

      You’re welcome! Btw, I just published my review of this theme. :D

      WP Theme Review: Tasty Showcase

  • http://slimmity.com Omar

    Thanks for the shout out! And seriously the theme looks amazing! So many widget areas, imagine all the things you can do with them :O

    • Leland

      No problem Omar. Thanks again for your time in testing the theme.

  • http://demusdesign.com Brad

    Hey Leland, it looks awesome. 3 small things I did notice.

    1. The slider controls are all in their “hover” state until the first slide transition. Seen in Chrome and FF. Probably a PHP JS interaction. No idea how to fix.

    2. I forgot to style the h1 a so it stays wait in the slider descriptions instead of green.

    3. Not sure if it’s possible, but can you make “include the slider on every page” a theme option.

    Again, awesome work!

    • Leland

      Hey Brad, thanks again for the cool template. About your points:

      1) Not sure how that happened either, I’ll probably have to retrace my steps to figure that one out.

      2) I was wondering about that, wouldn’t be too hard to do with the following code? .karmic_flow_slides .info h1 a { color: #fff; text-decoration: none; }

      3) About the slider on every page, I tried a few times to integrate that on single pages but for some reason the_content_limit() code I was using spewed out the full content on single page, so I opted to remove that feature from the final version for now.

  • http://ramblingsoul.com/ Roshan

    Congrats Brad & Leland. this one rocks!

    • Leland

      Thanks Roshan, glad you like it. I’m thinking one of your free templates will be next. Need to catch up on those, lol. :D

  • http://blog.il33t.com Ben

    Hey awesome theme. Exactly what I’ve been looking for to spice up a small business I work for. Just wondering if perhaps there was a way to change the sliders to represent static pages vs a blogroll? I’m a novice when it comes to php, but maybe you could point me in the right direction?

    Thanks again for this awesome free theme!

    • Leland

      It might be possible to put static pages in the slider. I’d recommend reading this: http://codex.wordpress.org/Template_Tags/query_posts

      Not sure about putting a blogroll in the slider, it would probably have to be hardcoded.

      • http://blog.il33t.com Ben

        Wow, thank you so much for the fast response. I actually didn’t mean blogroll, but postroll – the slider takes the most recent posts and uses them… anyway, your link is very helpful and it looks like I can use the ‘page_id=’ parameter.
        Thanks again!

      • http://blog.il33t.com Ben

        Dunno if anyone else wanted this info – but I changed the query from:
        $the_query = new WP_Query(‘showposts=4&p=’ . $sticky[0]);
        to:
        $the_query = new WP_Query(‘post_type=page&meta_key=hslide&meta_value=1′);
        Adding a custom field to each page I wanted to display, using hslide as the name and 1 / 0 as values. The reason I included the meta_value in the query is in case I want to switch pages around, I can just change their hslide value. This works well for getting pages in the slider – now I’ve gotta figure out how to sort them. Maybe another custom field?

        • Leland

          Nice idea, thanks for the follow up. This is probably somewhat resource intensive, but maybe try a custom field for the page order (i.e. 1, 2, 3, 4) and show each one in a separate query?

          Would be kind of a pain to change the order but not sure pages were “meant” to be output like this through a query, so that’s the only way I can think of.

          I’d recommend using a caching plugin like WP Super Cache or W3 Total Cache on top of this.

  • http://urbanorleans.com Dyce

    Really Great Theme…

    I’ve been trying different codes to make the_content_limit function ignore images (they don’t show up, but the push the text down and out of sight). I was able to do it in the slides, but I am not have the same luck with the controller.

    Here’s my site: http://urbanorleans.com

    Any ideas?

    • Leland

      Nice customization, strange that it would work for the slides but not the controller (since it uses the same function).

      I think it’s supposed to strip any tags so it seems odd that any img tags would be included in the character limit.

      Can you let us know how you were able to ignore images in the slider part?

  • http://urbanorleans.com Dyce

    Think i found a way to do it. Thanx.

  • http://urbanorleans.com Dyce

    I ended up using a plugin called “Advanced Excerpt” in both the slider and controller. Worked like a charm.

    http://wordpress.org/extend/plugins/advanced-excerpt/

  • http://urbanorleans.com Dyce

    Also, do you know how i can limit the # of featured post? Right now, if I create a 5th feature, the controller extends past its container to show 5 posts.

    • Leland

      The query only is supposed to show 4 posts maximum. Does it not say showposts=4 somewhere in the queries?

      • http://urbanorleans.com Dyce

        No. This is what i have:

        “have_posts()) : $the_query->the_post(); ?>”

        • http://urbanorleans.com Dyce

          Sorry, can’t get it to show the whole string.

  • http://urbanorleans.com Dyce

    No, this is what i have:

    have_posts()) : $the_query->the_post(); ?>

    • Leland

      In the original slider.php file, before that is a mention of showposts=4, which prevents more than 4 posts being shown.

      Not sure what the problem could be if that’s still there in your slider.php.

      Edit: Okay now I see what you’re trying to do…

      This is a bug that I’m aware of, it’s the reason why I didn’t put the slider on any other page except the homepage. Mentioned it in this comment.

      It has to do with multiple loops conflicting on the page, when I figure this one out I’ll let you know.

      • http://urbanorleans.com Dyce

        Nope, i don’t have it. I’ll check the original file. Thanks.

      • http://urbanorleans.com Dyce

        Oh Ok. Cool.

  • http://urbanorleans.com Dyce

    OK, last thing (for a while). The .post div is really tall on my post pages no matter how little content is inside, and I’m not sure why. I can’t find anything in the css causing this. It’s only a big deal because my share link end up at the bottom of the div and users have to scroll pretty far to see them or to leave a comment.

    Here’s an example: http://www.urbanorleans.com/site/?p=367

    • Leland

      Hmm…interesting that it shows up directly below where the sidebar ends. Must have something to do with a CSS clear.

      • http://urbanorleans.com Dyce

        Makes sense, but I just checked all of the files and no “clear” anywhere…I’m stumped :(

  • Matt

    I like this template and built my site around it. Everything has been fully functional and customizable which I greatly appreciate!

    Although along came f ‘ing Internet Exploder 8 and the java script image scrolling stopped working, any ideas why?

    It functions just fine in IE6, IE7, FF(mac/pc), Safari(mac/pc), but not IE8… I’ve been searching but cannot find an answer, maybe you have a fix??

    Thanks,
    Matt

    • Leland

      Hey Matt, sorry I’m not sure what the problem is with IE8. If I figure something out I’ll let you know.

      • Matt

        Thanks for researching, I have been for a while, but know very little about java script! I believe it might be some sort of jquery or DOM issue from what I’ve been reading about IE8 and java interactions… maybe that will help steer you in the right direction!

        Thanks again for helping and not leaving me to hang after all the work i’ve put into customizing this!!

        Talk soon and take care,
        Matt

  • http://urbanorleans.com Dyce

    I’m back.

    Any idea how I can dynamically show numbers in the controller instead of the title & description?

    • Leland

      Try asking on http://www.wpquestions.com/ …it’s probably some simple PHP, but really don’t have time to figure that one out.

      • http://urbanorleans.com Dyce

        Will do. Thanks.

  • Arjun

    Hi,
    Thanks for uploading such a wonderful theme online :)
    I tried using your theme and it was running fine until I installed a lightbox plugin for images when the KarmaSlider stopped working all of a sudden. So do you have any idea what might have gone wrong?

    Thanks,

    • Leland

      Must be some sort of conflict between the two. When you say it “stopped working” …what happened exactly? It stopped sliding?

  • http://undergopher.com 8one6

    This is a really nice theme!

  • Arjun

    The images were not sliding one after the other… But I figured out that it was due to JavaScript conflict . So I removed all the other conflicting plugins and now it is working fine :)

    • http://the-x.weebly.com/ Josh

      Cool! I don’t use wordpress yet but after seeing this theme (and of course all your others) I can’t wait to start using it!

  • matt

    Any ideas on why the slides stopped working in IE8??

  • giulia

    I love this theme but I can’t edit it… don’t know why the slides show the default photos and not my posts’ ones!
    Plus, I cannot change anything on the widget page.
    Too bad :(

    • Leland

      You have to input a URL on the “Slider Image” or it will use a default photo. It doesn’t automatically grab images from your post.

  • Rakesh

    Great Theme. Can you please tell me how to use my logo in the homepage and all other pages?

    • Leland

      Just edit the header.php file and replace the text with your image.

  • Reid Walley

    The slider doesn’t show up at all on my WordPress 3.0.1 installation: no default images, nothing. All I get is a “Not Found” message:(

  • Reid Walley

    FIXED the slider doesn’t show on my WP 3.0.1 install. Duh, my bad. I had set the Reading Settings in WP admin (Settings > Reading) to a “static page” for the Home page. Once I changed the “Front page displays” setting back to “Your latest posts” all was good:)

  • http://tigertribune.org Melodie

    I am the editor of my high school paper. We decided this year to go online, and amidst all my nightmares of running a print edition, I had to wrestle with wordpress to find a theme that fit what I, the adviser, and most of the staff were happy with. When I found this theme on your site and found that it not only worked properly, but was really user friendly, I was THRILLED. We expect to fully launch the site within the week, and I can’t wait to show off how great the site is looking. Thank you so much for providing this theme!