AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

Le Deal du moment : -17%
Casque de réalité virtuelle Meta Quest 2 ...
Voir le deal
249.99 €

    Page d'accueil Rose/Violet/Blanc pastel

    Cheshire Cat
    Cheshire Cat
    FémininAge : 26Messages : 975

    Dim 19 Fév 2017 - 14:48



    Bonjour à vous tous !
    Aujourd'hui je suis là pour vous proposer une petite PA toute gentille.

    Si vous rencontrez un problème avec ce libre service, n'hésitez pas à demander de l'aide dans la section Problème avec mon code. De plus, vous pouvez vous référer à la section Personnalisations si jamais vous n'y connaissez rien en codage et que vous avez du mal à changer les couleurs et autres.

    Rendu en image:

    Optimisé pour tous les navigateurs - Toutes versions

    Pour installer votre Page d'Accueil, il vous faudra aller créer une page HTML. Faites Panneau d'administration > Affichage > Images et Couleurs > Couleurs > Feuille de style CSS et copiez le code qui va suivre dans votre feuille de style
    Code:
    /* Commande de Page d'accueil par Cheshire Cat */
          .inline{
             display:inline-block;
             vertical-align:top;
          }
          .PA{
             background-color:#f1ead6;
             width:800px;
             margin:20px auto;
             padding:10px 20px 20px 20px;
             box-sizing:border-box;
             box-shadow:1px 1px 3px #b1a9a9;
             border-radius:30px;
             font-family:calibri;
             font-size:13px;
             color:#674b4b;
          }
          .PA a{
             color:#de8585;
             transition:all 400ms;
          }
          .PA a:hover{
             color:#8a4c4c;
          }
          .PA h1{
             margin:0 -20px 10px;
             padding-bottom:10px;
             text-align:center;
             font-weight:normal;
             font-size:40px;
             border-bottom:2px solid #b79f9f;
             font-family:'Montez';
          }
          .PA h2{
             margin:0 20px 10px;
             text-align:center;
             font-weight:normal;
             font-size:30px;
             border-bottom:2px solid #b79f9f;
             font-family:'Montez';
          }
          .PA-Gauche{
             width:250px;
          }
          .contexte{
             height:240px;
             margin-bottom:20px;
             padding:10px;
             background-color:#f9f7f7;
             box-shadow:1px 1px 3px #b1a9a9;
             border-radius:20px;
             overflow:auto;
             text-align:justify;
             line-height:16px;
          }
          .PA-Droite{
             width:480px;
             margin-left:20px;
          }
          .staff-votes{
             width:235px;
             margin-right:20px;
          }
          .staff{
             padding:0 10px;
             margin-bottom:10px;
          }
          .infobulle{
             position:relative;
             width:100px;
             height:100px;
             overflow:hidden;
             border-radius:10px;
             background-color:#EFEFEF;
             box-shadow:1px 1px 3px #b1a9a9;
          }
          .infobulle:first-of-type{
             margin-right:10px;
          }
          .infobulle > img{
             width:100%;
          }
          .infobulle div{
             position:absolute;
             top:100px;
             left:0;
             width:100px;
             height:100px;
             padding:10px;
             box-sizing:border-box;
             background-color:#fbf7f7;
             text-align:center;
             font-size:15px;
             line-height:25px;
             opacity:0;
             transition:all 600ms;
          }
          .infobulle:hover div{
             top:0;
             opacity:0.9;
          }
          .votes{
             text-align:center;
             font-size:0;
          }
          .votes img{
             margin:0 3px;
          }
          .nouveautes{
             width:200px;
             height:190px;
             margin-bottom:10px;
             padding:10px;
             overflow:auto;
             background-color:#f9f7f7;
             box-shadow:1px 1px 3px #b1a9a9;
             border-radius:20px;
             text-align:justify;
             line-height:20px;
          }
          .partenaires{
             padding:10px;
             background-color:#f9f7f7;
             box-shadow:1px 1px 3px #b1a9a9;
             border-radius:20px;
             text-align:center;
             line-height:17px;
          }
          #boxe_defil {
             position:relative;
             height:31px;
             overflow:hidden;
          }
          #defile {
             position:absolute;
             margin-top:1px;
             background-color:transparent;
          }
          .credits{
             font-size:10px;
             padding:0 20px;
          }

    Ensuite dirigez vous dans Affichage > Page d'Accueil > Généralités. Copiez le code qui va suivre et collez-le dans la zone.
    Code:
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montez" />      
    <div class="PA">
            
     <h1>
     Namaste {USERNAME}
     </h1>
            
     <div class="inline PA-Gauche">
                
     <h2>
     Contexte
     </h2>
                
     <div class="contexte">
                   En se réveillant un matin après des rêves agités, Gregor Samsa se retrouva, dans son lit, métamorphosé en un monstrueux insecte. Il était sur le dos, un dos aussi dur qu’une carapace, et, en relevant un peu la tête, il vit, bombé, brun, cloisonné par des arceaux plus rigides, son abdomen sur le haut duquel la couverture, prête à glisser tout à fait, ne tenait plus qu’à peine. Ses nombreuses pattes, lamentablement grêles par comparaison avec la corpulence qu’il avait par ailleurs, grouillaient désespérément sous ses yeux. « Qu’est-ce qui m’est arrivé ? » pensa-t-il. Ce n’était pas un rêve.            
     </div>
                
     <div class="credits">
                   ©️ PA codée par Cheshire Cat de <a href="http://epicode.bbactif.com/">Epicode</a> et <a href="http://www.never-utopia.com">N-U</a><br />            
     </div>
            
     </div>
            
     <div class="inline PA-Droite">
                
     <div class="inline staff-votes">
                  
     <h2>
     Staff
     </h2>
                  
     <div class="staff">
                      
     <div class="infobulle inline">
                         <img alt="Pseudo" src="https://i37.servimg.com/u/f37/19/61/08/98/avamoi10.jpg" />                    
     <div>
                            Alrun<br />                        Fondatrice<br />                        <a href="#">Profil</a> - <a href="#">MP</a>                    
     </div>
                      
     </div>
                      
     <div class="infobulle inline">
                         <img alt="Pseudo" src="http://img11.hostingpics.net/pics/675085toto.png" />                    
     <div>
                            Tomgoku<br />                        Fondateur<br />                        <a href="#">Profil</a> - <a href="#">MP</a>                    
     </div>
                      
     </div>
                  
     </div>
                  
     <h2>
     Top-sites
     </h2>
                  
     <div class="votes">
                      <a href="#"><img alt="Top-site" src="https://i37.servimg.com/u/f37/19/61/08/98/space_10.gif" /></a>                  <a href="#"><img alt="Top-site" src="https://i37.servimg.com/u/f37/19/61/08/98/space_10.gif" /></a>                  <a href="#"><img alt="Top-site" src="https://i37.servimg.com/u/f37/19/61/08/98/space_10.gif" /></a>                  <a href="#"><img alt="Top-site" src="https://i37.servimg.com/u/f37/19/61/08/98/space_10.gif" /></a>              
     </div>
                
     </div>
                
     <div class="inline">
                  
     <h2 class="">
     Nouveautés
     </h2>
                  
     <div class="nouveautes">
                   00/00/0000 - Texte descriptif ou lien<br />               00/00/0000 - Texte descriptif ou lien<br />               00/00/0000 - Texte descriptif ou lien<br />               00/00/0000 - Texte descriptif ou lien<br />               00/00/0000 - Texte descriptif ou lien<br />               00/00/0000 - Texte descriptif ou lien<br />              
     </div>
                
     </div>
                
     <h2>
     Partenaires
     </h2>
                
     <div class="partenaires">
                  
     <div id="boxe_defil">
                      
     <div id="defile">
                         <a href="http://feminin-pluriel.discutland.net/"><img title="Féminin Pluriel" alt="Féminin Pluriel" src="http://img110.xooimage.com/files/d/b/6/logo-5185e32.gif" /></a>                     <a href="http://www.ouaf-ouaf-pub.com/"><img title="Ouaf Ouaf Pub" alt="Ouaf Ouaf Pub" src="http://image.noelshack.com/fichiers/2016/42/1476784253-oop-kit88.gif" /></a>                     <a href="http://voyances-ombeline.forumgratuit.be/"><img title="Au delà des voyances" alt="Au delà des voyances" src="http://i18.servimg.com/u/f18/11/27/81/85/logo_811.png" /></a>                     <a href="http://dream-pub.forumactif.fr/"><img title="Dream Pub" alt="Dream Pub" src="http://i68.tinypic.com/2n9hnrc.jpg" /></a>                     <a href="http://lecture-publicites.forumactif.com/"><img title="Lecture et publicités" alt="Lecture et publicités" src="https://i37.servimg.com/u/f37/19/58/81/65/logo_810.png" /></a>                  
     </div>
                  
     </div>
                   <script type="text/javascript">
                   var defile;// l'element a deplacer
                   var psinit = 480; // position horizontale de depart
                   var pscrnt = psinit;      
                   function texteDefile() {
                      if (!defile) defile = document.getElementById('defile');
                      if (defile) {
                         if(pscrnt < ( - defile.offsetWidth) ){
                            pscrnt = psinit;
                               } else {
                         pscrnt+= -1; // pixel par deplacement
                      }
                         defile.style.left = pscrnt+"px";
                      }
                   }
                   window.setInterval("texteDefile()",20); // delai de deplacement
                   </script>            
     </div>
            
     </div>
          
    </div>

    Vous avez le droit de poster pour dire un p'tit "merci", ça fait toujours plaisir ! Very Happy
    Plume Rusée
    Plume Rusée
    FémininAge : 18Messages : 13

    Sam 29 Juil 2017 - 16:04

    Merci elle est magnifique !
    Onyx
    Onyx
    FémininAge : 30Messages : 3350

    Lun 18 Sep 2017 - 20:16

    Salut !

    C'est parfait, je déplace dans les LS ^^

    Note : J'ai ajouté "N-U" dans les crédits puisqu'il est affiché ici ainsi que sur Épicode.



    Anonymous
    Invité

    Lun 18 Sep 2017 - 23:24

    Merci pour le partage !
    Patou972
    Patou972
    FémininAge : 45Messages : 175

    Ven 1 Déc 2017 - 21:49

    Merci beaucoup pour le partage
    Réglisse
    Réglisse
    FémininAge : 20Messages : 17

    Lun 18 Juin 2018 - 18:32

    Mercii. :heart:
    azertyuiop2007
    azertyuiop2007
    FémininAge : 22Messages : 4

    Sam 23 Juin 2018 - 12:29

    Merci mille fois, je met ça sur mon fofo ! C'est magnifique **
    CiitronxMelon
    CiitronxMelon
    FémininAge : 29Messages : 36

    Mar 17 Juil 2018 - 22:56

    Wow merci !
    Féli
    Féli
    FémininAge : 41Messages : 117

    Sam 12 Jan 2019 - 12:43

    merci



    css - Page d'accueil Rose/Violet/Blanc pastel MtGPjQFSeHqzl1zoiU-5zwGCNig
    Bowtie
    Bowtie
    FémininAge : 34Messages : 62

    Dim 3 Mar 2019 - 23:10

    Merci pour cette belle PA ^^
    angel-insider
    angel-insider
    FémininAge : 42Messages : 15

    Jeu 14 Mar 2019 - 18:06

    merci beaucoup je l ai utilisé pour mon forum et j ai bien entendu laissé les credits :)



    css - Page d'accueil Rose/Violet/Blanc pastel Angelb10
    La Reine de Coeur
    La Reine de Coeur
    FémininAge : 25Messages : 30

    Lun 10 Juin 2019 - 11:01

    merci beaucoup pour le partage ^^
    Cath Graph
    Cath Graph
    FémininAge : 59Messages : 26

    Lun 24 Juin 2019 - 9:21

    Merci, j'aime beaucoup



    css - Page d'accueil Rose/Violet/Blanc pastel Signat10
    P'tit loup
    P'tit loup
    MasculinAge : 41Messages : 451

    Ven 6 Mar 2020 - 17:48

    Une PA toute simple qui ne manque pas de charme pour autant, c'est exactement ce qu'il me fallait, merci Cheshire ^^



    css - Page d'accueil Rose/Violet/Blanc pastel 30xivrd
    Marina80
    Marina80
    FémininAge : 43Messages : 2

    Sam 16 Mai 2020 - 15:59

    Il est superbe. Merci beaucoup.
    ninouee
    ninouee
    FémininAge : 42Messages : 143

    Mer 5 Aoû 2020 - 20:01

    Merci



    css - Page d'accueil Rose/Violet/Blanc pastel Robert12
    Irys
    Irys
    FémininAge : 34Messages : 147

    Dim 8 Nov 2020 - 19:17

    Un graaaaaaaaaaaaand merci de ma part et ma co-admin parce qu'on avait beaucoup la flemme de coder une PA et celle-ci est juste parfaite, pile ce qu'on cherchait. <3 Bon on y a ajouté notre petite touche personnelle mais en tout cas, elle nous convient super bien !




    Waht is your name?
    Contenu sponsorisé


      La date/heure actuelle est Jeu 28 Mar 2024 - 13:59