Posted at 13-05-2008 @ 13:17 by ..::DeUCeD::..
You know how things are, you wake up one morning and you feel like you ‘ve been assigned a mission! I was lucky cause I was given two choices, first was to save the planet but I thought this is already done. So I ‘ve chosen to make a theme with lots of screws! That’s how Screwdriver theme begun.
And this is a page for Screwdriver where I ‘ll post new releases, fix bugs and make anything to keep those screws tight! Feel free to comment about Screwdriver theme or visit the Forums if you want more extended answers about customization.
Enjoy!
SCREWDRIVER 1.7
DOWNLOAD
from WordPress repository
theme for WordPress 2.7.X
Demo: ScrewDriver’s PageSCREWDRIVER WB 1.0
DOWNLOAD
from this site
static html template
Demo: Static Page LinkLast Update @ 12 March 2009
I always hear people saying that they need web 2.0 templates that don’t look like a blog, need a third column etc. Well, Screwdriver proudly looks like a blog! It’s a rather dark and dirty metal design which i prefer (as an old hard rock biker)!
As you can see there are two releases, a widget ready theme for Wordpress and a html template for anyone wanna built a static website full of screws! Screwdriver theme for Wordpress and Screwdriver WB are validated XHTML 1.0 Transitional with CSS level 2.1 and you can check it by clicking the buttons at the top left sidebar box!
- Important Notes
Screwdriver template has a main “disadvantage”, it uses PNG images as a background, which have transparency. IE 7, Firefox, Opera and Safari show the shadows BUT NOT IE 6 which cannot read them correct and it’s replacing the shadows with an ugly color. There are a couple of solutions but either doesn’t work for repeated backgrounds or work but destroy any links over them. That’s why I chose to have a small separate CSS file, which IE 6 reads and replace the PNG’s with GIF’s without the nice shadow effect that background images have. At first I thought that was a pitty but then I though “Hey, we cannot always have IE 6 in mind! enough is enough!”, so I gave IE 6 some GIF’s to make the website readable and that’s all! Here some screenshots for IE6 and other browsers to compare.
Internet Explorer 6
Internet Explorer 7, Firefox, Opera, Safari
One important thing to have in mind is that Screwdriver theme for Wordpress requires WP-PageNavi plugin to fill the bottom bar after the main content. It has it’s own CSS file inside Screwdriver’s folder already adjusted to match Screwdriver’s colors. DO NOT FORGET to install it!
- Usage – Customization
- Post area is 460px wide and images max-width is 440px. You can also assign the class=”image” in your image code which makes a 10px white space with a border around the photo but that’s gonna make you limit the max width to 440px so you choose (like the screenshots above).
- You can now use the new WP 2.6.X caption which also makes a 10px white space around the image and above it the description you want.
- Each widget/box is 200px wide. Putting small pics or ads is great but I advise you to limit the max width to 180px to leave a space around them (as i do).
- There ‘s also a small search bar if you choose to enable the default search widget.
- How about changing the background? I have a second image for testing. Open style.css, find the line: background: #333333 url(‘images/iron.jpg’); and change iron.jpg to wood.jpg and then check your site with a wooden background. Not a very clear image but you will notice the difference. Find one of your own, upload it to images folder and just change the name in style.css!
- There is also space on the left top place in the header and there’s where you are gonna put your LOGO image. Make an image about 220px X 80px (transparent GIF would be great) and upload it in your image folder. Then open header.php and replace the logo.png inside the DIV class=”logo” with the name of your own image!
- I have also include a screw.png in images folder which is used for blockquotes but you can use it use it in your posts too. Get it, rotate it and save it again with different names and use lots of screws!
- One more thing you could do is add a bar at the top of the main content like the one I have in static demo website. Open index.php and write the following code right after div id=”content”. Do the same for single.php and/or page.php if u want it there too replacing with links and text of your own.
For those that wanna dive in photoshop and make deeper changes, just ask and I will provide you the source PSD template to play with and make better screws!
- Changelog
v1.7: A fix for paged comments link
v1.6: Added PAGED comments (not threaded) and new functions for WP 2.7.X.
v1.5: Fix for WordPress repository.
v1.4: Fixes for closed comments image caption.
v1.3: Fix for native avatars WP2.6
v1.2: Security fix in searchform.
v1.1: Small bug fixed for password protected pages/posts.
v1.0: First release.
- Licence
Screwdriver is released under General Public License and that means you can use it wherever you like and the way you want for free BUT you CANNOT claim it as your own. I would also be happy if you keep the footer with a link back but that’s not necessary, do as you like.
- Credits
Credits go to Photoshopcafe which helped me design a simple screw with it’s great tutorial and to Texto which made a precious article about designing your own WordPress theme. Hey, thx guys!
06-08-2008 @ 07:14 [ID:9266]
Great Wordpress theme. One problem I have is with posts with long titles. The title gets truncated. Is there a way that the post title can wrap?
Thanks.
06-08-2008 @ 08:51 [ID:9267]
Hi Joel, this design has a limitation, it uses images for backgrounds which are fixed size so the space that a title is in is fixed so you can only move a post title a bit up to gain another line or change it’s font.
A post title has the following attributes: <h2 class=”posttitle”> POST TITLE </h2> which it gives us something like this
Screwdriver
You can go to style.css file, find the following lines and just change padding values to move the title upper and gain one extra line.
.posttitle {
margin: 10px 0 0 0px;
padding: 20px 60px 0px 20px; }
Additionally you can change h2 with h3 tag to reduce the font size in all template files that use post titles (index, single, page) like this
Screwdriver
You may also try to add a font size value @ .posttitle but these are all ideas that comes to my mind and you have to experiment yourself to find what’s best for you.
Regards.
06-08-2008 @ 19:50 [ID:9272]
Thanks. Changing the margin and padding gave me two lines which is good enough for me. Here’s the settings that worked for me.
.posttitle {
margin: 10px 0 60 0px;
padding: 10px 60px 0px 20px;
}
13-08-2008 @ 23:01 [ID:9291]
Hello, I just installed the theme but if you look @ http://www.dragons-heart.com/bladesoftaran/ the widgets are not on the left instead underneath where the posts would go…
What do I need to do to fix this problem.
Thankyou.
Max.
13-08-2008 @ 23:12 [ID:9292]
Looking at your source code the first thing i see deep down is that </body> </html> lines are above 3 other necessary divs. If you didn’t change anything to the footer file then you ‘d better RE DOWNLOAD the theme and try to overwrite the files again. The file footer.php should have </body> </html> at irs very end.
13-08-2008 @ 23:16 [ID:9293]
Hmmm ok never mind, seem to place after making a post.
Thankyou.
13-08-2008 @ 23:17 [ID:9294]
On a second thought and after clicking at this LINK, you ll see the theme working @ your site perfect. So try and write a test post. Never have test it in an empty blog and that might be the problem!
[edit] U got me a few seconds earlier!
13-08-2008 @ 23:19 [ID:9295]
Thankyou for your help
16-08-2008 @ 07:38 [ID:9301]
ik vind het mooi
25-08-2008 @ 21:38 [ID:9340]
Love your theme and am using it in production on our blog (www.bigtimerant.com)
Made a few adjustments, changed some images etc, but it is all there
Huge thanks!
Thanks!
Head Ranter
26-08-2008 @ 08:02 [ID:9341]
Nice job Head Ranter
Thx!
26-08-2008 @ 17:32 [ID:9345]
i need some help could you add me on msn , add the email above
27-08-2008 @ 07:53 [ID:9346]
I’m sorry Hugo but i do not use MSN. If you need any support please try writing a comment here or (better) use my forums. I ‘ll be glad to help you.
19-03-2009 @ 19:56 [ID:10415]
I absolutely love your screwdriver, but it really doesn’t fit my 2 current blogs, or 2 more I intend to put up soon. WHAT WOULD FIT, would be a varient using brass plates on, say, a plank (think hatch table or heavy door) background … and parchment sheets (like torn or “aged” edges on a wood background, using nails/tacks. I am sooo amateur (and busy at a real job) I doubt I can to the modifying. BUT if YOU DID, I’d sure use em!!!!!
20-03-2009 @ 08:14 [ID:10417]
Hi Russ,
First thanks for your comment about Screwdriver theme. Well, anything i do for WordPress is just a hobby, an idea gets stucked in my mind and i’m trying to make it work with WordPress.
But what you are asking for is a custom job and cannot be free. But here is what i suggest, make just an image, upload it somewhere and send me the link so i could see what exactly u have in mind. If i like it and inspire me i could try and build such a theme. This is not a promise but only a suggestion.
Regards
12-04-2009 @ 00:41 [ID:10470]
HI i´m experiment various themes and screwdriver as well, but i have 20 posts, but when it cames to the end of the page, don´t apeear to switch the page, the number of pages like you have here in your site:
page 1,2,3 etc
what i´m doing wrong?
thank´s
12-04-2009 @ 15:31 [ID:10471]
Hey bruno,
get WordPress 2.7.1 (latest Screwdriver theme too), install it, then go to Settings-> Discussion Settings and check “Break page after X comments”. Put the number of comments you want and it should work.
12-04-2009 @ 15:56 [ID:10472]
hi deuce first of all congratiolations for your theme, is awsome. I´m Portuguese and my english is not very good so i try to explain, i´m not talking about comments, i´m talking about the main page, i have about 20 posts and 7 per page, and when it cames to the end of the page i wan´t to click “next page”, “older entries”,”page 2″ etc to show the next 7 posts, but nothing appear.
In your´s mainpage of this site when you end the page, you have “page 2,3,4…etc, but not with me.
Your theme(Screwdriver) is my favourite and i would very happy if i could put to turn the pages…
Any suggestion?
Thank´s
12-04-2009 @ 19:22 [ID:10473]
OK! Go and grab pagenavi plugin. That’s what you want. Activate it and set it up.
12-04-2009 @ 20:07 [ID:10474]
Thank´s very much, it work´s.
Continue the excelent work, now i´m going to learn ao to personalize the rest…
Great Theme