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

Skinning and designing Serendipity (CSS, HTML, Smarty)
cyrano
Regular
Posts: 49
Joined: Thu Dec 07, 2006 1:05 pm
Location: Stuttgart
Contact:

Post by cyrano »

carl_galloway wrote:Generally you would copy those styles into your template stylesheet. The better coded plugins tend to check if your stylesheet includes one of the stylenames used in the plugin stylesheet. You will probably need to look into the plugin php file to see which stylename is looked for.
thank you for give me a hint carl.

css changes with color and positioning works well
regards cyrano
-------------------------
www.planepix.de
www.weitzelmedia.de
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

d_cee wrote:
we still need a way to change the header image, the basic colors,
I seem to remember Carl and Garvin doing some work with a colourwheel. I don't know how it ended up although I seem to recall some difficulties. I'm sure Carl will recall.
Let's assume that's a possibility - what do we do about the header image? I think this is the tough one ... however, I'm positive that the coder guys can help us here. Maybe we can use ImageMagick or GD to convert images.

As far as I can see, the biggest problem with this is the number of possibilites for a header image. It could be a banner or a tile, different sizes and stuff like that which makes it hard to impossible to make any image users would want to use fit.
d_cee wrote:
and the entry footer, which is probably the easiest thing to do. But what exacly do we want to offer for the entry footer? Something like:

- full footer (basically the way it is now in the default template)
- slim footer (no comments/trackback info; nice feature for the s9y-as-a-cms guys)
- split footer (I have working code for that; this basically means to split it up into an "author byline" which is display below the entry title and a second footer holding comments, trackbacks and stuff; might be nice for multi-user blogs)
Sounds ideal.
After thinking about this, I'd probably go with Blog footer, CMS footer, and Newspaper footer. Sounds a little more descriptive. I'll see if can incorporate that on Monday or Tuesday. Until then, I'm swamped.

YL
d_cee
Regular
Posts: 603
Joined: Wed Jan 18, 2006 6:32 pm
Location: UK
Contact:

Post by d_cee »

Hi YL
what do we do about the header image? I think this is the tough one
Impossible I'd say to make every variation available. Keeping it simple so that a header image can be inserted or swapped for another would be enough IMHO
I'd probably go with Blog footer, CMS footer, and Newspaper footer. Sounds a little more descriptive.
Sounds OK too - although I'm not sure that 'Newspaper footer' sounds like an "author byline" and a second footer holding comments, trackbacks and stuff.
cheers

Dave
carl_galloway
Regular
Posts: 1331
Joined: Sun Dec 04, 2005 5:43 pm
Location: Andalucia, Spain
Contact:

Post by carl_galloway »

YellowLed wrote:
d_cee wrote:
we still need a way to change the header image, the basic colors,
I seem to remember Carl and Garvin doing some work with a colourwheel. I don't know how it ended up although I seem to recall some difficulties. I'm sure Carl will recall.
It never did get resolved, we both got too busy with other things and then when AKB started his template editor plugin it seemed more useful to integrate the colorwhhel into his code. Not sure where its at now, the last version I have was 0.3

With header images, Garvin and I have had discussions about that in the past and integrating an upload box into the template config screen is not his preferred way of doing things. He advised me to simply request a url from the user and let them upload their new header to whereever they felt like, for example into their uploads folder. However, if the header image is going to be a background image to a css style, then the style itself needs to be defined within index.tpl and not style.css, this is because it isn't possible to put the template option variable into the stylesheet, so within the head section of index.tpl, add <script>#header {ldelim}blah blah {rdelim}</script> for the header css.

The entry footer gets really confusing, what do users actually want, and the more options the more smarty code to make it work, and therefore the harder it gets for new users to edit their entries.tpl if they ever need to. I personally think most users want the ability to swap the footer from under the title, to under the entry, and most users don't care too much about slim or full versions. better way would be to split the config options into position (below title, below entry, split etc) and included (author, category, comments, trackbacks), this will give users much more control and keeps it simple in the config screen. Just be aware this may start to have performance issues.
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

