New Templates - My Beautiful Laundrette | CSS Templates
Moderator: mikey
New Templates - My Beautiful Laundrette | CSS Templates
"My Beautiful Laundrette" is actually a set of two templates: one template with a monitor resolution of 800px x 600px and higher, the other one a bit wider with a resolution of 1024px x 768px and higher. The latter one contains two columns in the content area - one of which can hold a newsbox, a clock, a calendar or what ever you want.
The templates are not thought to be right out of the box templates, but offer room for own design ideas. They can easily be changed. And to facilitate this option, the templates come with their original Fireworks PNG and Photoshop PSD files.
It comes with a new CSS driven drop down menu holding now up to 4 menu levels. It has a fancy graphical search function and comes with a nice sitemap design, which can hold now also up to 4 menu levels ( this was not possible before).
Download of: My Beautiful Laundrette
Download of: My Most Beautiful Laundrette
Download page
Demo
[ external image ]
[ external image ]
The search function is located on top of the horizontal menu level. If you need the space for additional H1 menu buttons, you can turn a little screw which moves the search function up or down to free space. Read the readme.txt file which comes with the template, if you want to know how it works
[ external image ]
Till
1) Template name: My Beautiful Laundrette.
2) Template resolution: 800px x 600px and higher / 1024px x 768px and higher.
3) Features: Drop Down menu up to 4 menulevels. Nice search box. Styled sitemap.
4) This template is meant as a guideline for your own template developement. The graphical work can easily be adapted according to your own needs. You just add your own top image and change the color of the buttons. For the horizontal menulevel 1 menu there exist already hover buttons in red, blue, and green. You just exchange them. The hover colours of the lower menu levels have to be changed in the stylesheet. Here we have only coloured fields.
In order to facilitate graphical work, we have added the original template graphics as Fireworks PNG and Photoshop PSD-files. You find them in the "ORI" subfolder.
5) The search button is located in the menulevel 1 area. If you need the space for menu buttons, you can move the search function up or down. To do this, open the stylesheet.css file. In line 21(23) you find an outcommented instruction starting with: /*div#searchbox {position:absolute;top:-25px;........................ */
Remove the outcommenting signs (/* and */) and add them to the instruction just one line above in order to deactivate the unwanted location (or delete the line). Now you can move the search function up or down by changing the instruction "top:-25px". Just use different numbers.
6) In order to use 4 menu levels you have to set "menu_levels:" to "4" in CMSimple's configurations.
7) We suggest to set "menu_sdoc:" to "parent" in CMSimple's configurations. This is not a prerequisite to use this template, but it looks better.
8) This template has been positively tested with: IE5.5, IE6, IE7, IE8, FF3.x, Chrome1.x, Safari4.x
9) Licence: This template underlies the AGPL3 conditions.
copyright: NMuD|2009
The templates are not thought to be right out of the box templates, but offer room for own design ideas. They can easily be changed. And to facilitate this option, the templates come with their original Fireworks PNG and Photoshop PSD files.
It comes with a new CSS driven drop down menu holding now up to 4 menu levels. It has a fancy graphical search function and comes with a nice sitemap design, which can hold now also up to 4 menu levels ( this was not possible before).
Download of: My Beautiful Laundrette
Download of: My Most Beautiful Laundrette
Download page
Demo
[ external image ]
[ external image ]
The search function is located on top of the horizontal menu level. If you need the space for additional H1 menu buttons, you can turn a little screw which moves the search function up or down to free space. Read the readme.txt file which comes with the template, if you want to know how it works
[ external image ]
Till
1) Template name: My Beautiful Laundrette.
2) Template resolution: 800px x 600px and higher / 1024px x 768px and higher.
3) Features: Drop Down menu up to 4 menulevels. Nice search box. Styled sitemap.
4) This template is meant as a guideline for your own template developement. The graphical work can easily be adapted according to your own needs. You just add your own top image and change the color of the buttons. For the horizontal menulevel 1 menu there exist already hover buttons in red, blue, and green. You just exchange them. The hover colours of the lower menu levels have to be changed in the stylesheet. Here we have only coloured fields.
In order to facilitate graphical work, we have added the original template graphics as Fireworks PNG and Photoshop PSD-files. You find them in the "ORI" subfolder.
5) The search button is located in the menulevel 1 area. If you need the space for menu buttons, you can move the search function up or down. To do this, open the stylesheet.css file. In line 21(23) you find an outcommented instruction starting with: /*div#searchbox {position:absolute;top:-25px;........................ */
Remove the outcommenting signs (/* and */) and add them to the instruction just one line above in order to deactivate the unwanted location (or delete the line). Now you can move the search function up or down by changing the instruction "top:-25px". Just use different numbers.
6) In order to use 4 menu levels you have to set "menu_levels:" to "4" in CMSimple's configurations.
7) We suggest to set "menu_sdoc:" to "parent" in CMSimple's configurations. This is not a prerequisite to use this template, but it looks better.
8) This template has been positively tested with: IE5.5, IE6, IE7, IE8, FF3.x, Chrome1.x, Safari4.x
9) Licence: This template underlies the AGPL3 conditions.
copyright: NMuD|2009
-
- Posts: 342
- Joined: Thu Jun 26, 2008 8:19 pm
- Location: Germany
- Contact:
Re: New Templates - My Beautiful Laundrette | CSS Templates
Hi Till, this Template looks really great, i like it very much! Especially the attention to small details like the magnifier icon mouse over.
Re: New Templates - My Beautiful Laundrette | CSS Templates
Thanks a lot. However, most of the work was to find out, how to extend the drop down menu to 4 levels. It was a client's question. Now I know how to extend it up to 10 menu levels who ever it wants And it runs even in IE 5.0 - who ever it runs .CMSimple-Styles.com wrote:Especially the attention to small details like the magnifier icon mouse over.
Till
Re: New Templates - My Beautiful Laundrette | CSS Templates
Because of four CSS mistakes and spelling errors in both templates they have been updated. In addition the search modul is a bit more fancy.
Till
Till
Re: New Templates - My Beautiful Laundrette | CSS Templates
I like this template a lot. Ever thaught about making a fluid version that resizes between 800 and e.g. 1600 px width?
I've noticed that laundrette puts main2_bg.jpg into tables created by FCKeditor. Bug or feature?
Moreover, Firefox puts a border around picturelinks. Is it possible to remove it? I cannot find any link attributes in the stylesheet.
BTW: In my opinion all your work is very great!
I've noticed that laundrette puts main2_bg.jpg into tables created by FCKeditor. Bug or feature?
Moreover, Firefox puts a border around picturelinks. Is it possible to remove it? I cannot find any link attributes in the stylesheet.
BTW: In my opinion all your work is very great!
Re: New Templates - My Beautiful Laundrette | CSS Templates
I think this is not such a good idea with templates having a horizontal menu. If you shrink the size of the window, the buttons may start popping around which looks rather funny. With vertical menus (drop down menus too) I generated flexible templates already.wosee wrote:Ever thaught about making a fluid version that resizes between 800 and e.g. 1600 px width?
The template does not have a single table. If you edit content text using FCKeditor, the editor cannot change the template. So I don't understand what you mean.wosee wrote:I've noticed that laundrette puts main2_bg.jpg into tables created by FCKeditor. Bug or feature?
Edit ste stylesheet.css file and add to the bottom of the file:wosee wrote:Moreover, Firefox puts a border around picturelinks. Is it possible to remove it? I cannot find any link attributes in the stylesheet.
Code: Select all
img {border:none;}
Code: Select all
a img {border:none;}
Thanxwosee wrote:BTW: In my opinion all your work is very great!
Till
Re: New Templates - My Beautiful Laundrette | CSS Templates
I'm sorry, a picture says more than thousand words. I meant tables in the content written by FCKeditor.
[ external image ]
That's the code:
http://wosee.ath.cx/beispiel/?Unsere_Autos
Thx for the hint, but how do you make links red? I thaught I'd find that color in the stylesheet. However, I didn't...
Ad horizontal menu: Couldn't you integrate that maxwith for the menu too?
[ external image ]
That's the code:
Code: Select all
<table width="95%" cellspacing="1" cellpadding="1" border="0">
<tbody>
<tr>
<td>
<p style="text-align: center;"><img alt="" style="width: 312px; height: 234px;" src="/beispiel/images/auto_rot.jpg" /></p>
</td>
<td>
<p style="text-align: center;"> </p>
<p style="text-align: center;"><strong>Rotes Auto</strong></p>
<p style="text-align: center;">Unser rotes Auto ist ausgestattet mit</p>
<ul>
<li style="text-align: center;">roter Farbe</li>
</ul>
</td>
</tr>
<tr>
<td>
<p style="text-align: center;"><img width="300" height="167" alt="" src="/beispiel/images/auto_blau.jpg" /></p>
</td>
<td>
<p style="text-align: center;"> </p>
<p style="text-align: center;"><strong>Blaues Auto</strong></p>
<p style="text-align: center;">Unser blaues Auto ist ausgestattet mit</p>
<ul>
<li style="text-align: center;">blauer Farbe</li>
</ul>
</td>
</tr>
<tr>
<td>
<p style="text-align: center;"><img alt="" style="width: 299px; height: 198px;" src="/beispiel/images/auto_bunt.jpg" /></p>
</td>
<td>
<p style="text-align: center;"><strong>Buntes Auto</strong></p>
<p style="text-align: center;">Unser buntes Auto ist ausgestattet mit</p>
<ul>
<li style="text-align: center;">schöner Farbe</li>
</ul>
</td>
</tr>
</tbody>
</table>
Thx for the hint, but how do you make links red? I thaught I'd find that color in the stylesheet. However, I didn't...
Ad horizontal menu: Couldn't you integrate that maxwith for the menu too?
Re: New Templates - My Beautiful Laundrette | CSS Templates
This is the done by the editor. It does not have anything to do with the template. I don't use FCKeditor, so I don't know.wosee wrote:I'm sorry, a picture says more than thousand words. I meant tables in the content written by FCKeditor.
I think it's this here:wosee wrote:Thx for the hint, but how do you make links red? I thaught I'd find that color in the stylesheet. However, I didn't...
Code: Select all
div#TSmainContent a {color:#c00;text-decoration:none;}
Re: New Templates - My Beautiful Laundrette | CSS Templates
Yeah... looked for the wrong color, thx!
Of course FCKeditor creates the table, but your template places it's background into it. Moreover, the function <?php echo editmenu();?> has got the template's background. I guess making a table with every other random editor or by hand would result in the same background.
I changed
to
and the table's background is correct for me. So i think either td or th or both are "too much". I don't know what these expressions do, but to me the template looks better without it.
Of course FCKeditor creates the table, but your template places it's background into it. Moreover, the function <?php echo editmenu();?> has got the template's background. I guess making a table with every other random editor or by hand would result in the same background.
I changed
Code: Select all
body,td,th {font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;font-size:small;background:#fff;}
Code: Select all
body{font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;font-size:small;background:#fff;}
Re: New Templates - My Beautiful Laundrette | CSS Templates
Maybe, you are right! I should change the template and remove the th,td. This is old CSS stuff for old browsers, anyway.
Till
Till