Alors voici la méthode pour que vore site colle au bas de votre navigateur:
Je me base sur le thème Mor.pho.GEN.e.sis - version 2.0 de notre cher kris (peut etre une version 2.1...
).
Commençons par les feuilles de styles:
- style.css :
ajouter dans la balise html, body {}
html, body {
height: 100%;
...
}
ajouter dans la balise #xo-wrapper {}
#xo-wrapper {
min-height:100%;
}
ajouter dans la balise #xo-canvas {}
#xo-canvas {
min-height:100%;
...
}
- layout-soup.css :
remplacer la balise * html #xo-page {} par
* html #xo-page #xo-wrapper #xo-canvas {
height: 100%;
}
Maintenant pour finir on va modifier le fichier theme.html
- voici l'original
<div id="xo-wrapper" class="<{$xoops_dirname}>">
<div id="xo-bgstatic" class="<{$xoops_dirname}>"></div>
<div id="xo-canvas"<{if $columns_layout}> class="<{$columns_layout}>"<{/if}>>
- et voici apres les modifs
<div id="xo-canvas"<{if $columns_layout}> class="<{$columns_layout}>"<{/if}>>
<div id="xo-wrapper" class="<{$xoops_dirname}>">
<div id="xo-bgstatic" class="<{$xoops_dirname}>"></div>
Tester et maintenant le site devrait descendre jusqu'au bas de page mais pas le footer.
Du coup au niveau de la balise footer
- avant :
<div id="xo-footer">
<!-- link for valid w3c -->
<div class="validw3c"><a href="http://validator.w3.org/" title="<{$smarty.const.THEME_VALIDXHTML}>"><img src="<{xoImgUrl img/w3c-xhtml.gif}>" alt="<{$smarty.const.THEME_VALIDXHTML}>" /></a><br /><a href="http://jigsaw.w3.org/css-validator/check/referer" title="<{$smarty.const.THEME_VALIDCSS}>"><img src="<{xoImgUrl img/w3c-css.gif}>" alt="<{$smarty.const.THEME_VALIDCSS}>" /></a></div>
<!-- end valid w3c link -->
<!-- link for rss -->
<div class="rss"><a href="<{xoAppUrl backend.php}>" title="<{$smarty.const.THEME_RSS}>"><img src="<{xoImgUrl icons/action/feed.png}>" alt="<{$smarty.const.THEME_RSS}>" /></a></div>
<!-- end rss link -->
<!-- infos sur le designer -->
<div class="design"><{$smarty.const.THEME_DESIGNER}></div>
<!-- fin des infos designer -->
<!-- infos 'pied de page' défini dans les préférences du site -->
<div class="copyright"><{$xoops_footer}></div>
<!-- fin des infos 'pied de page' défini dans les préférences du site -->
</div>
</div>
<!--{xo-logger-output}-->
</div>
</body>
</html>
- Après modification :
</div>
<!--{xo-logger-output}-->
</div>
<div id="xo-footer">
<!-- link for valid w3c -->
<div class="validw3c"><a href="http://validator.w3.org/" title="<{$smarty.const.THEME_VALIDXHTML}>"><img src="<{xoImgUrl img/w3c-xhtml.gif}>" alt="<{$smarty.const.THEME_VALIDXHTML}>" /></a><br /><a href="http://jigsaw.w3.org/css-validator/check/referer" title="<{$smarty.const.THEME_VALIDCSS}>"><img src="<{xoImgUrl img/w3c-css.gif}>" alt="<{$smarty.const.THEME_VALIDCSS}>" /></a></div>
<!-- end valid w3c link -->
<!-- link for rss -->
<div class="rss"><a href="<{xoAppUrl backend.php}>" title="<{$smarty.const.THEME_RSS}>"><img src="<{xoImgUrl icons/action/feed.png}>" alt="<{$smarty.const.THEME_RSS}>" /></a></div>
<!-- end rss link -->
<!-- infos sur le designer -->
<div class="design"><{$smarty.const.THEME_DESIGNER}></div>
<!-- fin des infos designer -->
<!-- infos 'pied de page' défini dans les préférences du site -->
<div class="copyright"><{$xoops_footer}></div>
<!-- fin des infos 'pied de page' défini dans les préférences du site -->
</div>
</body>
</html>
Le footer est desormais en dehors de la page, il faut donc modifier le CSS pour remedier a ça
Dans le fichier style.css
remplacer dans la balise #xo-footer {}
margin: 0;
par
margin: -41px 0 0 0;
Et pour enlever la couleur blanche du fond histoire de vraiment pousser les modification pour ce petit tutos
Remplacer dans la balise #xo-canvas {}
background-color: #fff;
par
background-color: #c6c7c9;
Et voila votre theme
edit : Pfiou et ben la voici l'explication
.
Si Kris le désire je peu lui passer un zip de Morpho modifier.
Et surtout bon week end