carl_galloway wrote:However, if the header image is going to be a background image to a css style, then the style itself needs to be defined within index.tpl and not style.css, this is because it isn't possible to put the template option variable into the stylesheet, so within the head section of index.tpl, add <script>#header {ldelim}blah blah {rdelim}</script> for the header css.
I see, but I'm afraid I don't understand your short code example. Elaborate, please :)

Here's another idea: instruct users to upload their bg image to a specified location (uploads/banner.jpg comes to mind) and offer different classes for it which can be chosen in the theme options? Something like "Wallpaper" (image will be repeated horizontally and vertically), "Tile" (repeated vertically only), and "Banner" (no-repeat, centered in the header)?
carl_galloway wrote:better way would be to split the config options into position (below title, below entry, split etc) and included (author, category, comments, trackbacks), this will give users much more control and keeps it simple in the config screen. Just be aware this may start to have performance issues.
Hm, I screwed up my first draft of that anyway :oops:

The good thing is that I already have 2 of the first options in the yl15 template. However, I'm not sure about the third one, which would be "below title". I don't think I've ever seen that in action or being requested ... only like below the title and floated like in carl_contest. Plus, I really like this :) I'll give it a try.

YL
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

YellowLed wrote:I'll give it a try.
Neat. So I've added it like this so far:

Theme/Style options:
Layout type (three/two, sidebar left/two, sidebar right)
Entry footer position (below entry, below title, split)
Footer author (yes/no)
Footer categories (yes/no)
Footer timestamp (yes/no)
Footer comments (yes/no)
Footer trackbacks (yes/no)
Sitenav position (none, above header, below header)
plus the well-know code for the navbar links

(Please remind me that I still have to do the lang_*.inc.php files, but I want to wait with those until we're done with the config.inc.php.)

So far I don't 'feel' any performance problems.

The template zipfile is now here, plus I've finally managed to set up a (temporary) sandbox blog to test this.

So for the time being we have to find something for the header image and the colors ... hohum. I have no more ideas than already mentioned :)

YL
carl_galloway
Regular
Posts: 1331
Joined: Sun Dec 04, 2005 5:43 pm
Location: Andalucia, Spain
Contact:

Post by carl_galloway »

I'm going to check out your new zipfile, then I'll add the code I was suggesting for the header and shoot it back to you so you can merge the two if it looks promising. I'm not too sure about the whole tiling thing, but I guess if this template is as advanced as it already is it wouldn't hurt to add the option.

If I think of anything else I'll let you know.
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

carl_galloway wrote:I'm going to check out your new zipfile, then I'll add the code I was suggesting for the header and shoot it back to you so you can merge the two if it looks promising.
Great. Also, the code for inserting the various entry footers blows up the entries.tpl quite a bit, so if you can come up with some smarter code ...
carl_galloway wrote:I'm not too sure about the whole tiling thing, but I guess if this template is as advanced as it already is it wouldn't hurt to add the option.
On the other hand I can't remember a single post in the forum on how to add a tiled wallpaper, I only remember questions about banner images.

In the meantime, I'm gonna review some of the other .tpl files. Do we need everything the default template has? I'm pretty sure we want tableless forms. I'd love to go with the code I originally suggested for the OTL and honed a little for yl15, which is for both contact and comment form. Has anybody found or done decent code for a tableless calendar?

YL
d_cee
Regular
Posts: 603
Joined: Wed Jan 18, 2006 6:32 pm
Location: UK
Contact:

Post by d_cee »

