WordPress 3.0 came out with a beautiful new default theme called Twenty Ten. While that theme is great, it can be styled into something a lot different. That is exactly what we did with our Speaky theme. Speaky is a free WordPress child theme for Twenty Ten theme. Speaky theme is equipped with all the features of the Twenty Ten theme such as:
- WordPress 3.0 Menus
- Custom Background Option
- Header Images Option
- Featured Post Images Option
- Featured Post Slider on Home Page
- Widget Ready Sidebars
- Clean Semantic Web Markup
Before we go any further, we have to let you know that this beautiful work was the creating of Dronix (@dronixs) – Follow him on Twitter
Video Preview of Speaky Theme
You can also check out the Live Demo for Speaky Theme.
Ready to Download the theme?
Download Speaky Theme by WPBeginner
This theme is released under the GPL license to support development. If you use this theme as a base to customize other themes, do show it off in the comments below. Download
Setup Instructions
As you see in the live demo, that Speaky comes with a Featured Post Slider. This will work only if it is setup right. Which is why we will show you how to set it up properly. The slider only shows the posts from a category slug called “featured”. That means, you must have a URL Structure other than the default one. Any post that appears in that category and has a post thumbnail with a width of 940px will be shown only on the Home Page. On pages like category, and archive the default header image will be shown. On all single post pages, the post thumbnail will be shown.
The slider displays only 10 slides with the “featured image” of any recent post under the category of Featured by default. To change the category or number of slides open up header.php file and look for:
<?php speaky_slider(); //Displays a slider using the featured image ?>
It should be line 93, then add the category name and number of slides. Here’s an example using the News category with 5 slides.
<?php speaky_slider( 'news', '5'); //Displays a slider using the featured image ?>
Changelog
v1.1 * new: Archive, Category, and Search pages have been added for a minor css tweak * fix: Slider function rewritten. * fix: Using wp_enqueue_script() to also include Nivo Slider, not just JQuery. * fix: Minor css tweaks after testing of the Theme Unit Test data. v1.0.1 (Initial Release)
To install this child theme, you will need to upgrade your WordPress to the version 3.0 minimum, then simply upload this theme into your Themes folder. (For more See: How to Install a WordPress Theme)
We appreciate all of your feedback on the theme in the comments below, on our twitter, or our facebook page. If you can, please help us spread the words out about this theme to all of your friends by using our share widgets








