1. Ce site utilise des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation des cookies. En savoir plus.
  1. ѕι∂яα∂ι

    ѕι∂яα∂ι Administrateur

    Messages:
    13 862
    J'aime reçus:
    70 385
    Points:
    8 543
    Salut communauté iHax ,

    On se retrouve pour un nouveau Tutorial xenForo.
    Ce tutoriel vous permet de cacher/afficher la barre latérale.

    Avant :

    upload_2016-7-30_6-1-49.png

    Après :

    upload_2016-7-30_6-2-6.png

    Dans le template EXTRA.CSS vous allez ajouter :

    Code:
    .sidebar_mini {
    background: #f0f7fc url('styles/default/xenforo/gradients/category-23px-light.png') repeat-x top;
    background-image: url('styles/sidebar_toggle.png');
    border: 1px solid #a5cae4;
    background-position: 50% 0;
    border-radius: 5px;
    float: right;
    margin-left: 5px;
    padding-left: 3px;
    padding-right: 3px;
    overflow: hidden;
    position: relative;
    width: 17px;
    height: 24px;
    background-repeat: no-repeat;
    }
    
    .sidebar_mini a{
        display: block;
        height: 24px;
    }
    
    .sidebar_mini.sidebar_expand{
        background-position: 50% -24px;
    }
    
    .mainContainer.no_sidebar,
    .mainContent.no_sidebar{ margin-right: 0; }
    
    .sidebar_collapse {
        position: absolute;
        right: -6px;
        top: 2px;
        z-index: 1;
    }
    <xen:if is="@enableResponsive">
    @media (max-width:@maxResponsiveNarrowWidth) {
    .sidebar_mini {
    display: none;
    }}
    @media (max-width:@maxResponsiveMediumWidth) {
    .sidebar_mini {
    display: none;
    }}
    </xen:if>
    NB : Vous pouvez editer le CSS de la classe : .sidebar_mini pour s'adapter aux couleurs de votre thème.

    Dans l'adminCP / Apparence / Modifications de template / + Créer une modification de template

    Template: breadcrumb
    Clé de la modification: Sidebar_Collapse_1
    Trouver:
    Code:
    <nav>
    Remplacer:
    Code:
    $0
    <xen:if is="{$contentTemplate} != 'forum_list'">
    <xen:else />
    <div class="sidebar_mini Tooltip" title="Sidebar"><a href="#"></a></div>
    </xen:if>
    
    Puis vous sauvegarder la modification de template, et vous créer une nouvelle :

    Template: page_container_js_head
    Clé de la modification: Sidebar_Collapse_2
    Trouver:
    Code:
    <!--XenForo_Require:JS-->
    Remplacer:
    Code:
    <script type="text/javascript" src="js/sidebar.js"></script>
    Maintenant et en dernier lieu vous allez télécharger le pack en pièces jointes et le mettre sur votre FTP ! Il contient : sidebar_toggle.png et sidebar.js

    Ce Tutorial touche à sa fin.

    A très bientôt. :neo:
     

    Fichiers jointes:

  2. striarc

    striarc

    Messages:
    23
    J'aime reçus:
    2
    Points:
    533
    merci merci merci merci
     
    ●●●Outils
  3. MihB21

    MihB21

    Messages:
    7
    J'aime reçus:
    0
    Points:
    21
    hey thank you for modification template!!
     
    ●●●Outils