Hi YL
On the other hand I can't remember a single post in the forum on how to add a tiled wallpaper, I only remember questions about banner images.
I think the only tiling I've seen in headers is stuff like gradients on a repeat-x or repeat-y. Mostly it's similar to the problem I dealt with on here last night - putting a logo in place and hiding the header h1, h2 or both. It would be useful to have the option to place it right, left or center, top, bottom or center.
I'm pretty sure we want tableless forms. I'd love to go with the code I originally suggested for the OTL and honed a little for yl15, which is for both contact and comment form.
The best table-less form stuff I've found is here if there's a reason you don't want to use your OTL code.
Has anybody found or done decent code for a tableless calendar?
I had a look at this when I did my 'Multi-column' template and came to the conclusion that a calendar was best presented in table.Take a look at this on Veerle Duoh's blog which shows that it is correct semantic markup to make a calendar table based.

Dave
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

d_cee wrote:Mostly it's similar to the problem I dealt with on here last night - putting a logo in place and hiding the header h1, h2 or both.
If you're still looking for a solution, I think Fahrner Image Replacement is the best way to do that. I have outlined it in my blog for s9y (this links to the German post, but an English version is available, too :)).
d_cee wrote:if there's a reason you don't want to use your OTL code.
Well, of course I like my code :wink: However, I'm still seing this as a group effort, so if anybody has a good reason against it or a better solution, I'm willing to negotiate. Grrr! :wink:
d_cee wrote:which shows that it is correct semantic markup to make a calendar table based.
Hmm. That would also be true for the archive page, which I've just now done with unordered lists ...

Veerle sure has a point, but I think that tables are only really semantically correct if they hold information which should be displayed in a table. However, the calendar in s9y can also be used for navigation, so it's not purely informational ... on the other hand a tableless calendar would probably look pretty screwed up in a non-CSS browser. Hmmhmm.

Let's hear what Carl thinks :)

YL
carl_galloway
Regular
Posts: 1331
Joined: Sun Dec 04, 2005 5:43 pm
Location: Andalucia, Spain
Contact:

Post by carl_galloway »

Starting with the link to the from that Dave suggested, wow, I've never seen a css form that looks that good. Honestly, I think we're trying to improve the way Serendipity looks and using a form like that would definitely improve the look and feel of our templates, but my fear is that we would need to update the templates every time a plugin gets an update, just think of how many updates the contact form has had recently, and if this new template code is designed to make it easier for new users to customise their own template then we don't want to be producing regular updates. On the other hand if we can convince Garvin and some of the key plugin guys to change to css forms then it would be worth it. I think we need Garvin's input on this one.

I'm really torn in two thinking about that darned calendar, it does contain data, but its also used for navigation, and it definitely fails every real world test I've ever tried to do from an accessibility point of view. I've often thought the way to deal with the calendar would be to put a hidden link in at the top of the table which points to the archives page so that disabled users can still get to those entries, then make the archives page css only, which is much easier than converting the calendar.

backgrounds/headers, we're really talking about two different things aren't we, how many templates use a background image, probably most of the modern graphical templates, but as Dave says they are mostly just a gradient with a repeat so do we really need to support changing this in the config, or should users simply overwrite the template background image with their own version? I actually think this is the sort of situation where AKB's template editor would be useful, and what we should do is make sure that these sorts of changes are at the top of style.css or index.tpl so the user can simply follow a precise set of instructions we give them.
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

carl_galloway wrote:Starting with the link to the from that Dave suggested, wow, I've never seen a css form that looks that good.
I haven't really looked at the code, but personally, I think it's a little over the top. I do, however, like those info boxes :)
carl_galloway wrote:my fear is that we would need to update the templates every time a plugin gets an update, just think of how many updates the contact form has had recently
I have to admit I've lost track on the contact form updates, I have zero idea what it can do now, all I know is it has been improved a lot lately :)
carl_galloway wrote:I've often thought the way to deal with the calendar would be to put a hidden link in at the top of the table which points to the archives page so that disabled users can still get to those entries, then make the archives page css only, which is much easier than converting the calendar.
http://sandbox.yellowled.de/archive already is CSS only, so that's covered. However, disabled users don't have to use the calendar, as long as the blog has the Archives sidebar plugin. So maybe we should simply add a skiplink to the archives page and leave the calendar as it is?
carl_galloway wrote:backgrounds/headers, we're really talking about two different things aren't we, how many templates use a background image, probably most of the modern graphical templates, but as Dave says they are mostly just a gradient with a repeat so do we really need to support changing this in the config, or should users simply overwrite the template background image with their own version?
Well, originally we were talking about a background image for the header :)

If we're talking about a template background image, that should be a piece of cake. If img/background.png is present, it will be tiled. If you don't want a template background image, don't include it. Period. Anybody who wants to do more advanced stuff will have to be familiar with CSS anyway.

Now, that #!?$ header image ... we're not going to get a solution with an upload box in the theme options, so the easiest way probably is to have users overwrite a standard banner like img/banner.png (I am, by the way, all for using png images only).

However, the question remains how to include that properly. Basically, it's not a problem to give the blog a fixed width using the wrapper div. But some people (like me :)) prefer to have a flexible width for the wrapper, which makes it a little tricky to have a banner. So how about this: basically, the banner image is assigned "top center no-repeat" to the header. That way, it will still look acceptable if you have a banner 600px wide in a wrapper that's wider. In addition to that, we'll have a theme option for the width of the wrapper div, i.e. a dropdown box with the options 760px, 970px, or 95%. We could also have a second theme option to set the height of the header ... that way, people can also choose whether the banner should have a border by simply making their banner smaller.

YL
d_cee
Regular
Posts: 603
Joined: Wed Jan 18, 2006 6:32 pm
Location: UK
Contact:

Post by d_cee »

So how about this: basically, the banner image is assigned "top center no-repeat" to the header. That way, it will still look acceptable if you have a banner 600px wide in a wrapper that's wider. In addition to that, we'll have a theme option for the width of the wrapper div, i.e. a dropdown box with the options 760px, 970px, or 95%. We could also have a second theme option to set the height of the header ... that way, people can also choose whether the banner should have a border by simply making their banner smaller.
The main problem with this is that most users (or at least the ones I've helped do this) want to put a logo or other small image in the header - usually top left or top right. There are so many variations on what a user might want to do it's impossible to cover them all - unless the list of options is so long it becomes unworkable.

As for the contact form, there are just two .tpl files to edit in the new contact form plugin. I've recently edited them for my SPLAT! theme so I think it should be possible to make them tableless without them having to be updated with the plugin. I'll take a look later work allowing, I've not much time today and I'll be at football tonight.

cheers

Dave
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

d_cee wrote:There are so many variations on what a user might want to do it's impossible to cover them all - unless the list of options is so long it becomes unworkable.
Not helping, Dave :wink: So you're saying we should drop the whole header image stuff in the theme options altogether and tell users to use the kubrick header plugin?
d_cee wrote:I think it should be possible to make them tableless without them having to be updated with the plugin. I'll take a look later work allowing, I've not much time today and I'll be at football tonight.
Great, take your time. And enjoy football :)

YL
d_cee
Regular
Posts: 603
Joined: Wed Jan 18, 2006 6:32 pm
Location: UK
Contact:

Post by d_cee »

Not helping, Dave Wink So you're saying we should drop the whole header image stuff in the theme options altogether and tell users to use the kubrick header plugin?
No, not at all, I think we should keep it simple though and just offer users the most requested options. Anything else should be changed in the code - or using AKB's template editor plugin.

During my lunchbreak today I took a look at the calendar and have made an 'accessible calendar' (I think :-)) It still uses tables but it passed the accessibility checks I ran on it. I've incorporated it into a new theme I'm working on so you can take a look at it here. If you think it's OK I'll send you the plugin_calendar.tpl and style.css to include in the 'bulletproof' template.

Oh, by the way, the template and calendar are so far only tested on mac - they probably fall apart in IE6 :-)

cheers

Dave
Post Reply