I just redesigned my site using a Twenty Eleven child theme based on Speaky: http://optimwise.com/
@Ciotti It is not using timthumb.
Has this theme been updated to the latest version of TimThumb in order to avoid the recent exploit?
I also like how you customized the NivoSlider to pull from from the Featured Image. I’m gonna use that one.
@JP2003 One of the best Twenty Ten child themes, by far.
This looks pretty solid. I think I am going to give it a try. Thanks!
I really love this theme, it is great, the only problem I am facing is that I would like the slider to work on all the pages on my site and not only on the posts. Could you please help me to sort out the code that the slider of the header work on all pages?
I like this theme, and have used it a few times so I thought I’d mention a couple things. The slider throws an error after clicking a post in IE (i don’t know much about JS) I added this to it
wp_enqueue_script('jquery');right below //Include JQuery and NivoSlider
The other thing I did was made it show the post title instead of the image title.
Edit jquery.nivo.slider.pack.js and change captionOpacity:0.0 its at the bottom.
change the opacity in header.php to 0.0 (if you’ve added the Nivo options to it)
open functions.php and add
above (around line 24)
then in your CSS add
.nivo-caption2 p{line-height:30px;padding-left:10px;font-family:"Helvetica Neue",Arial,Helvetica,"Nimbus Sans L",sans-serif;}I’ve used alot of Speakys header code to include it into my own theme http://test.zeaks.org
Is there any way to have the slider image caption display the post title instead of the image name? I’ve played around with it for hours, but really have no idea how to do it.
Great Theme! On the slider, how might one:
1) increase the time each post thumbnail is displayed on the slider.
2) Remove the image name (and perhaps even the black bar) from the bottom of the slider image?
Thanks!
I really love this theme – I found it fast and easy to customise the CSS, which seems refreshingly clean and straightforward. But is it really a child of TwentyTen? It doesn’t import the 2010 CSS, and has so many template files that I wonder what is left of the parent in the child. Perhaps you should rename it cuckoo.
Okay. So, what if I don’t want my slider to show my posts? I have 5 images that I want shown on my pages. I don’t want to post random pictures on my blog just so they will show up on a slider – I want them on my slider without interfering with my blog.
Me Too! I’d like to know how to do that. Actually, I’d rather know how to feature pages not posts, but if I could manually set the images and their links, I could live with that.
Nice theme. A good child theme for the TwentyTen theme.
Ok demetrius try the version below.
Download Speaky
Merry X-mas & Happy NY, guys!
There’s no @ Homepage (even in demo here).
Does anybody have a solution to fix it?
Hey demetrius I’m not sure what you mean by “no @ Homepage”. Can you elaborate a little so I can help you get a solution.
Ooops, extremely sorry – html tag “TITLE” was stripped
There’s no title at Homepage even at the demo site.
Gorgeous child theme for Twenty Ten. Reminds me of Thesis visually. Thank you
Hi Dronix,
I encountered a problem:
Featured Post Slider on Home Page do not work
help me
Thanks!
The featured image needs to have a dimension of at least 940×198 pixels.
@jens: Hey sorry to hear that didn’t fix the problem. While debugging I still see that the text-transform: uppercase seems to be adding the extra margin on top. Maybe remove that property all together?
BTW, you have font-weight: bold added to the li while text-transform: uppercase to the ul, try declaring your font styles in one place. I know my fix said to try adding the text-transform property to the li elements but did you add it to: #access .menu-header li, div.menu li while removing it from #access .menu-header ul, div.menu ul?
Hi,
first and foremost: i love the theme, its really cool and handy.
one thing though, maybe someone with css knowledge can help me out. when i hover over the menu (with drop-down-submenues in theme) the hole page moves down a bit. so, when the submenues appear, everything is down a couple of pixels (10-15). why is this happening? it happens in firefox 3 on mac, but not safari.
http://kiezfieber.de
thanks for your time
greetings
jens
The cause for the extra padding/margin seems to be because of the text-transform: uppercase that you have there. Try adding that property to the li element instead of the anchor links.
hi dronix,
wow, thanks for your fast input. i tried changing the uppercase definition to the li element, but it didnt fix it.
well, mayber it’ something else, i dont know. it’s kind of annoying but i can live with it.
if anybody know how to fix this glitch, i would appreciate your help.
thank you in advance.
Anyone know if there’s an update due at any stage to fix the slider problem? I really don’t want to go digging about with the code in the jQuery library as I don’t know anything about it!
The code for the slider was rewritten for v1.1 there shouldn’t be any problem other then some styling issues with IE which Janivanda posted above.
Hi,
This is a great plugin and I am using it for my personal blog that I have just started. Just wondering if you are aware of the ‘WordPress NextGen GalleryView’ plugin. I am trying to get Speaky to work with it but I am just getting a blank page that looks like it’s loaded pictures but fails to play the slideshow.
Hey Gary mind posting a link so I can take a look? Not sure if it’s the theme’s fault but maybe your Javascript isn’t being loaded.
Thanks for replying.
I ran firebug on the page and saw ‘Nivo-Slider.php is not a function’ error. Which as you say may have been interfering with the JavaScript.
So I managed to resolve this by installing the Nivo slider plugin and it worked. As a newbie to WordPress I am still looking at my gallery options, but I shall stick with the ‘Speaky’ theme, it’s very clean.
Fickle me.
I really like the Speaky theme for my WordPress 3 website! I’m a Firefox user and everything looks fine, including the slider and featured posts etc..
But, my readers complaining about the messy layout in Internet Explorer 8.0. When using featured posts inthe slider, IE8 doesn’t show the slider images.. When not using featured posts the default header image will show up correctly..
Is there a fix for this? I’m using Speaky 1.1.
Hi-
I’ve been trying to change the size of the Nivo Slider to fit images 940×279. I can change the css and the slider frame gets bigger, but the image is getting cropped at the top and bottom. Any suggestions?
I was thinking about an option to show recent posts instead of ‘featured’. Is it possible?
Don’t understand your question. You mean have recent posts ‘featured image’ in the slider?
Hello,
I’ve installed 3 wordpress sites on 1 FTP, all with the Speaky Theme.
For two of them, it works perfectly.
The third (http://www.el-ancor.com/fiction/) has a problem.
This error occurs when I try any url :
Fatal error: Cannot redeclare _verifyactivate_widgets() (previously declared in /fiction/wp-content/themes/speaky/functions.php:205) in /fiction/wp-content/themes/twentyten/functions.php on line 506
I tried to copy/past the functions.php of the functionals sites, but it still does not work.
Do you have a clue ?
Thank you.
Quick Update:
The update won’t be released for another two weeks. I currently have a bad hard drive and it won’t be fixed until sometime next week.
Hi Dronix,
Looking forward to the fix – having the same problem with the slider not showing up.
I’m new to WP but did a bit of digging around and when comparing my source code to your demo site here I noticed that your slider function
jQuery(window).load(function() {
jQuery(‘#slider’).nivoSlider();
});
is being called BEFORE the JQuery library gets included on my site, whereas on your demo site its called After. Not sure how to modify header.php to fix this.
Cheers KB
Hi those that have the same problem that I had – this is what worked for me. I’m using WP 3.0.1 in a multisite environment.
When viewing the source of my header, the main JQuery library was being called after the Nivo Slider JS file and the the load function. (Not sure if this is because of Multisite).
Anyway I moved anything to do with the Nivo Slider javascript code and put it after wp_head(). I know it says not too but I didn’t know else to get JQuery library to load before. This fixed it for me in FF, Safari and Chrome, but IE (7&8) it wasn’t appearing.
The IE fix was a css one, in file custom-nivo-slider.css I commented out display:none; for #slider img.
hope that helps
KB
Hey Matt thanks for trying out the theme. We’re currently trying to release an update to this theme within the next week. There seems to be a bug with the slider at the moment. A fix will be included in the update.
Cheers
hi guys, looking forward to the update and great news that a fix is on the way! Thanks once again.
Great news Dronix!
I’ll be sure to try out the new one ASAP,
and I’ll provide further feedback as well.
Hi, I have installed Speaky and done all the settings but the slider won’t work. I have created a custom category and slug and updated the header.php accordingly. I have changed the permalink structure. I uploaded the thumbnail images (940×198) and they appear on the post pages, but the front page header is still static. Any guess? Thank you very much.
You have to create a category called Featured and post in it.
Hi. Thanks for the quick reply. I did as you suggested, but the main page header disappeared. The slider is not loading. Any guess? Thanks again.
Hey Jorge is this a clean install of the theme. By default the theme displays the slider with posts that are categorized as featured.
Btw, is this a live site?
Awesome theme guys, well done. I’m having similar problems to Jorge I think. I installed the theme last week and had it running with default header for a few days. Did a new post today though and make a new category for it called “featured” which has killed the home page header altogether.
I haven’t edited the header.php and haven’t done anything to the post’s slug or site’s permalinks. (they’re just: 2010/09/05/my-tiff-2010-movie-schedule/) You can see it with latest post at http://www.thewheatln2.com. Post image shows up on post page so I guess the image is correctly formatted. Apologies for not getting this, am sometimes a little clueless with things!
Thanks again.
First off,
)
this is a very nice looking child theme.
Thanks for providing it to the public like this.
I am also sharing the same problem.
I’ve created a post category named “featured”,
which also has the slug “featured”.
I’ve added one of my existing posts to the “featured” category, as well as added one of the default header images from the “Twenty Ten” theme as the “Featured Image” for the post (ensuring that it was still set to full size).
The header that I have defined in the admin appearance tab is no longer showing on my home page… let alone the slider that I was expecting.
WP v3.01
Twenty Ten v1.1
Speaky 1.0.1
Any insight you can provide is greatly appreciated.
I had trouble getting the slider to work and found that the php was calling for is_home () and that will only work for blogs not static front pages (like I was using). I swapped out is_home() for is_front_page() and it works great. Make sure to update all the references for the js and css and it will work great.
Hi, I like what you did with TwentyTen, is it possible to place a Flash Banner in place of the header image, and possibly have a different one for each page?
Also,can the header size be increased from the 940×198,specifically the height?
Thanks!
Everything you listed can be done. You just need to edit the CSS and place the right php functions to show a different flash file on each page.
I like this theme but i have some trouble when i insert a gallery columns=”2″ . There is always only 1 column ; with twenty i have 2 columns (sorry i don’t speak english very well). Also i don’t see the extract of the article. But i’m learning wordpress so it’s a good beginning, thank you.
Hey Shizuka thanks for trying out our theme. I’ve tried to replicate the error without any success. I was able to display the gallery in two columns as you can see on the following image:
http://bit.ly/dtPjTm
Is the post categorized as Gallery?
Sorry but I’ve forgetten the category Gallery !!! Now It’s ok. Thanks. But where can I change the name of the category to put it in french “galerie” ?
I’ve found !
I was looking forward to tweaking Twenty Ten myself, but you guys have made things so easier with Speaky! Thumbs up!
I’m gonna use it, but I was wondering how’d I know if there’s a newer version available for it. I couldn’t find it in the WordPress.org themes gallery. Are you guys going to let us know (via a blog post) when / if there’s a new version? I’m subscribed to WP Beginner, so that’d be really convenient.
Once again, thanks for the awesome simple theme.
Hey Ashutosh,
WordPress theme directory doesn’t accept child themes just yet which is the reason why you cannot find this in the directory. When we do upgrade the theme, it will be on the blog and on our twitter.
But the 2010 Weaver is in there. Also, I had some nasty issues with Speaky on IE – there’s a very long horizontal scrollbar (which obviously doesn’t look nice), and the aesthetic elements (shadows, rollovers, borders etc.) don’t degrade ‘gracefully’ on IE. It’s a total hodge-podge. Speaky looks great on all browsers, but obviously it’d be stupid to ignore IE (at least version 8). The parent theme doesn’t have this problem.
I get the same error as Nicholas, says it is in html/wp-content/themes/speaky/header.php on line 91
I only have 4 plugins, all up-to-date, Google Analytics for WordPress, Contact Form 7, Disqus Comment System and Really Simple CAPTCHA, have deactivated and it did not resolve.
Seems like you or your host is using and old version of php. Update to v5
I was getting it too. All I had to do was go into my .htaccess file and add, “AddType x-mapp-php5 .php” and that cleared it all up for me. Check with your server as there are a couple different commands depending on the installation on the server.
Hi,
I’m asking you because you seem to know the answer :
I did what you just said, creating a .htaccess with “AddType x-mapp-php5 .php”.
When I do it, a 500 error appears.
Do you have any idea ?
Thank you.
Yes I am using 1.1
I can’t seem to replicate this. I tried using BuddyPress, the custom links still work; could be an additional plugin interfering, although if it’s working on Twenty Ten it should work on Speaky as the header.php file is pretty much the same, wp_nav_menu() hasn’t been touched. Try disabling all the plugins and enable them on by one. Let me know if the issue persists.
The custom links that are not working are buddypress links like activity,members,groups. I have put all the folders from buddypress into speaky folder and twentyten has same folders as well and than created a custom link to each folder.
To create custom link I have /activity as url may be I need to have it differently how did you create a custom link.
@dronix Ok I finally found out why I was having problem with displaying menu the speakey theme. I renamed the header.php that you have in speakey folder and try it out and now I have all the menus displaying at bottom of header image like its on tentyten theme,so it must be header.php in speakey folder that was stopping by doing so speakey is using header.php that is twentyten folder.
That is because Speaky’s header.php ask that your server uses PHP 5.0. By replacing the header.php, you got rid of that requirement. The slider we are using requires PHP 5.
I just checked my cpanel for what version php I am using and it is
PHP version 5.2.13
I like the theme as well but having problem with menu
The theme does show custom links from the menu they show fine on twentyten theme.
Govindji Patel
If you visit the theme Demo, we added the Download link there. That is a Custom Link in work. Don’t know why you are not able to display custom links using the WordPress menus.
Thank you for reply I just download from the demo download link and still the same only shows links that are created by forming a page but the custom links do not show I am using buddypress I just wonder if that has anything to do with the links not working.
Govindji Patel
make sure you have a “Primary Navigation” menu already set
@dronix yes I have selected the menu I created as “Primary Navigation” on first box on left.This only happens on the child theme works fine on twentyten theme.
what version of Twenty Ten are you using? Latest is 1.1
Hi,
I tried this theme on my WordPress site, but the fellowing error appears :
“Parse error: syntax error, unexpected T_OBJECT_OPERATOR in header.php on line 91″
Any idea of what it is ?
Hey Nicholas,
Can you please tell us what is your site URL. We just installed this theme on another test site without any plugins activated. So it can be a plugin issue that one of the plugins you have can be causing. If you can please email us the details, we would be more than happy to take a look.
Thanks for your respond.
My website is : http://www.el-ancor.com/present/
I activate the theme so you can check the error message.
It’s a new website (one week ago). No plugin installed, just a few pages created. And it’s the last WordPress installed (v3.0.1).
I don’t know why this is happening. I’m hosted by online.net, with php5.
Very sweet theme based on Twenty Ten. I love this.
Especially the header’s featured area makes it outstanding. Thanks guys for giving it away for free.
My only problem with this, and indeed the TwentyTen theme, is that there’s no menu delay when submenus drop down. Is there any way to achieve this? Otherwise, many thanks.
You can certainly accomplish that with JS/CSS combination. We did not do that in this theme.
The download link end up in a 404
@Thomas Links are now fixed.
Love the theme, it looks clean and flexible.
The theme is amazing @dronixs has created really nice WP Theme, I am now considering to switch finally my WP setup to 3.0 with this theme =]
I have just notified you on Twitter, that the link to download the theme, is not working. Thank you very much for fixing it. Or was the download canceled?
Regards,
Jan
The download link should be http://www.wpbeginner.com/wp-content/downloads/speaky.zip right?
Yes Ryan, that is the correct download link. We have fixed the post one as well
Thanks for the quick fix, this theme forced me to switch finally to WP 3.0. Yeepiii!
Love this theme!
Thank you for the great work dronixs & wpbeginner