Those Darn Widgets
Posted on | August 27, 2008 |
A lot of people have been downloading my Elements of SEO theme lately and I am very excited about all of the kind remarks I’ve been getting.
It has also come to my attention that when people are using various widgets in the theme the sidebars tend to get a little messed up. There appears to be two main problems that I’ll try and describe, just in case you run across the same problem.
- As soon as widgets are activated through the dashboard, IE6 and IE7 give a little extra spacing/padding to the heading of that particular section. The heading ends up pushed to the right about 15 pixels and doesn’t line up with the rest of the list below it. It’s nothing major, but it certainly doesn’t look right and I don’t blame anyone for wanting it fixed.
- As soon as widgets are activated both of the sidebars wrap underneath the main content area. Whenever anything wraps its usually because something is too big for the section. Once again the extra padding was making the lists too big for the sections.
It’s always hard to diagnose and fix problems when you can’t replicate the problem yourself. After a few hours of testing I was finally able to see the same problems that others were.
I uploaded Elements of SEO version 1.3 that fix both of these problems. Once again I am super excited that people care enough about my theme to contact me about the problem when they could easily download and use any of the thousand of other themes available.
Thank you everyone for all of your support and patience.
Comments
34 Responses to “Those Darn Widgets”
Leave a Reply
August 27th, 2008 @ 10:23 pm
Just wondering … Is there anything especially search engine optimized about this theme that would merit its title, “Elements of SEO”? I don’t remember seeing a rationale given about its search-engine-optimization elements.
August 29th, 2008 @ 2:08 am
I found a simple solution to the sidebar widget bullet problem: Since sidebar widgets are in <li>, it makes sense to have an <ul> around them (as you do now, but your theme default sidebars don’t have <li> around their items and thus don’t validate anymore).
So the easiest solution makes it not even necessary to have the <ul> that you now added have a class or id - since they’re identified by being inside #l_sidebar and #r_sidebar. So, drop these lines from the CSS…
#l_sidebar li {list-style: none; }
#r_sidebar li {list-style: none; }
…and change these two lines…
#l_sidebar ul li {
#r_sidebar ul li {
…to this:
#l_sidebar ul li ul li {
#r_sidebar ul li ul li {
Voilà, everything works
September 8th, 2008 @ 6:26 pm
Hi,
Love the theme as I am using it on my blog, and thanks for fixing the sidebar wrapping issue. I have however found another small problem (which took me ages to figure out).
If I set Wordpress such that “Users must be registered and logged in to comment” then for some reason the sidebars will both wrap under the main content area. If I set it so that you don’t have to be logged in to comment it works fine.
Otherwise the theme works great for me and hopefully you can track the problem easily and provide a quick fix
Cheers,
Stefan
September 8th, 2008 @ 8:54 pm
@Stefan
I see what you mean about turning on/off comments.
Thats a new one for me so let me take a look at it.
September 9th, 2008 @ 3:16 pm
Hi Drew,
Another quick note…
I added a few images into a post with widths of 450px and I discovered that in IE6 this breaks the sidebars too.
From what I can tell it is the CSS in ‘#content p img’ that is causing the content column to get bumped out:
margin-right: 15px;
I commented it out and it didn’t seem to have a detrimental effect in any of the other browsers that I tested with (FF3, IE7, Opera 9.26) and it fixed the IE6 issue I was seeing.
Thought you might want to know in case others were having the problem and you could roll it into the next release - if it proves to be a suitable fix that is
Cheers,
Stefan
September 14th, 2008 @ 4:31 am
Hey Drew,
love your theme, really easy to modify but I have one thing that I can’t do.
I want to disply the single posts without the sidebars but i notice you didn’t use the single.php for the single posts to be displayed on. How can I do this?
September 15th, 2008 @ 11:01 am
@Sheps
Since I didn’t use the single.php I’m not 100% sure if there’s an easy way to do it.
What I would do is download another theme that uses the single.php file and see how they did it.
I imagine its the same file as either the home.php or index.php but without the:
< ?php include(TEMPLATEPATH."/name-of-sidebar.php");?>
The php include tells it to pull in the sidebars, so obviously if you didn’t want the sidebars then you wouldn’t include that code.
Hope that helps
September 21st, 2008 @ 3:30 am
Hi, I found your blog on this new directory of WordPress Blogs at blackhatbootcamp.com/listofwordpressblogs. I dont know how your blog came up, must have been a typo, i duno. Anyways, I just clicked it and here I am. Your blog looks good. Have a nice day. James.
September 24th, 2008 @ 10:52 pm
Hi I have a problem when adding a text box for my chitika ad. When I implement it, everything in the right sidebar disappears the rss, the search box and then there is no ad. I don’t know enough about php to add it into the template itself. I love the theme and it was super easy to make every other change I wanted but the sidebars get me :S
September 25th, 2008 @ 7:49 am
@ Sarah
When you add in the ad…where and how are you adding it? You said you don’t know enough about php to add it into the template, so i’m curious how you added it.
Do both sidebars disappear? or just the far right one?
Double check to make sure that the right columns don’t wrap down underneath all of your content when you add in your ad. Check the very bottom of the page.
If they do wrap then it is most likely a width problem on your ad. The ad is too wide for the sidebar area.
If you send me a link I can look into it more if you’d like.
September 26th, 2008 @ 4:22 am
I was trying to add the ad in a text box as it is html and this is what has worked on other blogs I own. When adding any widgets it makes the contents of the sidebars disappear but the lines stay there, it isn’t an issue with the width of the ads as I am hosting 120 wide ads. I have solved the issue by moving the search box and rss feed button code to the left sidebar and deleting the rest as I don’t need it. I am now using the right sidebar for widgets that I wish to add like ads and tag clouds etc. Now there isn’t really an issue, I just did some re-arranging to suit my tastes.
Cheers for the simple theme, it suited exactly what I was after in terms of looks with a banner replacement and re-colourizing. It is so hard to find something that is simple and doesn’t take the attention away from the words in the blog.
September 27th, 2008 @ 4:54 pm
Drew, I just completely used your new theme after upgrading and it is still causing issues with wrapping when you have more than one “read more” on any given blog page.
Please take a look at this and see what you can do.
September 30th, 2008 @ 10:45 am
Hi Drew. Thanks for providing a great theme for Wordpress!
Am I right that it is supposed to be possible to leave comments on ‘pages’ now? I’m very new to blogging and Wordpress.
Thanks, Tim
October 2nd, 2008 @ 8:09 am
@ Tim
Right now the theme is not configured to show comments on pages but it is an easy fix.
Check out this post:
http://www.alibiproductions.com/2008/07/30/elements-of-seo-update/
Read comment # 17.
That should get you what you need.
October 2nd, 2008 @ 8:58 am
@ George R.
The read more link should just be a regular
tag…like the rest of the content on a post.
I noticed that you didn’t have any “read more” tags right now.
You might want to add one in and then take a look at the source to see if their is anything fishy.
October 2nd, 2008 @ 4:25 pm
Drew, that works really well, thanks very much indeed.
October 4th, 2008 @ 11:23 am
I love the simplicity of your theme and hope to use it on my new site. I’ve a little problem though and wondering if you can help. I’m trying to add a horizontal menu in the header file (to display in the white space between the banner and the content). As a result the alignment of the content is now out of whack. The whole content area has shifted right and the right sidebar has been pushed down. How can I fix this?
By the way, is there any possibility of including a single.php in future updates?
October 4th, 2008 @ 3:07 pm
If I set Wordpress such that “Users must be registered and logged in to comment” then for some reason the sidebars will both wrap under the main content area.
in the file “comments.php” is missing one at this place:
… Leave a Reply
You must be <a href=”../stauffer//wp-login.php?redirect_to=”>logged in to post a comment.
…
set after the and the sidebars will stay at their correct place.
(sorry for my bad english!)
October 4th, 2008 @ 3:10 pm
and shit, the code will not edit correct. one end-div ist missing after the end-p there. the login-ref is although wrong and …staufer must delete.
October 6th, 2008 @ 8:46 pm
Hi Drew,
I am in the process of customizing this template for my blog, Can you tell me is it possible to change the header image?
Thanks
George
October 10th, 2008 @ 11:43 pm
@george
I just replaced the banner.jpg images in the theme’s image folder. I’ve used the theme now twice, with the banners’ containing the title to save the room at the top. Nothing by compliments thus far, though one is having the commenting issue.
October 16th, 2008 @ 4:49 am
Superb theme I really like it. Any ideas why when I click on ‘No Comments’ it takes me to the page but there is nothing allowing comments to be input?
Thanks
October 16th, 2008 @ 5:29 am
Drew
I am getting the same error as George R. where read hor is break the page and pushing the sidebars below the posts. Did you have a fix?
October 16th, 2008 @ 10:45 am
Sorry i had messed with the index.php page so reverted to the original file and it now works - sorry!
http://www.earthbeauty.co.uk
October 17th, 2008 @ 3:53 am
First off, awesome theme. I realy like the design.
I found an error on the blog post page. My blog is set to only allow logged in users to comment. In doing so, I’ve discovered that the comments.php is breaking the page layout because the closing div tag for div#commentblock is missing.
To fix, move the closing tag from line 106 and move it below the last endif in the code. That should fix the breakage.
November 2nd, 2008 @ 12:13 am
Hi Drew:
Great theme! Congratulations. However, I have a few issues:
1. How to have the “read more” feature on ALL posts on the home page. In other words, I want to restrict the posts to, say, 250 words and then have the “read more” (text and) link (to the url that carries the entire post) at the end of those 250 words. How to do it?
2. If I put “recent posts” on right sidebar, the vertical spacing (between two lines of the list) becomes more than what the left sidebar has. How to fix it?
3. Are there and Firefox and IE7 compatibility issues in the theme? Because an image on my left sidebar is visible in FF but not in IE? How to fix it?
Thanks in advance and again congratulating you for a lovely, lovely theme.
Best,
Anshuman
November 3rd, 2008 @ 4:19 pm
@Garrick
A lot of people have asked me about that problem and I haven’t had the time to look into it.
Did adding in the closing div tag solve the problem?
November 3rd, 2008 @ 4:27 pm
@Anshuman Rawat
1. Not sure about setting the post to automatically add the read more once you get to 250 words. Sounds more like a plugin you might have to search for.
2. The read more has a special style to it so if you want to add it to the right sidebar and the spacing is giving you problems then you’ll have to write an additional CSS style for the read more that goes on the right side to give you the specific spacing you want.
3. There shouldn’t be any problems between IE7 and Firefox. If your not seeing something I would double check to make sure all of your tags are closed properly. If you still can’t get it then send me a link.
Hope that helps
November 9th, 2008 @ 12:35 am
Hi Drew, I just got all the kinks worked out to get Wordpress up in the first place (I’m a newbie). I like your theme for my business purposes with its clean look. But one thing I do not know when I look at themes that scroll way way way down (at least on the demo) - is whether they can be “normal” pages that each has its own subject (like business services, contact info, about us, etc. etc. Is the length of each page simply a matter of how much I choose to put into each page? Do you understand what I mean? I guess I want mine to look less like a blog and more like a small business site. Thanks very much…
November 9th, 2008 @ 9:58 am
Hi Drew,
thx alot for that awesome theme! One question: Is there a way to implement an archive-page like you did with “about” and “contact”?
Cheers,
anatol
November 9th, 2008 @ 6:29 pm
Hi again, Drew, never mind on my post earlier today. I waded through more of the Wordpress information and learned about “pages,” and also this html - - that breaks pages. I hope I am correct in supposing that many templates allow for the user to add several pages? Maybe someone could comment on that if they cruise by these comments. But anyway, I am slowly progressing through loads of information, and maybe someday my questions will be more sophisticated!
Thanks again.
November 10th, 2008 @ 8:47 am
@Esme
Pages are exactly what your looking to implement. You’ll notice as soon as you log into your dashboard that you can either choose to “write a new post” or “write a new page”. You want to add pages.
Pages will show up where the about, and contact are in my theme…top right.
@anatol
Pages are what your looking for too. Look for “write a new page” in the orange bar as soon as you log into your dashboard.
November 13th, 2008 @ 8:49 pm
Hi Drew,
Thanks for an excellent theme, I am in the process of configuring it, I want to hide the image on top from my ‘About’ and ‘Contact’ page how to do this?
Thanks
November 16th, 2008 @ 8:18 pm
Hi Drew,
I resolved the above problem, now I am facing a different problem. In single page view if I click category list in bottom of the post the post stucture getting distorted.Any clue to solve this?