Brainstorming: What do we "need" template-wise?

[d_cee]

Hi

At first glance, the category plugin looked to be the easiest, because I saw a plugin_categories.tpl file in the default template folder. Problem is that I do not think this plugin is actually using THAT tpl.... none of my revisions are reflected in the HTML output from a copy located in my template folder. Confused

I,m pretty sure you have to set an option in the categories plugin config for it to use the .tpl file (Enable Smarty-Templates? ) then your changes will work.

I agree with YL, if we're going to make the feed icon change with the colourset we do have to change them all. IMHO I would have gone with the standard orange icon or used the grey one as we decided earlier.

cheers

Dave

[yellowled]

Hi Dave,

(I'm tempted to write 'Hello, Dave' every single time in reference to HAL )

1 - we should set all the calendar background colours to inherit
2 - we should set the theme chooser select to 90%

1 - As far as I know, at least IE <= 6 doesn't support inherit.
2 - Jeez, I haven't used that in ages. I'll dig it up and add that in the next update. Please remind me to do so if I don't

Also now I've seen it in glorious technicolour, I can see it renders differently in Safari and Firefox, In Safari there's a 10px margin to the right of the right hand sidebar in 3 col mode and 2 col sidebar on right mode.

I have zero experience with Safari ... is it possible that Safari claims to be an IE <= 6? We have an extra stylesheet (ie.css) for those which might explain the margin ...

YL

[yellowled]

Okay, first of all: Awesome job! I have just now updated http://www.yellowled.de/tmp/bulletproof.zip and http://sandbox.yellowled.de once more with that new code and some images which once more show that I really need some practice with Gimp I've set the sandbox to the blue colorset to demonstrate it.

With regards to using this for Bulletproof, I wonder if the original method of calling the default images should be preserved.

I have solved that part like this:

Code: Select all

   {if $template_option.colorset != 'default'}
   <!-- additional colorset stylesheet -->
   <link rel="stylesheet" type="text/css" href="{$serendipityHTTPPath}templates/{$template}/{$template_option.colorset}_style.css" />
   {/if}

I've used similar {if} statements for the calendar and graph bar images. That way, we can keep the standard images for default and use different ones for the colorsets. I felt that this was the safest bet - who knows, somebody might want to use the default graph bar image for a plugin or something, so I think those images should remain in place.

But here is another problem. What if someone copies bulletproof to another folder as a starting point, plays around in it for awhile, thereby setting a value for $template_option.colorset, then deletes the colorset option?

This is one example of 'Don't touch this unless you know what you're doing.'. There are others in bulletproof, i.e. editing the column widths. This may sound rude, but that's why this is not called 'fool proof' There are ways to break this, and I'm afraid there's nothing we can do about that.

Then, the final alternative - 2 bulletproofs.

After reading Garvin's statements, I'm pretty sure we're gonna have to 'fork' anyway. I suppose at some point we're gonna have to strip some stuff, i.e. the dynamic navbar, from the original bulletproof code to use it as a default template. So we could have a) the default bulletproof (let's call it 'stable'; it will - hopefully - have no performance issues at the cost of some features like colorsets, dynamic navbar etc.), and b) the advanced, full-featured bulletproof (the 'director's cut', if you like )

Okay, seems like there's two issues to resolve:
1. Anything Dave mentioned in his last post - I think we'll be able to resolve those flaws pretty quickly.
2. That #!&? feed icon.

I've taken a quick look at the sidebar plugins this morning. As far as I can see, there are three major (i.e. used by more than a few users) sidebar plugins using the xml icon: Syndicate This Blog, Categories, and Show tagged entries. I have barely skimmed the event plugins, but I don't think any of them actually display the xml icon. If anyone knows about an event plugin or another sidebar plugin to cover, shout it out!

So that's about how far I've gotten I'm gonna take a closer look at some code now, so I'll be back.

YL

[yellowled]

Ha! Gentlemen, please take a look at the sandbox and see the different feed icons for the sidebar categories.

This is so great, I would be bouncing up and down ... well, if only it was that easy for syndication and freetags. I hope Garvin's still with us, since I can't find .tpl files for either plugin. So, what are the odds of recoding those two to use .tpl files? I have no idea how complicated that would be, so don't bite me

YL

[Don Chambers]

I,m pretty sure you have to set an option in the categories plugin config for it to use the .tpl file (Enable Smarty-Templates? ) then your changes will work.

