Navigation Supermint

Navigation fixe

Modification du css
packages>themes_super_mint>themes/super_mint/stylesheets/screen.css

Modification de #fixed-top: ajout de "position:fixed;width:100%;"
pour #top ajout de "position:fixed;top:155px;width:100%;"

On a alors rencontre un probleme avec le footer. Pour le régler:
Dans #footerpush on a ajouté "top:80px; position:relative;"

Navigation fixe 2

Pour fixer le header, ajouter à la fin du fichier theme_super_mint/elements/override.css.php :
#fixed-top {
    position:fixed;
    width:100%;
}
#top_nav{
    position: fixed;
    width: 100%;
}
#footerpush{
    position: relative;
}
#top{
    position: fixed;
    width: 100%;
}
 
Afin d'adapter la position de la barre de navigation et du reste de la page en fonction du contenu du header, ajouter le script suivant dans le fichier theme_super_mint/themes/super_mint/elements/header.php :
$(document).ready(function(){
    var ccm_height = 0;
    if($("#ccm-toolbar").length){
        ccm_height = $("#ccm-toolbar").height();
    }
    var nav_height = $("#top_nav").height();
    var top_height = $("#fixed-top").css("top",ccm_height+"px").height();
    var header_height = $("#top+.full-width-header").height();
    var top = top_height-header_height+nav_height;
    $("#top_nav").css("top",(top_height+ccm_height)+"px");
    $("#middle").css("top",top+"px");
    $("#bottom").css("top",top+"px");
    $("#footerpush").css("top",top+"px");
    $("#top").css("top",(top+nav_height)+"px");
});
 

Navigation fixe parametrable

ajout du bouton dans les options /single_pages/dashboard/theme_super_mint_options/theme_options.php l 93

array(
"name" => t("Fixed header"),
"desc" => t("test"),
"id" => "fixed_header",
"value"=>'options',
"activated" => false,
"type" => "toggle"
),

une fois qu'on appui sur "save" dans les parametres avec le nouveau bouton activé:
le nom du bouton est stocké dans la base de donné grace à un appel à la fonction save_options() définie dans la classe ThemeSuperMintOptions dans le fichier /models/theme_super_mint_options.php
donc sauvegardé dans la table SuperMintThemeSuperMintOptionsPreset à la ligne où option_key = "options" et avec le pID correspondant à l'ID du preset choisit tout en haut de la page des parametres. (les ID se trouvent dans la table : SuperMintThemePreset)

ajout des conditions dans les fichiers /elements/override.css.php et /themes/super_mint/elements/header.php
toutes les options du thème choisi sont présentes dans la variable $o. les options qui sont compris dans la ligne "options" de la base de donnés sont accessible en les précédant avec "__".
on entoure donc les modifications apportés pour fixer le header avec ce morceau de PHP:
<?php if($o->__fixed_header) : ?>
/* code */
<?php endif ?>

Header lateral parametrable

 

modifier le fichier theme_super_mint/single_pages/dashboard/theme_super_mint_options/theme_options.php et y ajouter le code suivant à la ligne 101:

array(
"name" => t("Sidebar header"),
"desc" => t("test"),
"id" => "sidebar_header",
"value"=>'options',
"activated" => false,
"type" => "toggle"
),

se rendre ensuite dans le fichier theme_super_mint/themes/super_mint/elements/header.php et ajouter le code suivant juste après la balise <body>:

<?php if($o->__sidebar_header) : ?>
<div id="side-header" class="header-background">
<header>
<div class="header-background">
<div class="container">
<div class="four columns alpha logo-content">
<a href="<?php echo DIR_REL?>/">
<?php
$a = new GlobalArea('Side Site Logo');
$a->display();
?>
</a>
</div><!--end-of-logo-content-->
<div class="clear header-spacer" style="height:80px;"></div>
<div id="side-navigation">
<?php
$a = new GlobalArea('Side Header nav');
$a->display();
?>
<?php
$a = new Area('Side Header nav locale');
$a->display($c);
?>
</div><!--end-of-side-naviation-->
<div class="clear header-spacer" style="height:80px;"></div>
<div id="side-bottom">
<?php
$a = new Area('Side bottom');
$a->display($c);
?>
</div>
</div><!--end-of-container-->
</div>
</header> <!--end-of-header-->

</div>

<style>
#side-header{
position:fixed;
<?php if($c->isEditMode()) { ?>
width:250px;
<?php } else { ?>
width:75px;
<?php } ?>
height:100%;
z-index: 5;
white-space: nowrap;
overflow: hidden;

}
.header-background{
position:inherit;
}
.logo-content{
width:100% !important;
}
#pagewrapper{
<?php if($c->isEditMode()) { ?>
margin-left:250px;
<?php } else { ?>
margin-left:75px;
<?php } ?>
}
#nav-menu{
width: 100%;
margin-left: 0;
}
.logo-content img {
max-width: inherit;
}
#side-bottom{
position:absolute;
width:100%;
<?php if($u -> isLoggedIn ()) { ?>
bottom:50px;
<?php } else { ?>
bottom:0;
<?php } ?>
overflow: hidden;
}

body{
overflow-x: hidden;
}
</style>
<?php if(!$c->isEditMode()) { ?>
<script>
$(document).ready(function(){
$("#side-header").hover(function() {
$(this).stop().animate({
width: "250px"
});
$("#pagewrapper").stop().animate({
"margin-left": "250px"
});
}, function() {
$(this).stop().animate({
width: "75px"
});
$("#pagewrapper").stop().animate({
"margin-left": "75px"
});
});
})
</script>
<?php } ?>
<?php endif ?>