|
User Details |
message
|
|
Martin
post date:
2010-09-14 09:11:37
|
|
Hello,rnrnI am currently testing Flexi and I was wondering if it is possible to import an existing page?rnrnI have a live website and have copied all the files to the site folder that I created to be able to test Flexi. I have opened one of the pages of my site and when I try to edit it I get the message:rnPlease select a Flexi CSS layout.rnrnRegards,rnrnMartin
|
|
|
Cristian Dorobantescu [Extend Studio]
post date:
2010-09-14 10:18:50
|
Hi Martin,
Flexi CSS Layouts does not know how to read other layouts than it's own. But I'm quite sure it should be easy enough to replicate the layout in no time!
Cristian
|
|
|
Martin
post date:
2010-09-14 10:27:10
|
That's a real shame.
I will try to recreate the homepage and a subpage of my site www.albruna.nl to see if it is as easy as you say.
I sure hope it is.
|
|
|
Cristian Dorobantescu [Extend Studio]
post date:
2010-09-14 10:34:31
|
Hi Martin,
Should create 4 rows with width 100% and max width >1450px. Then in each row you insert a column and align it centered. For the header you might want to insert in the column 2 rows (one for the logo and the second one for the menu.
The column with the slideshow needs 2 more columns one for the slideshow one for the right menu.
For the text area, I would insert 5 columns in the centered column. 3 for the text and 2 for the separators.
And in the footer you should only add the text and center allign it from the Text settings.
Cristian
|
|
|
Martin
post date:
2010-09-14 16:32:58
|
I have a few more questions if you don't mind.
Why have a max width of +1450px?
How would one go about aligning the menu items and the logo? The logo (the puzzle and the text beneath it) has a different height than the menu items and the menu items needs to be placed at the bottom.
How would one go about creating the space between the menu items?
This same question goes for the text area. There is space between the >>Laatste Werk<<, >>Onze Diensten<< and >>Albruna<< and the text below it. There is also space between the text in the last column and the brown image with the word {alb-runa} in it beneath it. How would I create these spaces in Flexi?
I know how to code this by hand and how to get it done in Dreaweaver but if I could do it in Flexi that would make live just that bit easier:-).
|
|
|
Cristian Dorobantescu [Extend Studio]
post date:
2010-09-14 17:00:17
|
Hi Martin,
I think I might have to write an entire tutorial to cover all steps - I can do this tomorrow if you like.
For now I've made a screenshot and highlighted some boxes there. The screenshot is here:
http://www.extendstudio.com/images/flexi-css-layouts/albruna.png
Let me answer your questions (please look at the screenshot):
-----------------------------------------
1. Max Width is used in modern designs to limit the width of the layout (it's a best practice as some designs might break if they get too wide). ~1450px is good for an screen up to 1600 resolution so it should work on most LCDs just fine. If you want you can go for more.
2. To align the logo an menu the easiest way would be to split the header in 2 rows. The upper row would contain the puzzle, the bottom row would contain the logo and menu. To position the logo/menu at the same height you can use bottom/top padding for the row containing the logo and menu.
3. The space between the menu items is very easy to do. In the bottom row from the header, you insert as many columns as the menu has + one for the logo. Spacing between the elements is done via padding left/right.
4. space between the >>Laatste Werk<<, >>Onze Diensten<< and >>Albruna<< and the text below it can be done in 2 ways:
- assuming >>Laatste Werk<<, >>Onze Diensten<< and >>Albruna<< are h3 tags, then h3 has a native padding. You can as well style it manually from the css.
- or you can put the titles in a row and the text below in a different row and use paddings
5. to space the images, use rows and padding.
|
|
|
Cristian Dorobantescu [Extend Studio]
post date:
2010-09-15 02:19:32
|
Hi Martin,
Please let me know if it's ok to make a tutorial based on your site layout.
Thanks,
Cristian
|
|
|
Martin
post date:
2010-09-15 13:34:51
|
Hello Christian.
I bought this layout from here http://themeforest.net/item/clean-business-20/51677 so you might want to check with the creator of the layout and Envato if this is something that would be acceptable.
But still, some good tutorials would be very usefull.
Regards,
Martin
|
|
|
Martin
post date:
2010-09-15 13:49:05
|
I had a look at your screenshot and I was wondering what the point was of one of the rectangles you created (the one the arrow points to) http://www.albruna.nl/albruna.png
Why this container?
All the other explanations seem to be very logical and I thank you for it.
Just to get back to the tutorial. Obviously you can create a tutorial just for me, but as said if you want to create a tutorial for eveyone to see you really should talk to the developer and Envato.
Nonetheless, the layout of my site isn't all that special and I have seen lot's of similar ones (browse through http://themeforest.net/ and you see what I mean), so in that regard it would be easy to construct something vaguely similar and use that as a tutorial. But I am no legal expert, so you might want to make sure you aren't breaking any laws!
Regards,
Martin
|
|
|
Cristian Dorobantescu [Extend Studio]
post date:
2010-09-15 16:45:30
|
Hi Martin,
From the CSS point of view it's not needed (I mean if you create the css by hand). Flexi CSS Layouts has been created to be as close as possible to the way you create table cells. Therefore:
- you need one container (the exterior one) - a column to set the width (let's say 900px centered)
- and inside this column you create 2 rows so you can handle the height (and align the menu/logo/puzzle)
Hope it makes sense.
C
|
|
