Thank you Arvid,
fit and worked for my purposes.
For those of us who would also like to have a header and footer in the Leggero-v2 style, here is a little to-doo:
1. Create two files (widgetstop.tpl and widgetsbottom.tpl) in the directory
/fp-interface/themes/leggero.
2. Fill the widgetstop.tpl file with the following content:
Code: Select all
<!-- beginning of Topmenu -->
<div id="columntop">
{widgets pos=top}
<div id="{$id}">
{$content}
</div>
{/widgets}
</div>
<!-- end of Topmenu -->
Fill the widgetsbottom.tpl file with the following content:
Code: Select all
<!-- beginning of Bottommenu -->
<div id="columnbottom">
{widgets pos=bottom}
<div id="{$id}">
{$content}
</div>
{/widgets}
</div>
<!-- end of Bottommenu -->
Edit the files
default.tpl,
index.tpl, and
static.tpl. Under the line {include file=header.tpl}
add the line with {include file=widgetstop.tpl}. Above the line {include file=footer.tpl} add the line with {include file=widgetsbottom.tpl}.
Code: Select all
{include file=header.tpl}
{include file=widgetstop.tpl}
....
{include file=widgetsbottom.tpl}
{include file=footer.tpl}
Now the existing CSS has to be adjusted.
To do this, edit the
common.css file in the
/fp-interface/themes/leggero/leggero-v2/res directory. First, the top margin of div#main needs to be collapsed to make room for the header.
5. Change line in the
NORMAL DESIGN ->
MAIN section to:
6. Insert the following lines between the
BODY CONTAINER and
MAIN in the
NORMAL DESIGN section:
Code: Select all
/* ===== TOP BAR ===== */
#columntop, #columnbottom {
margin: 10px;
background: none;
border: none;
font-size: 100%;
clear: both;
}
#columntop ul {
list-style-type: none;
margin-bottom: .5em;
}
#columntop li, #columnbottom li {
padding: 0px 10px;
}
#columntop ul li, #columnbottom ul li{display: inline}
Insert the following lines between
MAIN and
FOOTER in the
NORMAL DESIGN section:
Code: Select all
/* ===== BOTTOM BAR ===== */
#columnbottom {
text-align: center;
}
#columnbottom ul {
list-style-type: none;
}
Change the line in the RESPONSIVE DESIGN -> MAIN section to:
PS: If you still have the line
float: center; , can delete them without replacement. Reason: center is not a valid value for float.
9. Insert the following lines between the
BODY CONTAINER and
MAIN in the
RESPONSIVE DESIGN section:
Code: Select all
/* ===== TOP BAR ===== */
#columntop, #columnbottom {
margin: 10px;
background: none;
border: none;
font-size: 100%;
text-align: center;
}
#columntop ul {
list-style-type: none;
margin-bottom: .5em;
}
#columntop li, #columnbottom li {
padding: 0px 4px;
}
#columntop ul li, #columnbottom ul li{display: inline}
That should be it. Now you can create a small menu in the header and footer via the admin center as a widget.
Sorry for my bad english, google helped
Best regards