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

Limiter la taille de la sidebar

Discussion dans 'Vos demande de Code/Script pour CraftMyWebsite' créé par Mario359, 10 Août 2015.

MineStrator, Votre hébergeur de serveur minecraft
  1. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    Bonjour,
    Je voudrai savoir si il y a un moyen de limiter la largeur de la sidebar,
    La longueur je m'en fiche, elle peut être longue, je veut juste que sur les grands écrans comme les télévisions, la sidebar ne soit pas aussi grosse
    Sur un portable, la largeur de la sidebar est petite, cela me convient mais sur grand écran je ne veut pas quelle dépasse 300 pixels de largeur
    J'espère avoir été assez clair :rolleyes:
     
  2. AngryKiller

    AngryKiller ✬ Maréchal ✬

    1 037
    159
    63
    Pour cela va falloir un pro du Responsive, ce qui n'est malheureusement pas mon cas
     
  3. Hexday18

    Hexday18 Commandant

    669
    76
    28
    Je peux te le faire et non pas besoin d'un pro du responsive un peu de css et c'est bon.
     
    • Gagnant ! Gagnant ! x 1
  4. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    Up ! J'ai chercher et j'ai pas trouvé :(
     
  5. barbierp

    barbierp Soldat

    16
    3
    3
    Le CMS utilise bootstrap. Donc tu peux changé le code html en modifiant les class et en utilisant :
    col-xs-*, col-sm-*, col-md-* et col-lg-*

    Je t'explique vite fait ces class. En gros xs = petit écran, sm, = tablette, md = ordinateur portable et lg = grand écran.
    Tu dois ajouté ces class à ta div de slidebar en choisissant la taille que tu souhaite et en remplacent "*" par un chiffre que tu veux entre 1 et 12.
    Car avec bootstrap, ta page est divisé en 12 de large.

    J'espère avoir pu t'aider :)

    h4ckr035
     
    • J'aime J'aime x 1
  6. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    D'accord mais je dois faire quoi en gros, il faut que je modifi un fichier ?
     
  7. barbierp

    barbierp Soldat

    16
    3
    3
    Excuse moi je n'étais pas chez moi je n'ai pas pu répondre avant.
    Je regarde ça et si je trouve je t'explique comment faire. Laisse moi juste un petit peu de temps histoire de me replonger dans le code de craftmywebsite :)
     
    • J'accepte J'accepte x 1
  8. barbierp

    barbierp Soldat

    16
    3
    3
    Au final pas besoin d'utiliser bootstrap, encore plus facile !
    Tu as juste à aller dans ton fichier : /theme/default/pages/accueil.php
    Et aux lignes 51 et 61, tu as 2 valeurs width qui sont à 100%, tu as donc juste à réduire ce pourcentage, à enregistrer et réenvoyer sur ton ftp.
    Une fois ceci fait, tu pourra voir la différence en rafraîchissant la page de ton site :)
     
  9. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    D'accord, j'essaierai demain après-midi
     
  10. barbierp

    barbierp Soldat

    16
    3
    3
    Ca marche ! tient moi au courant :)
     
  11. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    ça n'a pas marché, ça a juste raccourci la taille de ... du carousel slide, je crois que ça ce dit comme ça, je ne pense pas que le code de la sidebar est dans la page accueil.php
    PHP:
            <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                                <ol class="carousel-indicators" style="bottom: 0px;">
                                <?php for($i 0$i $iSliders$i++) { ?>
                                    <li data-target="#carousel-example-generic" data-slide-to="<?php echo $i?><?php if($i == 0) echo 'class="active"'?>></li>
                                <?php ?>
                                </ol>

                                <div class="carousel-inner">
                                <?php for($i 0$i $iSliders$i++) { ?>
                                    <div class="item <?php if($i == 0) echo 'active'?>">
                                        <img src="theme/upload/slider/<?php echo $sliders[$i]['image']; ?>" alt="L'image charge, si ce message reste trop longtemps, rechargez votre navigateur !">
                                        <div class="carousel-caption">
                                            <span style="font-size:16px"><span style="color:#FFFF00"><span style="font-family:Minecraftia,helvetica,sans-serif"><?php echo $sliders[$i]['message']; ?></span></span></span>
                                        </div>
                                    </div>
                                <?php ?>
                              </div>

                                    <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
                                        <span class="glyphicon glyphicon-chevron-left"></span>
                                    </a>
                                    <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
                                        <span class="glyphicon glyphicon-chevron-right"></span>
                                    </a>
                                </div>
    (J'ai modifié des choses)
     
  12. barbierp

    barbierp Soldat

    16
    3
    3
    Ah ba je croyais que c'était ça que tu voulais faire moi :/ raccourcir le slider en largeur ?
     
  13. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    Je veut raccourcir la largeur de la sidebar, la zone à droite sur toutes les pages
    Merci de vous Connecter/S'inscrire pour voir les liens.
     
  14. barbierp

    barbierp Soldat

    16
    3
    3
    Ah !! Tu parle des widget ! :) Désolé j'avais mal compris ta question :Banghead:
    Je vois ca dès que je rentre chez moi
     
    • J'accepte J'accepte x 1
    Dernière édition: 5 Septembre 2015
  15. barbierp

    barbierp Soldat

    16
    3
    3
    Du coup je viens d'arriver chez moi j'ai regardé vite fait et si cette fois j'ai bien compris ce que tu voulais, tu dois modifier le fichier them/tonthem/index.php
    Change la ligne 66 en : <div class="col-md-10">
    et la ligne 86 en : <div class="col-md-2">

    Biensur tu peux changer les numéros 10 et 2 pour modifier la largeur de la partie droite et du milieu mais attention ! le total de ces 2 chiffres doit être égale à 12 sinon ton site sera décalé vers la gauche.
    En esperant t'avoir aidé, si tu as une autre question n'hésite pas :)
     
  16. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    Ça marche très bien , merci :Happy: !
    Encore une question, est-ce possible de mettre ceci ? :
    Ligne 66 : <div class="col-md-7,5">
    Ligne 86 : <div class="col-md-4,5">
     
  17. barbierp

    barbierp Soldat

    16
    3
    3
    Non, bootstrap ne permet pas de faire des demi carrés dans son cadrillage :)
    Si tu as des soucis au niveau des différentes tailles d'écran, utilise ça : col-xs-*, col-sm-*, col-md-* et col-lg-*
     
  18. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    Et je le met où ça ?
     
  19. barbierp

    barbierp Soldat

    16
    3
    3
    Exemple pour la ligne 86 : <div class="col-xs-2, col-sm-4, col-md-4 et col-lg-8">
    J'ai mit des nombres bidons mais c'est juste pour te donner un exemple.
    xs = écran de téléphone, sm = tablette, md = écran moyen d'ordi portable et lg = grand écran.
    Donc tu peux changer les nombres pour adapter la taille de sidebare en fonction de la taille de l'écran.
    Mais bon je ne pense pas que tu t'en servira, à mon avis il faut mieux laisser comme ça.
     
    • J'aime J'aime x 1
  20. Mario359

    Mario359 ✬ Maréchal ✬

    1 021
    144
    63
    D'accord,
    merci pour tout !!
     

Partager cette page

Chargement...