I agree with YL, if we're going to make the feed icon change with the colourset we do have to change them all. IMHO I would have gone with the standard orange icon or used the grey one as we decided earlier.

cheers

Dave

Must have been the crust in my eyes - I missed that option, and now the category icon switching works exactly like all the other swapping I am doing.

YL - I see you just posted that you have something too. I saw 2 ways to do it, either using the method I used everywhere else, or changing the value of the existing variable. Which did you use? For consistency, I suggest using the same method as everything else.

But that one is easy. I'm clueless on the freetag and syndication.

[d_cee]

Hi YL
6 years ago everybody would say "Hello Dave' to me - I was glad when it was 2002!!

I've got a client meeting in 40 mins but when I get back I'm free. I'll try and finish the red/grey colourset I'm doing and post it - or take a look now at http://dev.daves.me.uk/.

I did start another project using bulletproof but it fell apart in IE6 so I changed to my normal codebase - no time to work out why. I'll take a look at the Safari problem too later and see if I can see what's wrong.

Oh and we could always use 'transparent' instead of 'inherit' for background colour - although I can't find any problem with IE6 inherit, my Eric Meyer book say's only that it won't work with NS4 - lots of stuff on the web that says it won't work though!

Dave

[Don Chambers]

I have solved that part like this:

Code: Select all

   {if $template_option.colorset != 'default'}
   <!-- additional colorset stylesheet -->
   <link rel="stylesheet" type="text/css" href="{$serendipityHTTPPath}templates/{$template}/{$template_option.colorset}_style.css" />
   {/if}

YL

That has the same problem as what I mentioned earlier. Say someone starts by copying bulletproof into a new template folder with a name MyTemplate. They play around with it for awhile, ultimately leaving the colorset of "violett". Now after experimentation, and a loss of patience they decide to eliminate colorsets. The options table still contains $template_option.colorset = 'violett' for the template 'MyTemplate'. The code you have will then try to load, for instance, 'violett_back.png' for the back calendar arrow. Hopefully, they will find the code you are using for 'default' and figure it out. I don't have a better solution, just pointing it out.

Not related, but, I was looking at your css regarding the comment form and came across this:

Code: Select all

form textarea { margin-bottom: 1%; }
/*** End commentform ***/serendipitySideBarItem

[yellowled]

Oh and we could always use 'transparent' instead of 'inherit' for background colour - although I can't find any problem with IE6 inherit, my Eric Meyer book say's only that it won't work with NS4 - lots of stuff on the web that says it won't work though!

Hrm. I tend to believe Eric Meyer, but my (German) CSS book says inherit doesn't work in IE <= 6 ... never mind, I'll check that out with some static pages on a win machine tomorrow.

YL

[yellowled]

That has the same problem as what I mentioned earlier. Say someone starts by copying bulletproof into a new template folder with a name MyTemplate. (...) I don't have a better solution, just pointing it out.

Well, I don't think there is a 'fool proof' solution. That's something we gotta live with - there'll always be people who find a way to break a certain layout or produce some kind of error. However, people editing config.inc.php will probably know what they're doing, so this isn't likely to happen.

Not related, but, I was looking at your css regarding the comment form and came across this:

Thanks. Must be some kind of copy 'n' paste mistake.

YL

[Don Chambers]

So YL - where is the solution to the feed icon? I have been waiting all day for you to rewrite those plugins complete with TPLs!! What is taking so long?

I have been reviewing the commentform from bulletproof. I like it. What is the inspiration for using DL's? Something about it seems to render a bit slowly to the screen, but I still like everything else going on in that form. Right now, I am trying to reconcile the classes you are using, against the classes I was previously using and the classes used by default. It is AMAZING how many classes are emitted by entries/comments/commentform!!! Also, many/most of the templates are using the various available classes differently. Some have errors in their css classes, a good example being .serendipity_commentForm. I can find a class serendipityCommentForm, and an anchor id of serendipity_CommentForm (note the capital C), so many of these stylesheets have something in it not being used, or presumed operational when, in fact, it is not.

Anyway, like to hear the logic behind DL's.

[Don Chambers]

More bugfixes for you, but double check to make sure:

One that occurs in nearly every template I have seen:

Code: Select all

.serendipity_comment { padding: 3px}

This should be #serendipity_comment as it is called from commentform.tpl as <form id="serendipity_comment"..... You have it correct further down in .frm, #serendipity_comment select {

