Re: CSS100 [Holy Grail CSS Wireframe Theme]

Thanks again guys. I have changed the block padding to 5 px all around and updated the zip files. Hopefully that will help people out a bit

Javelin is right, if a block from a module is set to 250 pixels and the column it is in is only set to 200 pixels, it will cause wrapping problems. So to fix that either the theme needs to be changed to have bigger columns to match your needs, done here:

in style.css:

Search and replace "12em" (14em for fixed theme) with whatever you need, IE "14em" for bigger left and right columns, etc.

Or you can edit your module template files to not use tables or items bigger than (12em wide. 1 em = 16 pixels at a user's default font size setting) Or replace 12em with 100px to make sure the columns stay the exact width you want and not be relative to the content, that could cause some of the column wrap problems. If you do edit your module's templates, email me the replacement template and put it in the theme to replace those templates for others. I've already done this for a couple modules - mainly to strip out tables and be W3C HTML compliant.

Just remember, these themes are designed to be wireframes to help future theme developers have a common starting point to develop a theme that is CSS based and W3C compliant - These themes are not designed to be a drop-in-place-and-go theme. They may very well need to be tweaked to meet your site's needs. Every site is a little different and may require different block margins, column widths, etc.

Re: CSS100 [Holy Grail CSS Wireframe Theme]


I tried changing the min font size to 105 in the theme file for the "skidoo2" theme and that fixed it for me. I've updated my zip file for skidoo2. Give that a try and see if it behaves any better. If so, maybe a similar fix for the fixed theme will work. Thanks for your help testing!

Re: CSS100 [Holy Grail CSS Wireframe Theme]

Thanks again guys!


UPDATE: I adjusted the left and right columns on the fixed theme and I think it has fixed the column shifting problems in IE. Please test for me. You can download it here:

Fixed Skidoo Too Theme

On another note, there has been a lot of requests for a non-fixed layout, so here is the same theme, colors changed a bit, in a non-fixed format. That means it will adjust to be the full width of your browser. It does use a little javascript to overcome the lack of min-width support in IE < 7 (as well as for the font size changing and the block hiding), so let me know if anyone experiences problems with that. Again, this theme is totally based on the Ruthsarian "Skidoo Too" layout but has been tweaked to work with XOOPS.

Download Skidoo Too Theme

Re: CSS100 [Holy Grail CSS Wireframe Theme]

Hey guys. I've made a few changes to the fixed "Skiddo Too" theme since the one you have on your website. I added some hidable objects like the login/usermenu blocks and notifications. And the horizontal menu is now dynamic - it will automatically link to sublinks for the current module. I believe it is uploaded over the old file in my old post. Have you experienced any problems with the fixed theme? Looks good on your site as far as I can tell. I have not had the time to working on a non-fixed version yet

Re: CSS Wireframe Theme

Good! Yeah, to make it fluid, I will need to make several changes. If you are not using any center column blocks, probably just changing the style:

border: solid 1px #000;
border-width: 1px;
width: 780px;
margin-left: auto;
margin-right: auto;


border: solid 1px #000;
border-width: 0 1px;
min-width: 40em;
width: auto;

Would do it. Getting the center blocks to line up well when at full-width is a differnt problem. I will try to work on developing that fixed Skidoo theme into a full-width theme when I get the chance.

However, it may be a good idea to change some of your image widths anyway, if it requires more than 800 pixels to show it properly, because a screen resolution of 800 x 600 is still very common. That is why fixed width designs usually hover around 800 pixels - to be compatible with the least common denominator.

Re: CSS Wireframe Theme

Thanks javelin,

Can you show me your example? Or tell me what modules you are using and if it happens on all modules?

Re: Holy Grail CSS Wireframe Theme

@xavhmn: Are you saying that the default XOOPS notifications template is not valid? That may very well be the case. All I did was add the extra code to make notifications hidable. I did not rewrite every single XOOPS template..only a very few, and not to necessarily make them validate...although that would be a goal eventually, but probably more so to get the original templates in XOOPS to validate, rather than the "replacement" templates in this theme, as XOOPS progresses, some of these templates may become no longer compatible due to new features or other changes. So along that logic, I don't know how smart it would be to try to include replacement templates for every XOOPS page and every 3rd party module out there. More than likely, I will try to rewrite several though, particularly system templates and some of the more popular modules.

Or are you referring to one of these posted themes in general? As far as I can tell, the themes posted here are W3C compliant - The entirety of XOOPS is not, as far as I know, but I'm sure that is a goal to reach for.

There is one exception - the "Skidoo" theme will have one invalidation if you do not have all three columns turned on. That is because the CSS is being redefined outside of the head tag to accomodate the new widths with a column missing. As far as I know there is no other way to do this and validate - but if someone else knows a way, please enlighten me! Maybe I can put that code in the head...who knows...

Thanks for the help testing!

Re: Easier Editing of Blocks

Thanks guys, I tried "bid" as well with no luck. It's unfortunate that 2.0.14 doesn't return the block ID for the blocks loop. It looks like we'll have to hack a file to get this to work. Anyone know how to get this kind of thing added to the next XOOPS update plan, once we get it figured out?

Easier Editing of Blocks

Okay, I had another idea, but need some help in implementing it. One of the biggest issues with our clients, is they get confused real quick when trying to find a particular block to edit in the admin section.

So I was thinking, why not have a link to edit the block right under each block for admins? It should be easy to do, but I am having one snag. How do you return a block's ID from the theme? This is the code I am trying, but this isn't returning the ID:

<{if $xoops_isadmin}>
div class="edit">
a href="<{$xoops_url}>/modules/system/admin.php?fct=blocksadmin&op=edit&bid=<{$block.id}>">Edit this block</a>

Can anyone assist me with this?

Re: Fixed CSS Wireframe Theme

Okay, the fixed "Skidoo Too" theme I posted earlier now supports not having any blocks in the right or left columns. The layout will adjust accordingly, including the center blocks.

Update: "Fixed Width" Skidoo Too Theme
Added a print.css stylesheet that will drop the left and right columns, remove borders and background colors and fit content to a page if printed. Also, I added a replacement system notification block template and styles so the notifications block will not be visible unless a user toggles it on using the "Notifications" link. Cool eh? Also, I edited the top horizontal menu so that it is dynamically generates tabs based on any sublinks there are for the current module and also doubles as a User Menu.

So that means that the theme that Snow posted will work for theme designers wanting to develop a theme that is "fluid" or spans the whole window and if you want a fixed design and a design that sports columns that span vertically the whole page, you can use the "Fixed Skidoo Too" theme I posted earlier.

Both pass W3C HTML compliance.

Now people just need to test em out!

I should reiterate though that these are XOOPS 2.0.14 themes that take advantage of the new 2.0.14 features and will probably not work very well with earlier versions of XOOPS.

***Wee, my 100th post!

« 1 2 3 (4) 5 6 7 ... 13 »


Who's Online

134 user(s) are online (30 user(s) are browsing Support Forums)

Members: 0

Guests: 134



Goal: $100.00
Due Date: Sep 30
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits