FlexiPanels CSS for Dreamweaver Forum


box FlexiPanels CSS for Dreamweaver
FlexiPanels CSS for Dreamweaver is a CSS builder that helps you create table-less HTML code for side panels, menu containers or any content zones with a gradient background and rounded corners.

Find out more about FlexiPanels CSS for Dreamweaver

Thread: FlexiPanels + Joomla + custom chrome = glorious

title left
User Details
message
title right
wewright

post date:
2009-08-22 21:08:00
Spent a fair chunk of yesterday jamming a FlexiPanel into Joomla custom chrome modules and am oh-so-happy with the results... so far.

Works perfectly on all browsers i can get my hands on -- safari, firefox and opera on the mac; safari, firefox, ie on xp inside a vmware fusion virtual machine.

Even renders perfectly on Internet Exploder 6 on a win2k virtual machine. Bewdiful!

It did take a bit of nudging of paths to get it to work... so i just wonder if you have any tips or tricks up your sleeves...?

right now i'm wrestling with variable height for the container, so it changes according to the content.

any tips will be gratefully received
wewright

post date:
2009-08-22 23:54:39
ok, so i've had a coffee and shaken the cobwebs out of my head and woken up properly...

got the variable height sort of sorted... of course there's the configuration options i'd overlooked and that works fine with what i'll call a static panel

but it's not working quite right with dynamic joomla modules using custom module chrome.

some work ok, and stretch. Others, like the main menu, will stay at the arbitrary measure used in the configuration, with content overflowing

might be a css clash in my other code so next move will be a bare-bones template.

my head is starting to hurt again so, once again, any tips wil be appreciated.

I've got working notes on my process so far if that'll help

cheers
wewright

post date:
2009-08-23 01:12:55
the non-stretchy, overflow issue above doesn't seem to be module-specific.

it happens when multiple modules are published using the same module chrome

the first module will stretch and render ok... any subsequent modules using the same chrome styling will shorten to the arbitrary measure, with content overflowing. This is regardless of the published position

next is to see if alternate chrome for subsequent modules will work

for now i'm going to play in the big blue and green room, even tho it's a bit windy today
wewright

post date:
2009-08-24 10:36:22
ok, so obviously i needed some fresh air.

repeat until burned into brain: ids are unique identifiers, to be used only ONCE on a page.

multiple instances of an id on the same page will be unpredictable, to say the least.

of course, i KNOW this, but of course, i forgot. (I'll blame the caffeine...)

i guess i got a bit carried away when i saw the "extend cars" example where there are three copies of the one panel... tho they are all the same height...

still, if you have any ideas.... let me know

*************************************************

one thing i've found in my adventures:

the default "stamp" preset has 5px right padding for the content, and should be 30px.

if you select the panel and click on "edit selected panel" in the properties inspector to change the padding, it strips all the content out of your panel and inserts the default "Some sample content here"

Andrei Rinciog [Extend Studio]

post date:
2009-08-25 10:58:07
Hello,

First of all, thank you for sharing your discoveries with us. Well, we haven't really tried to use FlexiPanels in Joomla at the moment so I can't say I don’t know what problems appear in the process. The last problem that you have bumped in seems to be related to the fact that you are creating FlexiPanels with the same id. We have the feature of creating the same panel over and over again on waiting for the next update. I don’t know how much it will help you though, because I have a hunch that you are not creating the panels using the Dreamweaver interface once you insert them in Joomla.

Please share with us how exactly you are creating duplicates of the panels and maybe we can find a way to stop the duplicating id’s.

Regards,
Andrei
wewright

post date:
2009-09-08 03:02:32
Greetings again

Had a number of deadline monkeys on my back lately so haven't had a chance to get back here sooner.

For those who don't really know Joomla, it's a database driven CMS, where the presentation of the site content is styled using a css template.

Many of the items you see on a joomla screen are "modules"... individual blocks or panels of data or whatever.

The modules can be wrapped in divs for styling purposes. This wrapping is referred to as "chrome", and if you don't like the default options you can create your own by using an override file with your custom styling.

Because the module chrome is used many times on a page, the styling is done using classes rather than IDs. And that's where I was tripping up.

Simply cutting and pasting the FlexiPanel code output worked surprisingly well except where the different panels with the FlexiPanel chrome needed to stretch to fit different content. In that case, since they had duplicate IDs, all the panels except the first defaulted to the measure used in the setup of the panel. The first one sized ok, but the rest lost the plot.

What i've done in the end is generate the FlexiPanel to my liking, convert all the div IDs in the css to classes, and use the generated images in a custom DIV structure. As it happens, the custom DIV structure is quite simple and clean.

As for the stretch-to-fit part of the equation... the custom div structure and joomla just take care of that.

Best of all it works perfectly in every browser i can lay my hands on, including the browser of the devil, Internet Exploder 666

not quite the silver bullet just yet, but gee i love this tool!
Cristian Dorobantescu [Extend Studio]

post date:
2009-09-08 04:11:07
:) Can we see it somewhere online?

Cristian
www.extendstudio.com