Geeklog Forums

I am hoping to be able to do a Standards compliant Geeklog, and went searching through the archives. I saw a post by Gwen back last fall. It was followed up by comments by SaltLakeJohn -

Was just wondering what the status was of their CSS attempts for layout of Geeklog - something I really want to do! Have either of you read Eric Meyer on CSS: Mastering the Language of Web Design or do you visit Jeffrey Zeldman's site regularly? Great resources for working out your CSS woes.

If you've got any tiger tidbits for me, or if you've got a working 100% CSS Geeklog, I'd love to see your theme/stylesheet. Thanks in advance!

This is the only person I've seen so far try to eliminate tables: http://www.geeklog.net/article.php?story=20030407160210836 The others talked about it but I haven't seen them post a link showing they were successful. I'm waiting for 1.3.8 which should have more hard coded html moved into templates before I will try again.

Yes, the Geeklog team is in fact looking towards the creation of an api design guide for Geeklog. It's been on the table for a few months and work is about to start on this issue. We hope that it will provide a foundation for module developers to follow so as to allow theme development to be made much easier. Creating new themes currently does not extend to the individual modules made by various authors. Stay tuned, we hope to release something before the next snow fall...

I have a theme that is 100% XHTML 1.0/CSS 2.0 compliant, but it required doing lots of small mods to geeklog code. And after all that work I ended up having to use tables anyway as internet explorer isn't 100% CSS 2.0 compatible. Note: Jon.Evans did most of the initial work for his devedge theme (http://evansweb.info, which appears to be down now). And after all that works, it apparently doesn't render correctly with safari (so I'd assume any browser that uses that engine...). I wanted this really badly as well, but I think I'll wait til GL 2.0 comes out with a better theming engine. -Vinny

Would love to see what you did - - if you've still got the files, and I've GOT to think you didn't trash them The doc on theme variables seems to be really helpful. I hate to say it, but I have a very limited target audience, so I don't think the problems with Safari, etc. are going to be too much trouble.

Have you seen the CSS Zen Garden??

Check it out- there are some really awesome examples of how you can change the personality of a page with a stylesheet.

Well you can check it out. Looking over what I have I just realized that some of the admin stuff isn't 100% CSS after all (along with some of my older stories, my fault on that one). Just go to http://furia.abtech.org/ and select the devedge theme. I haven't messed with different style sheets yet. I'm pretty burned out because of how much work it took to get the theme together, and then to have it still not work with some browsers... And like I said, I had to use one table to get three column support in internet explorer. On the plus side it has a big advantage of generating much, much smaller page sizes (less than 50%) compared to most other themes (like the standard shipping GL themes). -Vinny

Yeah, this is why I won't be getting rid of tables just yet. It's a lofty idea and I didn't want to get flamed in my previous post for saying it's impossible to do but...well, it's impossible to do. Cross Platform, Cross Browser compatibility with XHTML/CSS2 is simply not dependable yet. Until it is a given that all browsers support this method, it will not be adopted in the first pass of the design guide. And as painful as it sounds, millions of people still use IE 4x and NS 4x. which does little furthur our goals. Maybe our grandchildren can use XHTML.

Only about 1% of the surfers are still using NS4.x and about the same number for IE 4. In my opinion, it is not worth the effort to design for those old browsers anymore. Sites which still get a decent amount of traffic from them though should at least think twice before dropping support.

A three column tableless layout is very achievable in IE. For example, here is a CMS type site that looks completely fine in IE6 on a PC. They use a couple tables but it's not for page layout purposes. IE5.x renders margins and padding differently so I don't know how well this one looks in that browser. If you get a page to look great in IE though, there's a very good chance it's off in other browsers. It takes quite a bit of effort to tweak around the html so the pages look somewhat similar cross browser. Most people don't have the time or patience to do all the necessary tweaking. It's still far easier to use some tables for layout.

True, a normal three collumn layout can be implemented in XHTML/CSS without tables. But a layout like geeklog's default, with a variable 2 _OR_ 3 column layout (and hence a variable sized center column size and position) seems to be impossible to implement without tables. I'd love to be proved wrong, but until I am we're stuck. If you're willing to run Geeklog with only two columns, then everything falls into place for working without tables. -Vinny

Well, I'll leave your challenge for the CSS gurus. Any takers??

Well, I'm no guru, but I do have a fair amount of patience. If you do nested divs, can't you do a decent 3-column layout?

I'm game to give it the ol' college try! I'll post results, if I get anything done before I take off for the summer.

I have done three coloumn layout for www.geeklook.com with CSS only and then decided to preserve table for coloumn layout at least. I think CSS importance is not in layout but in context-based formating. At geeklook.com the text is formatted differently on homepage and on article view. Different look for left or right blocks is also done with CSS only (Geeklog code offers the same opportunity through templates).

As to tables, it is relatively easy to clean them off the templates. Thankfully, there is also not muchHTML hard-wired into the code. But those <br> tags in the code drive me nuts... I haven't changed any of Geeklog core code on purpose (to make the theme forward compatible), but I hope in future versions Geeklog will produce "logical" output rather than "visual" output. I mean, the outpot should be <h2>Title</h2> rather than <td class="Title">... etc.

[QUOTE vinny said]But a layout like geeklog's default, with a variable 2 _OR_ 3 column layout (and hence a variable sized center column size and position) seems to be impossible to implement without tables. I'd love to be proved wrong, but until I am we're stuck.[/QUOTE]
i produced a typical gl theme 3 column layout using only css. forget about header and footer for now. the content area containing 3 columns need to be in one div. Col_1 is float: left; and absolute width. Col_3 is float: right; and absolute width and both are nested within Col_2, which has margins set to 0px. Do I win a chocolate bar for that?


Laying out GL with CSS only is not a problem. even leaving the tables hardcoded in functions is fine--most of those are presenting tabular data anyway. the problem is the portability of such a layout when plugins are still hardcoding table style in their functions. My current problem this minute is dealing with the forum 2.3 functions.inc file as well as the static pages functions.inc. they include a table width="100%" which can be a browser breaker if not dealt with properly. html should be left out of $retval's--much less style.


what you get with the code i mentioned above is a very nice page that has a content area extending properly to the right margin when right blocks are disabled on various pages. right blocks have to be called from the header for the col_3 to nest properly however--SMOP. Other ways to do that would be to use z-index ingenuity. if you center column is longer than col's 1 or 3 then as your col_2 drops below them, col_2 will extend to the margins (floated col's 1 and 3). it looks good...
here is a pic of an example, which is not operational yet--by far. notice the stories extending under col_3. The same will happen beyond col_1. The story blocks themselves remain tabled in this example. and it doesn't break in IE. yet.

Yes this is a war fought by many, and only a few battles won...

i have a configurable, 3 column theme for download here:

http://www.axonz.com/filemgmt/singlefile.php?lid=1

Hope it helps... (screenshot is included)

I'm nearing completion on a CSS2/XHTML theme that is completely lacking in tables. The only thing I have remaining is making it work in windows IE. If it was just a CSS version of the default geeklog theme, I'd be done by now. But I'm doing a few funky alterations. I'll let you folks know when I'm done and post a link.

And yes, the whole process was a major PITA.

check this out: http://www.csscreator.com/version2/pagelayout.php
You can create a template for HTML 4.01 Transitional to XHTML 1.0 Strict and everything in between. Removes some of the PITA factor. Also http://glish.com/css/7.asp.

---

-- destr0yr
"I love deadlines. I like the whooshing sound they make as they fly by." -- Douglas Adams

Is this theme still o.k. for 1.3.11sr2?

Guys,

I understand the point of using CSS and standards and stuff.

But why is everyone hatin' on tables?

As for me I was looking for a solution to have 3 different appearences on one site. Like 3 businesses want to present themselves under one roof. So I want to put them into 3 categories and each cat should be sligtly different in colours, logo.gif, slogan etc. So I thought different CSS and not really a completely different theme should do.