Oct 182009
 

Recently an issue was brought to light by one of Suffusion’s users (Colin), where the NextGEN gallery widget wrecked the layout of the rest of the theme. I took a look at the issue and found a few things.

As you are probably aware, I use Docking Boxes for some snazzy effects on the sidebar, mainly “Drag and Drop” and “Expand / collapse”. For these features, particularly the expansion and collapsing I had to separate the header (handle) from the content. For those technically inclined, to tackle this I had to define <div> tags in before_widget, before_title, after_title and after_widget elements in the widget definitions. This works well, almost. The first problem that came to light was for text widgets, where WordPress’s default implementation decides to skip the before_title and after_title if there is no title. While this generally works, if you are starting a <div> in after_title and closing it in after_widget, you have a mess. Since after_title has not been invoked you end up having an extra </div>, which results in messing up further aspects of the layout.

To fix this I overwrote the text widget with my own class, which slightly tweaks the output. However, there are other widgets out there which are not in my control. And the very popular NextGEN Gallery widgets fall in that bucket. Firstly NextGEN provides its own tags for the widget title. That is still okay, since it causes a minor inconsistency in the look and feel. The next, however is a little more tricky – if you have Web-Slices enabled for the NextGEN widget, it does some more large-scale layout changes for the widget, again destroying the layout.

The Fix

As of now the simplest fix is to disable web-slices for the NextGEN widget. The only loss of functionality you suffer is that a person who is viewing your website in IE8 cannot pick your gallery as a “slice”, but has to subscribe to your blog as a whole.

I have put in something on the support forum, but there have been no responses. Mind you, any website that uses docking boxes will suffer from this problem, and I am sure there are a few of them.

Of course, it would be best if WordPress provided something like “before_content” and “after_content”, in which case things would be much more easy.

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*