Also:

Code: Select all

.serendipity_comment_author_selfcomment_oddbox,

That's one I pointed out to Garvin in some other post. Need a space between the "self" & "comment".

EDIT/ADDITIONS:
From a "futureproof" perspective, you MIGHT consider changing the form dt, form dd and form textarea to #serendipity_comment dt, etc just in case anyone ever has another DL structure in some other form. Less "future-proof", but from an "added clarity" perspective, you might change .frm & .frm:focus to .serendipity_commentsValue .frm & .serendipity_commentsValue .frm: focus. This is personal opinion. I just like looking at CSS and knowing, as much as possible, where that tag is actually being used, even when it is presented together with other related tags. I tried both of these modifications, and both work just fine.

I do have a question. The intro code to the commentform.tpl is this:

Code: Select all

<div id="serendipityCommentFormC" class="serendipityCommentForm">
<div id="serendipity_replyform_0"></div>
<a id="serendipity_CommentForm"></a>

Is that legit for the first div to have a class of serendipityCommentForm and the anchor to use it for an ID? I spotted this because something looks funky about your margins in .serendipity_section_commentform.

EDIT AGAIN: I found what I was looking for with respect to the margins and such. I think your intention with this:

Code: Select all

.serendipity_section_commentform {
   font-size: 1em;
   font-weight: normal;
   margin: 0 10px 10px;
   padding: 0;}

.serendipity_commentsTitle { margin: 5px 10px; }

.serendipity_section_commentform .serendipity_commentsTitle { margin: 5px 0; }

is more cleanly accomplished with this:

Code: Select all

#serendipity_comment {
   font-size: 1em;
   font-weight: normal;
   margin: 0 10px;
   padding: 0;}

.serendipity_commentsTitle { margin: 5px 10px; }

This has the title of "add comment" falling outside the form so it is styled like the other titles and does not require special treatment. Visually, it is no different. I just think it is cleaner. Since I am incorporating BP code into what I am doing, I have made every change I have mentioned in this post, and think they are for the better unless you have solid reasons as to why they are not.

Caveat: I am still learning all this stuff. In fact, I was thinking of changing my signature line below from my true name, to "Dummy Link #3", inspired by your sandbox and I feel that is quite appropriate at times!!

[yellowled]

So YL - where is the solution to the feed icon? I have been waiting all day for you to rewrite those plugins complete with TPLs!! What is taking so long?

Oh, that's just because I got Garvin via ICQ yesterday, but he didn't have any time. Plus, you're forgetting the timezone issue - it's some kind of wonder that I am already up

I'm going to post this matter to the plugins forum later. Maybe we can get someone else from the coder ranks to chime in on this and save Garvin the hassle.

I have been reviewing the commentform from bulletproof. I like it. What is the inspiration for using DL's?

Well, that's just code I found somewhere on the web The inspiration to actually use it was a) I liked it, b) it's easy to style, c) it's tableless, and d) Carl liked it

So I'm gonna get some coffee now and get right into those bugs. (God, I hate bugfixing. Almost as badly as writing documentation )

YL

[yellowled]

More bugfixes for you, but double check to make sure: (...)

Caveat: I am still learning all this stuff. In fact, I was thinking of changing my signature line below from my true name, to "Dummy Link #3", inspired by your sandbox and I feel that is quite appropriate at times!!

It's not appropriate at all Great calls, all of them.

See, this is the nice thing about having someone new chime in on this: I actually get my lazy ass kicked to revise code I've been using over and over again. This is probably typical for template authors - we have a piece of working code we like, we use it again without noticing those little mistakes.

You do of course know that you've now earned the honor of being called 'official bulletproof bughunter'? T-shirt's in the mail.

YL

[d_cee]

Hi YL

here's a slight problem...

If you change template to 'bulletproof but don't save the style options and just go straight back to your blog then the paths for the feed-icons and calendar arrows isn't set.

Oh and the right sidebar margin in safari seems to be because the right sidebar is floated left.

that's it for now

Dave

[d_cee]

One thought I had regarding changing the feed icon was to use the 'before' and 'after' pseudo elements. I know IE doesn't support these but with a few conditional comments in the IE stylesheet might it then be possible.

There is some info about this at http://www.quirksmode.org/css/beforeafter.html and some hacks for IE here http://nanobox.chipx86.com/blog/2006/07 ... -below.php

Dave