• Thèmes en libre service (LS)

    Merci de créditer avant de prendre les thèmes, et aussi d'aller lire le règlement.

    10 thèmes en libre service pour l'instant

    Si vous préférez quelque chose de plus personnel, vous pouvez toujours passer une commande (dans le cas où les commandes de thèmes sont acceptées).

    Vous pouvez essayer les thèmes avec le blog de démonstration d'eklablog (sans oubliez de toujours remettre toutes les valeurs à zéro avant d'appliquer les codes) !

     

  • Code thème en LS 10

     

    Les Codes

    @font-face {font-family: "Master";

    src: url('http://ekladata.com/UKntiAf8XrBrQ19P8hVHaR201Bg/master_of_break.otf');}

    @font-face {font-family: "SF";
    src: url('http://ekladata.com/tjayi-v3IbuMqxhkUJTKWbAAqQQ/SF-New-Republic.ttf');}

    @font-face {font-family: "round";
    src: url('http://ekladata.com/3CTUswhiEj245cn85IhQtNDqWyE/Rounded_Elegance.ttf');}

    /*--fond fenêtre--*/
    #body {word-wrap: break-word;
    background: #f5f5f5:}
    #body a {text-decoration: none;}

    /*--fond page--*/
    #background {margin-top: 70px;
    width: 1120px;
    background: white;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.5);}

    /*--header--*/
    #header {height: 235px;
    background: url('http://ekladata.com/MmWe8-M5-DqroV0C5nVeq9ZEZ-E.jpg') 50% 0% no-repeat, #424953;}
    #titre_header {text-align: left;
    position: relative;
    top: 20px;
    left: 50px;
    color: black;
    font-size: 45pt;
    font-family: Master;
    -webkit-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
    -o-transform: rotate(-5deg);
    transform: rotate(-5deg);}

    #titre_header a {color: white;
    text-shadow: -1px -3px 0px #19d9c8;}

    #titre_header a:hover {text-decoration: none;}
    #header-link {display: inline-block;}

    /*--menu header--*/
    #menu {width: 1120px;
    top: 190px;
    left: 0px;
    height: 45px;
    font-family: 'SF';
    font-size: 18pt;
    line-height: 220%;}

    #menu a {display: inline-block;
    width: 100%;
    padding: 0px 10px 0px 10px;
    color: #f7f7f7;
    text-shadow: 1px 1px 0px black;}

    #menu li {height:45px;}

    #menu li:hover {background: #ffa68a;}

    #menu ul {background: #ffa68a;
    position: absolute;
    margin-top: -7px;
    width: 180px;}

    #menu ul li {height: 25px;}

    #menu ul a {width: 170px;
    padding: 3px 5px 3px 5px;
    -webkit-transition-duration: 0.1s;
    -moz-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;}

    #menu ul a, #menu ul a:hover {font-size: 12pt;
    display: inline-block;
    line-height: 100%;
    position: absolute;
    margin-top: 0px;
    width: 165px;}

    #menu ul a:hover {padding-left: 25px;
    width: 150px;
    -webkit-transition-duration: 0.1s;
    -moz-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;}

    /*--menu1--*/
    #menu1 {width: 300px;
    background: #e3e3e1;
    padding: 40px 17px 40px 17px;
    font-family: round;}
    #menu1 a {color: #c095b0;}
    #menu1 a:hover {color: white;}
    #menu1 .module_menu_titre {height: 100%;
    background: #d1d1d1;
    padding: 15px;
    font-family: SF;
    font-size: 14pt;
    text-align: center;
    color: #44474a;}
    #menu1 .module_menu_contenu {padding: 15px 0px 30px 0px;}

    /*--recherche--*/
    .module_menu_type_search .module_menu_titre {display: none!important;}
    .module_menu_type_search .module_menu_contenu {background: none!important;
    border-bottom: none!important;}
    .module_menu_type_search [type="submit"] {display: none;}
    .module_menu_type_search input[type="text"] {height: 30px;
    width: 89%;
    padding-left: 30px!important;
    color: #333!important;
    border-radius: 5px;
    box-shadow: none;
    border: none;
    background: white;
    background-image: url('http://ekladata.com/6EDQP4lbqPa5Ex3AiysuQq_TLXI.png')!important;}

    /*--module dernier visiteurs--*/
    .module_menu_type_lastvisitors img {width: 60px;
    height: 60px;
    border-radius: 60px;
    margin: 5px;}
    /*--article--*/
    #content {width: 690px;
    margin: 40px;
    font-family: round;}
    /*-titre d'article-*/
    .module_titre_contenu, .module_titre_contenu a {color: #ffa68a}
    .module_titre_contenu:hover, .module_titre_contenu a:hover {}
    .module_titre_contenu {font-family: SF;
    font-size: 25pt;
    height: 100%;}
    /*-article info-*/
    .article_info {background: #fafafa;
    text-align: right;
    padding: 5px 15px 5px 5px;
    font-size: 8pt;
    margin: 5px 0px 10px 0px;}
    .article_info a {color: #171016!important;}

    .article_info a:hover {color: #ffbfac!important;}
    /*-contenu article-*/
    .module_contenu {color: #171016;
    font-size: 10pt;}
    .article_text {}
    .module_contenu a {color: #83bbe0;}
    .module_contenu a:hover {color: #badaba;}
    .module_bottom {}

    /*--commentaire--*/
    .comment_normal, .comment_admin {width: 100%;
    background: #ddf4f6;
    margin: 25px 0px 25px 0px;
    border-radius: 10px;}

    div.commentheader {height: 30px;
    border-bottom: dashed 1px #424953;
    line-height: 230%;
    font-family: SF;
    text-transform: uppercase;}
    div.commentbody {padding: 10px;}
    .commentbody p {}

    /*-numéro de commentaire-*/
    .commentnumber {font-family: SF;
    padding: 0px 5px 0px 15px;}
    .commentnumber:hover {}

    /*-comment pseudo-*/
    .commentpseudo {font-size: 16px;
    color: white;
    font-weight: normal!important;
    text-shadow: 1px 1px 0px #2f5074;}
    .commentpseudo img {display: none;}
    .commentpseudo a {color: #b8dbb9;
    font-weight: normal!important;
    text-shadow: 1px 1px 0px #2f5074;}
    /*-comment date-*/
    .commentdate {font-size: 7pt;
    letter-spacing: 1px;}
    /*-avatar de commentaire-*/
    .commentavatar {margin-right: -10px;}
    .commentavatar img {border: 2px solid #424953;
    border-radius: 80px 15px / 40px 70px;
    width: 40px;
    height: 40px;}


    /*--bouton--*/
    input[type=button],input[type=submit], button {background: #ffa68a;
    color: white;
    text-shadow: 1px 1px 0px #da7f62;
    text-transform: uppercase;
    font-size: 13pt;
    padding: 5px 10px 5px 10px;
    border: 3px solid #ffa68a;
    border-radius: 5px;
    font-weight: bold;}
    input[type=button]:hover,input[type=submit]:hover, button:hover {color: #ffa68a;
    background: white;
    text-shadow: none;}


    /*--forums--*/
    .post_table {width: 100%;
    background: #fafafa;
    margin: 5px 0px 35px 0px;
    border: 2px solid #424953;}

    .post_table_head {background: #424953;
    height: 35px;
    text-align: right;
    color: #dfdfdf;
    line-height: 250%;
    padding: 0px 10px 0px 0px;}

    .post_table_profile {width: 15%;
    background: #424953;}
    .post_table_profile a {color: white;
    position: absolute;
    margin-top: -30px;
    text-transform: uppercase;
    font-size: 14pt;
    margin-left: 15px;}
    .post_table_profile img {width: 70px;
    height: 70px;
    border-radius: 100px;
    margin: -15px 0px 20px 10px;}

    .post_table_msg {padding: 10px;}
    .forum_table {margin-top: 20px;}
    .forum_table th, .topic_table th{background: #f2c7df;
    font-size: 15px;
    font-weight: bold;
    padding: 5px 0 5px 10px;
    color: white;
    text-shadow: 1px 1px 0px #af8da5;}
    .forum_table tr:nth-child(even), .topic_table tr:nth-child(even){background: #fbfbfb;}
    .forum_table tr:nth-child(odd), .topic_table tr:nth-child(odd){background: #efefef;}
    .forum_table td, .topic_table td {padding: 5px 8px 5px 8px;}

    .forum-description {background: grey;
    color: white;
    padding: 10px;
    margin: 10px 0px 10px 0px;
    border-radius: 5px;}

    /*--footer--*/
    #footer {height: 80px;
    background: #424953;
    color: white;
    text-align: center;
    font-family: arial;
    font-size: 11pt;}
    #footer a {color: white;}
    #footer:after {content: "Header by natjkriss - Design original by Elinae - ©2016";
    color: white;}

    Pour installer le thème

    1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

    2. Choisir un seul menu à droite.

    3. Faites attention au nombre de lien dans le menu du header..

    4. Copier, coller et appliquer les codes CSS du thème proposé.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1.   Si votre titre de blog est entièrement en lettre capitale, ça ne rendra pas bien.

    2. J'ai très peu codé le menu de droite, il est simplissime : si vous voulez le personnalisé : allez-y.

    3. Il vaut mieux choisir 8 derniers visiteurs pour le module "derniers visiteurs".

    4. Vous pouvez utiliser un menu déroulant pour votre menu du header.

      

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    Suite à mon article Les 6 fails de thème avant d'en arriver à la v.15 beaucoup de gens ont apprécié un de ces thèmes, j'ai donc décidé de le coder. En espérant qu'ils servent o/ ! 

    7 Juillet 2016. Le thème est  adapté aux grands écrans (au moins de 1120px de large) - Idée du thème en Janvier 2016


    107 commentaires
  • THÈME EN LIBRE SERVICE #9 - Halloween !

     

    Les Codes

    @font-face {font-family"blackr";
    src:url('http://ekladata.com/3wBEE6uYlSX2F4MaqSkIrj_Cf_U/BLACKR.ttf');}

    @font-face {font-family"Caladea";
    srcurl('http://ekladata.com/V10Z-N0iwp9rcTb0EfxUkzXJwyI/Caladea-Regular.ttf');}

    @font-face {font-family"cambria";
    src:url('http://ekladata.com/seWj_qyi6j3895zLN33nSez2A0M/cambria.ttc');}

    @font-face {font-family"Charlemagne";
    src:url('http://ekladata.com/gkWZQWQsiqBVLceNFiG_ZmE1kJU/CharlemagneStd-Bold.otf');}


    /*--fond fenêtre--*/
    #body {background#c0b7aa;
      word-wrapbreak-word;}
    #body {}

    /*--fond page--*/
    #background {background#32202c;
            width900px;}

    /*--header--*/
    #header {height430px;
        margin-bottom35px;
    background:url('http://ekladata.com/LrTIx7igbL_ShQRF5TeMhsijDpQ.png'50% 0% no-repeat#d46a17;}

    #titre_header {displayinline-block;
        positionrelative;
        top5px;
        left15px;
        text-alignright;
        font-familyblackr;
    colorwhite;
    text-shadow0px 0px 5px rgba(0,0,0,0.8);
    font-size15pt;}

    #titre_header a:hover {text-decorationnone;}

    #header-link {displayinline-block;}

    /*--menu header--*/
    #menu {height30px;
        width900px;
    list-style-typenone;
        margin0px;
        padding0px;
        positionabsolute;
        top400px;
        left0px;
    }

    #menu {width100%;
    color#f2d6c9;
    font-familyCaladea;
    text-transformuppercase;
    font-size15pt;
        height:30px;
    margin0px 0px 0px 7px;
         -webkit-transition-duration0.4s;
                       -moz-transition-duration0.4s;
                       transition-duration0.4s;
    -webkit-transition-timing-functionease-out;
                       -moz-transition-timing-function:ease-out;
                       transition-timing-functionease-out;}

    #menu a:hover {background#f0e7dc;
    color#db689e;
    text-decorationnone;
         -webkit-transition-duration0.08s;
                       -moz-transition-duration0.08s;
                       transition-duration0.08s;
    -webkit-transition-timing-functionease-out;
                       -moz-transition-timing-function:ease-out;
                       transition-timing-functionease-out;}

    #menu ul {positionabsolute;
        margin-left7px;
        background#f0e7dc;
    width250px;}

    #menu ul {color#d0835b;
    font-familycambria;
    text-transformuppercase;
    height100%;
    padding3px 0px 3px 10px;
         background#f0e7dc;
        border0px solid white;
    width240px;
         -webkit-transition-duration0.1s;
                       -moz-transition-duration0.1s;
                       transition-duration0.1s;
    -webkit-transition-timing-functionease-out;
                       -moz-transition-timing-function:ease-out;
                       transition-timing-functionease-out;}

    #menu ul a:hover {width:215px;
            border-left25px solid #db689e;
    background#edd3d2;
    color#d0835b;
         -webkit-transition-duration0.3s;
                       -moz-transition-duration0.3s;
                       transition-duration0.3s;
    -webkit-transition-timing-functionease-out;
                       -moz-transition-timing-function:ease-out;
                       transition-timing-functionease-out;}


    /*--menu1--*/

    #menu1_top {background:url('http://ekladata.com/dRVrhiWMpto1TulasEeUyAkkOaw.png'50% 0%;
    height160px;}


    #menu1_bottom {background:url('http://ekladata.com/uOogEwD13u9xBX7-VuS5zMlc0Js.png'50% 0% no-repeat;
    height30px;}

    #menu1 {background:url('http://ekladata.com/cxwgfj_FN2UNM3bCW01ChMN0L30.png');
        width275px;
        margin-right7px;}

    #menu1 {text-decorationnone;}
    #menu1 a:hover {}

    #menu1 .module_menu_titre {height100%;
        text-aligncenter;
        font-size12pt;
        text-transformuppercase;
        font-family:  charlemagne;
    color#32202c;
    padding0px 37px 0px 30px;
    text-shadow0.3px 1px 2pxrgba(255,255,255,0.3);}

    #menu1 .module_menu_contenu {
    padding0px 37px 0px 30px;
    font-familyCaladea;
    font-size10pt;
    color#32202c;
    margin-bottom21px;}

    /*--recherche--*/
    .module_menu_type_search [type="submit"]{width90%;
    margin-left1%;
        margin-right2%;}

    /*--module recherche--*/

    .module_menu_type_search input[type=text],.module_menu_type_search select,.module_menu_type_search textarea {
    width92%;
    border-radius3px;
    margin-bottom3px;}

    /*--module dernier visiteurs--*/
    .module_menu_type_lastvisitors {}

    .module_menu_type_lastvisitors img {}

    .module_menu_type_lastvisitors img:hover{}

    /*-dernier article-*/

    .module_menu_type_lastarticles a::before{content'>> ';}

    .module_menu_type_lastarticles {color:#dc99ba;}

    .module_menu_type_lastarticles a:hover{colorwhite;}

    .module_menu_type_html {color#dc99ba;}

    .module_menu_type_html a:hover {color:white;}

    .module_menu_type_stats {color#dc99ba;}

    .module_menu_type_stats a:hover {color:white;}

    .module_menu_type_links2 {color:#dc99ba;}

    .module_menu_type_links2 a:hover {color:white;}

    /*- dernier commentaire -*/

    .module_menu_type_lastcomments {color:#dc99ba;
    font-styleitalic;}

    .module_menu_type_lastcomments a:hover{colorwhite;}
    /*- dernier sujet -*/

    .module_menu_type_lasttopics a::before{content'>> ';}

    .module_menu_type_lasttopics {color:#dc99ba;}

    .module_menu_type_lasttopics a:hover {color:white;}

    .module_menu_type_lasttopics {display:none;}

    /*-calendrier-*/

    .module_menu_type_calendar {color:#dc99ba;}
    .module_menu_type_calendar a:hover {color:white;}
    #menu_calendar_month {color#212121;}
    #menu_calendar_month {colorblack;}
    .module_menu_type_calendar thead {text-transformuppercase;
    font-familyarial;
    colorblack;}
    .module_menu_type_calendar tbody tr {color:#212121;}

    .module_menu_type_calendar tbody a{background#604753;
    colorblack;
        font-weightbold;
    border-radius3px;}

    .module_menu_type_calendar tbody a:hover{background#eb995b;
    colorwhite;}

    /*-shoutbox-*/
    .menu_shoutbox {height300px;
        background:url('http://ekladata.com/UYKOXyQJETehq9Lygjys0t8qo5c@206x300.png'50% 50%;
        padding3px;
    border-radius5px;
    color#141414;}

    .menu_shoutbox strong {color#f7cb55;
    font-weightbold;
    text-transformuppercase;}

    .menu_shoutbox hr {width100%;
        height0px;
        margin-bottom8px;
        margin-top5px;}

    .module_menu_type_shoutbox input [type="text"],.module_menu_type_shoutbox select,.module_menu_type_shoutbox textarea{
    margin-top0px;
    backgroundrgba(0,0,0,0.4);
    colorwhite;
    border1px solid black;
    width100%;
    padding3px;}

    .module_menu_type_shoutbox [type="submit"]{bordernone;
        padding2px 0px 1px 0px;
        width100%;
        height20px;
        margin-top0px;}

    /*--module dernier visiteurs--*/
    .module_menu_type_lastvisitors {}

    .module_menu_type_lastvisitors img {width:40px;
    height40px;
    margin5px 13px 10px 13px;}

    .module_menu_type_lastvisitors img:hover{}


    /*--article--*/
    #content {}

    .module_titre_contenu.module_titre_contenu {height100%;
    font-familyblackr;
    font-size30pt;
    color#eb995b;
    line-height73%;
    text-shadow2px 3px 0px rgba(0,0,0,0.5);}

    .module_titre_contenu {
    -ms-transformrotate(-1.2deg)/* IE 9 */
        -webkit-transformrotate(-1.2deg)/* Chrome, Safari, Opera */
        transformrotate(-1.2deg)}

    .article_info {
    width100%;
    height10px;
        text-alignleft;
    opacity0.4;
    colorwhite;
    font-size5.5pt;
    padding-left50px;
    margin-bottom10px;}

    .article_info {}

    .article_info a:hover {}

    .module_contenu {margin-left22px;
        width575px;
    font-familyCaladea;
    font-size11pt;
    color#e4e3e4;
    text-alignjustify;}

    .article_text {padding-left20px;}
    .module_contenu {color#db689e;}
    .module_contenu a:hover {border-bottom4pxwhite double;
    colorwhite;}
    .module_bottom {}


    /*--commentaire--*/
    .comment_normal.comment_admin {width:98%;
    margin-leftautomargin-rightauto;
        margin-top10px;
        margin-bottom5px;
    background#382733;
    border-radius4px;}

    div.commentheader{height45px;
    background#db689e;}

    div.commentbody {padding4px;}

    .commentnumber {font-familyimpact;
    font-size18pt;
    width50px;
    text-aligncenter;
    margin-top7px;
    color#32202c;}

    .comment_admin .commentpseudo {color:white;}
    .comment_normal .commentpseudo {color:white;}

    .commentpseudo {font-familyblackr;
    font-size20pt;
    margin-left3px;
    margin-top-4px;
    colorwhite;
    min-width500px;
    max-width500px;}

    .commentpseudo {colorwhite;}
    .commentpseudo a:hover {bordernone;
    colorwhite;}

    .commentdate {floatleft;
    width500px;
        positionrelative;
    top-8px;
    font-familygeorgia;
    font-styleitalic;
    color#212121;
    font-size9pt;}

    .commentavatar {positionrelative;
        top-55px;
        paddingnone;
        margin-right-21px;}

    .commentavatar img {width53px;
    height53px;
    box-shadow0px 0px 5px #db689e;}

    .comment-reply {colorwhite;
    background#d0835b;
    border-radius3px;
    padding3px 5px 3px 5px;
    margin-left10px;}

    .comment-reply a:hover {bordernone;
    background#d16618;}

    .block-reply {padding-left0px;
    margin-left25px;
    border-left0px;
        margin-top15px;}

    .block-reply li {margin-right15px;
        margin-bottom18px;}

    .block-reply li .commentheader{height45px;
    backgroundnone;}

    .block-reply li .commentpseudo {padding3px0px 0px 5px;}
    .block-reply li .commentpseudo {color:#bcbcbc;}
    .block-reply li .commentdate {padding0px0px 0px 21px;
    color#7c7c7c;}

    .block-reply li .comment_normal.block-replyli  .comment_admin{border1px dashed #db689e;
    padding3px 7px 3px 7px;
    color#9a9a9a;}

    .block-reply li .commentavatar {positionrelative;
        top-64px;
        margin-right-45px;}

    .block-reply li .commentavatar img {width:40px;
        height40px;
        border-radius4px;}

    /*--bouton--*/
    input[type=button],input[type=submit]button {
    background#eb995b;
    colorwhite;
    text-transformuppercase;
    letter-spacing2pt;
    font-size12pt;
    bordernone;
    border-radius3px;
    text-shadow1px 1px 2px #db7a1b;}

    input[type=button]:hover,input[type=submit]:hoverbutton:hover {
    background-webkit-linear-gradient(#eb995b#db7a1b);
        background:    -moz-linear-gradient(#eb995b#db7a1b);
        background:     -ms-linear-gradient(#eb995b#db7a1b);
        background:      -o-linear-gradient(#eb995b#db7a1b);
        background:         linear-gradient(#eb995b#db7a1b);}

    /*--helpbubble--*/
    #help_bubble {}

    #background input[type=text]#backgroundselect#background textarea {
    height22px;
    border1px solid grey;
    padding0px 0px 2px 0px;
    border-radius2px;
    margin-right2px;}

    /*--recherche--*/
    .module_menu_type_search [type="submit"]{width90%;
    margin-left1%;
        margin-right2%;}

    /*--module recherche--*/

    .module_menu_type_search input[type=text],.module_menu_type_search select,.module_menu_type_search textarea {
    width92%;
    border-radius3px;
    margin-bottom3px;}


    /*--forums--*/
    .post_table {
        width574px;
            margin-bottom35px;
        margin-top10px;
        background#786c72;}

    .post_table_head {positionabsolute;
        margin-top120px;
        displayblock;
        backgroundrgba(0,0,0,0.3);
    width110px;
    padding3px 5px 3px 5px;
    colorwhite;
    font-familycambria;}

    .post_table_profile {z-index9;
        positionabsolute;
            margin-top10px;
        displayblock;
        width120px;
        text-aligncenter;
    font-familyblackr;
    font-size18pt;
    colorwhite;
    text-shadow0px 0px 5px black;
    line-height90%;
    -ms-transformrotate(-2.5deg)/* IE 9 */
        -webkit-transformrotate(-2.5deg)/* Chrome, Safari, Opera */
        transformrotate(-2.5deg)}

    .post_table_profile a:hover {bordernone;}

    .post_table_profile {floatleft;
        width120px;
        height220px;
    background:url('http://ekladata.com/UYKOXyQJETehq9Lygjys0t8qo5c.png'50% 85% no-repeat#786c72;}

    .post_table_profile img {positionrelative;
        displayblock;
        width70px;
        height70px;
    margin-left25px;
    z-index1;
    border-radius15px 7px 8px 13px;}

    .post_table_msg {background#564750;
    min-height200px;
    padding5px;
        min-width444px;}

    .tag-ontop {}

    .chemin_forum {color#a74292;
    text-decorationnone;}
    .chemin_forum a:hover {bordernone;
        text-shadow0px 0px 3pxrgba(255,255,255,0.7);}

    .forum_table th.topic_table th {font-family:cambria;
    text-transformuppercase;
    text-shadow0px 0px 3px rgba(0,0,0,0.5);
    colorwhite;
    padding0px 10px 0px 10px;}

    .forum_table td.topic_table td {padding0px10px 0px 10px;}

    .forum_table td a.topic_table td {color:#db689e;
        text-shadow0px 0px 3px #db689e;
    text-decorationnone;}

    .forum_table td a:hover.topic_table tda:hover {colorwhite;
    text-shadow0px 0px 3px white;
    bordernone;}

    .forum-description {padding10px;
    margin10px 5px 10px 5px;
    border1px dashed #1e121a;}

    .ok_topic {}

    .module_contenu_block {margin-top5px;}

    /*--footer--*/
    #footer {height100%;
        padding-bottom10px;
    background#090909;
    text-aligncenter;
    font-size15pt;
    padding-top10px;
    font-familycambria;}


    #footer {color#2e2e2e;}

    #footer a:hover {color#888;
    text-decorationnone;}

    #footer:after {content"- Thème spécial Halloween -  Design by Elinae  -  ©2015";
    color#2e2e2e}

    /*--pagination--*/
    .pagination {font-familycambria;
        font-size12pt;}

    .pagination span {colorwhite;
    background#151515;
    padding2px 13px 2px 13px;
    text-shadow0px 0px 3px white;
    font-size16pt;
    font-weightnormal;}

    .pagination {background#151515;
    padding2px 13px 2px 13px;
    color#888;}

    .pagination a:hover {bordernone;}

    Pour installer le thème

    1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

    2. Choisir un seul menu à gauche.

    3. Faites attention au nombre de lien dans le menu du header..

    4. Copier, coller et appliquer les codes CSS du thème proposé.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1.  Vous pouvez utiliser la v2 du header pour ce thème. (v2 ici) [version plus claire avec des couleurs plus 'pétante'].

    2. Si vous utilisez la v2 du header, dans ce cas changer la couleur du fond du blog.
    Il suffit de changer ce code :

    /*--fond fenêtre--*/

    #body {background: #c0b7aa;
    word-wrap: break-word;}

    en

    /*--fond fenêtre--*/
    #body {background: #c2b59d;
    word-wrap: break-word;}

    3. Il vaut mieux choisir 6 derniers visiteurs pour le module "derniers visiteurs".

    4. Vous pouvez utiliser un menu déroulant pour votre menu du header.

     

    Thème Spécial Halloween ! Thème Spécial Halloween ! Thème Spécial Halloween ! Thème Spécial Halloween ! Thème Spécial Halloween !

     

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    1er octobre 2015. Le thème est aussi adapté aux petits écrans (moins de 1100px de large)


    48 commentaires
  • Depuis le temps que j'aurai du poster ce thème, le voici ! Pour ceux qui aiment les thèmes simples et sans manga, ça devrait le faire !

    THÈME EN LIBRE SERVICE #8 - Rose

     

    Les Codes

    @font-face {font-family: "Bebas_Neue";
    src: url('http://ekladata.com/DQ4_vfzSOgR64n05EBmf7v_kH2U/BebasNeue.otf');}

    @font-face {font-family: "lab";
    src: url('http://ekladata.com/AZplGHuUIoQTsWXwcEjSFTIGCV4/LABTOP_.ttf');}

    @font-face {font-family"trajan";
     srcurl('http://ekladata.com/Rgb3CmX4cI4aez15Og9j-7S5AJQ/TrajanPro3-Regular.otf');}


    /*--fond fenêtre--*/
    #body {       background:url('http://ekladata.com/lZFwOjGqaKuT9dGag-aG4z7Kv28.jpg') repeat;
    font-family: arial;
    word-wrap: break-word;}
    #body a { text-decoration: none;}

    /*--fond page--*/
    #background {width: 1000px;
        margin: 0 auto;}

    /*--header--*/
    #header {height: 180px;}

    #titre_header {top: 100px;
    line-height: 180%;
    letter-spacing: 8.15pt;}

    #titre_header a {display: inline-block;
        width: 100%;
        text-align: center;
        font-size19pt;
        font-familytrajan;
            font-weightbold;
        color: white;
        text-shadow: -1.5px 1.5px 0px #232323, 0px 0px 3px #505050;}

    #titre_header a:hover {text-shadow: -2.5px 1.5px 0px #ff497c, 0px 0px 3px #ff497c;}

    /*--menu header--*/
    #menu {width: 100%;
        height: 50px;
        padding-top: 15px;}

    #menu a {display: inline;
        font-family: bebas_neue;
        font-size: 20pt;
        color: white;
        background: #232323;
        margin-right: 15px;
        padding: 5px;
        border-radius: 5px 18px / 12px 8px;}

    #menu a:hover {background: rgba(0,0,0,0.5);}

    #menu ul a {display: inline-block;
        margin-top: 5px;
        padding-bottom: 10px;
        line-height: 100%;}

    #menu ul a:hover {display: inline-block;
        margin-top: 5px;
        padding-bottom: 10px;
        line-height: 100%;}

    /*--menu1--*/
    #menu1 {width: 300px;}

    #menu1 a {color:#ff497c;}

    #menu1 a:hover {color: white;}

    #menu1 .module_menu_titre {height: 100%;
        font-family: lab;
        font-size: 25pt;
        background: #232323;
        color: white;
        padding-left: 10px;
        border-bottom: 1px dashed #323232;}

    #menu1 .module_menu_contenu {background: #232323;
        color: #999;
        padding: 6px;
        margin-bottom: 35px;}

    .module_menu_type_search input[type="text"], .module_menu_type_search select, .module_menu_type_search textarea {width: 98%;
        height: 25px;
        color: grey;}

    .module_menu_type_search [type="submit"] {border: none;
        padding: 2px 0px 1px 0px;
        width: 100%;
        font-family: "Bebas_Neue";
        font-size: 19pt;
        margin-top: 7px;}

    .menu_shoutbox {height: 215px;}
    .menu_shoutbox {border-width: 1px;
        border-style: solid;
        border-color: rgb(64,64,64);
        padding: 3px;}

    .menu_shoutbox hr {width: 100%;
        background: rgb(48, 48, 48);
        height: 1px;
        margin-bottom: 2px;
        margin-top: 2px;}

    .module_menu_type_shoutbox input[type="text"], .module_menu_type_shoutbox select, .module_menu_type_shoutbox textarea {margin-top: 7px;
        width: 100%;
        height: 28px;
        color: grey;
        padding-top: 2px; padding-bottom: 2px;}

    .module_menu_type_shoutbox [type="submit"] {border: none;
        padding: 2px 0px 1px 0px;
        width: 100%;
        font-family: "Bebas_Neue";
        font-size: 19pt;
        margin-top: 7px;}

    #menu_calendar_month {color: #999;}

    .module_menu_type_calendar thead {background: #ccc;
        color: black;}

    .module_menu_type_calendar tbody tr {color: #a5a5a5;}


    .module_menu_type_calendar tbody a {color: #555;
        font-weight: bold;}

    .module_menu_type_calendar tbody a:hover {color: white;}

    .module_menu_type_lastvisitors img {width:65px;
        height: 65px;
        margin: 2px;}

    /*--article--*/
    #content {margin-top: 10px;
        width: 630px;
        margin-left: 330px;
        padding-left: 5px; padding-right: 5px;}

    .module_titre_contenu, .module_titre_contenu a {display: inline;
        font-family: "Bebas_Neue";
        font-size: 23pt;
        background: #ff497c;
        color: white;}

    .module_titre_contenu {height: 100%;
        padding-top: 9px;
        padding-bottom: 5px;
        padding-left: 10px;
        padding-right: 10px;}

    .article_info {text-align: right;
        font-size: 10px;
        padding-bottom: 5px;}

    .module_contenu {margin-top: 15px;
        padding: 7px;}

    .module_contenu {background: #fefefe;
        border: 1px solid #ccc;}

    .module_contenu a {color: #ff497c;}

    .module_contenu a:hover {background-color: #ff497c;
        color:white;
        border-radius: 3px;}

    .module_bottom {height: 20px;}

    /*--footer--*/
    #footer {height: 100%;
        color: #ff497c;
        font-family: lab;
        font-size: 10pt;
        text-align: center;
        letter-spacing: 2pt;}

    #footer a {color: #ff497c;
        font-family: lab;
        font-size: 10pt;}

    #footer a:hover {color: #dadada;}


    #footer:after {content: "-  Design by Elinae  -  © 2015";}

    /*--commentaire--*/
    .comment_normal, .comment_admin {width: 100%;
        border-bottom: 1px dashed #dbdbdb;}


    div.commentheader{}

    div.commentbody {margin-top: 10px;
        margin-bottom: 20px;
        text-align: justify;}

    div.commentbody a {}

    div.commentbody a:hover {}

    .comment_admin .commentnumber {color: #696969;}

    .commentnumber {font-family: impact;
        font-size: 12pt;
        width: 22px;
        color: black;
        line-height: 160%;}

    .commentpseudo a {color: black;}

    .commentpseudo a:hover {}

    .commentpseudo {font-family: bebas_neue;
        font-size: 20px;}

    .comment_admin .commentpseudo a{color: #ff497c;}
    .comment_admin .commentpseudo a:hover {color: white;}

    .commentdate {font-family: "lab";
        font-size: 13pt;
        letter-spacing: 3pt;}

    .commentavatar {margin-right: 10px;
        margin-left: 5px;}

    .commentavatar img {border-radius: 50px / 100px;
        border: 3px solid #dadada;}


    /*--bouton--*/
    input[type=button],input[type=submit], button {background: #ff497c;
        color: white;
        font-family: bebas_neue;
        font-size: 17px;
        letter-spacing: 1.2pt;
        border: none;
        padding: 2px 8px 0px 8px;}

    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {background-color: #ffaf44;}

    /*--helpbubble--*/
    #help_bubble {background: white;
        border: 1px dashed #dbdbdb;
        color: grey;
        border-radius: 3px;}


    /*--forums--*/
    .post_table {width: 100%;
        margin-bottom: 15px;}

    .post_table_head {background: #ccc;
        padding: 5px;
        font-family: arial;
        color: white;
        text-align: right;
        border-bottom: 1px dashed #ababab;}

    .post_table_profile a {font-family: bebas_neue;
        font-size: 20px;}

    .post_table_profile a:hover {}

    .post_table_profile {text-align: right;
        width: 86px;
        padding-right: 5px;
        padding-bottom: 5px;
        background: #e9e9ea;
        border-right: 1px dashed #ababab;
        border-bottom: 1px solid #ababab;}

    .post_table_profile img {width: 75px;
        height: 75px;
        border-radius: 50px / 100px;
        border: 3px solid #ababab;}

    .post_table_msg {padding: 7px;
        background: #e9e9ea;
        border-bottom: 1px solid #ababab;
        border-right: 7px solid #ccc;}



    .chemin_forum {color#505050;}

    .chemin_forum a:hover {}

    .forum_table th.topic_table th {font-family: arial;
        font-weight: normal;
    text-transformuppercase;
    text-shadow0px 0px 3px rgba(0,0,0,0.5);
    color#505050;
    padding0px 10px 0px 10px;}

    .forum_table td.topic_table td {padding0px 10px 0px 10px;}

    .forum_table td a.topic_table td {color#ff497c;
    text-decorationnone;}

    .forum_table td a:hover.topic_table td a:hover {}

    .forum-description {padding10px;
    margin10px 5px 10px 5px;
    border1px dashed #505050;}

    /*--pagination--*/
    .pagination {font-family: bebas_neue;
        font-size: 12pt;}

    .pagination a {padding-left: 5px; padding-right: 5px;}

    .pagination img {
    }

    Pour installer le thème

    1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

    2. Choisir un seul menu à gauche.

    3. Faites attention au nombre de lien dans le menu du header..

    4. Copier, coller et appliquer les codes CSS du thème proposé.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1.  La couleur de ce thème est du rose (celui ci #ff497c), mais vous pouvez très bien la remplacer par une autre couleur.

    2. Dans le cas où vous souhaitez changer la couleur du thème : chercher tout les éléments qui ont pour valeur la couleur #ff497c et remplacez-la.

    3. Il vaut mieux choisir 8 derniers visiteurs pour le module "derniers visiteurs".

    4. Vous pouvez utiliser un menu déroulant pour votre menu du header.

     

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    24 mai 2015. Le thème est aussi adapté aux petits écrans (moins de 1100px de large)


    67 commentaires
  •  

    Les Codes

    @font-face {font-family: "Bebas_Neue";

    src: url('http://ekladata.com/DQ4_vfzSOgR64n05EBmf7v_kH2U/BebasNeue.otf');}

    @font-face {font-family: "lake";
    src: url('http://ekladata.com/IP339OmJlEw9I-NGBUtfHMzGmP0/Lakesight_PersonalUseOnly.ttf');}

    @font-face {font-family: "lab";
    src: url('http://ekladata.com/AZplGHuUIoQTsWXwcEjSFTIGCV4/LABTOP_.ttf');}

    /*--fond fenêtre--*/
    #body { background:url('http://ekladata.com/iB3D7ti4-5-WNSLuO0Rnfy6XK2U.jpg') repeat;
    font-family: arial;}
    #body a { text-decoration: none;}

    /*--fond page--*/
    #background {width: 89%;
    margin-left: 30px;}

    /*--header--*/
    #header {height: 75px;}

    #titre_header {position: absolute;
    top: 320px;
    left: 850px;
    text-align: left;
    line-height: 30pt;
    width: 542px;
    font-family: "lake";
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);}

    #titre_header a {color: #ffaf44;
    font-size: 63pt;
    text-shadow: 0px 0px 5px #ba0e25;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;}

    #titre_header a:hover {color: #34c0cb;
    text-shadow: 0px 0px 5px #7b7b7b;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;}

    /*--menu header--*/
    #menu {position: absolute;
    top: 21px;}

    #menu a {display: block;
    width: 105px;
    height: 27px;
    text-align: center;
    border: 1px solid #f9f09e;
    background: #f9f09e;
    font-family: "lab";
    font-size: 19pt;
    letter-spacing: 5pt;
    color: black;
    padding: 2px 10px 7px 10px;
    margin-right: 25px;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;}

    #menu a:hover {background: white;
    text-shadow: 0px 0x 3px black;
    border: 1px solid #dbdbdb;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;}

    /*--menu1--*/
    #menu1 {background: url('http://ekladata.com/0CVIFL-EmH7pp8e8bD3Xhwza_O0@375x545.jpg');
    width: 375px;
    border: 3px solid #dbdbdb;
    min-height: 542px;
    max-height: 542px;
    overflow-y: auto;
    font-family: arial;
    font-size: 12pt;
    }

    #menu1 a {color: #ff0c50;
    text-shadow: 1px 1px 0px white, -1px -1px 0px white, -1px 1px 0px white, 1px -1px white;}

    #menu1 a:hover {background-color: #34c0cb;
    color:white;
    border-radius: 3px;
    text-shadow: none;}

    #menu1 .module_menu_titre {display: none;}

    #menu1 .module_menu_contenu {padding: 0px 5px 0px 5px;
    opacity: 0;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;}

    #menu1 .module_menu_contenu:hover {opacity: 1;
    background: rgba(255,255,255,0.6);
    min-height: 542px;
    -webkit-transition-duration: 0.09s;
    -moz-transition-duration: 0.09s;
    transition-duration: 0.09s;}

    .module_menu_type_lastvisitors {position: absolute;
    top: 0px;
    right: 0px;
    width: 60px;
    margin-left: -10px;}

    .module_menu_type_lastvisitors img {width: 45px;
    height: 45px;
    border-radius: 100px;
    margin-bottom: 15px;
    margin-top: 5px;}

    /*--article--*/
    #content {width: 645px;
    position: absolute;
    top: 75px;
    left: 60px;
    background: #f9f9f9;
    border: 1px solid #dbdbdb;
    min-height: 542px;
    max-height: 542px;
    overflow-y: auto;
    }

    .module_titre_contenu, .module_titre_contenu a {font-family: "Bebas_Neue";
    font-size: 23pt;
    letter-spacing: 1pt;
    color: #34c0cb;
    text-shadow: 2px 0px 0px #dbdbdb;
    }

    .module_titre_contenu {border-bottom: 1px dashed #dbdbdb;
    height: 100%;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;}

    .article_info {display: none;}

    .module_contenu {padding: 7px;}

    .module_contenu a {color: #ff497c;}

    .module_contenu a:hover {background-color: #34c0cb;
    color:white;
    border-radius: 3px;}

    .module_bottom {height: 20px;}

    /*--footer--*/
    #footer {display: block;
    color: grey;
    font-size: 8pt;}

    #footer a {color: grey;}


    #footer:after {content: "- Design by Elinae - © 2015";}

    /*--commentaire--*/
    .comment_normal, .comment_admin {border-bottom: 1px dashed #dbdbdb;}


    div.commentheader{}

    div.commentbody {margin-top: 10px;
    margin-bottom: 20px;
    text-align: justify;}

    div.commentbody a {}

    div.commentbody a:hover {}

    .comment_admin .commentnumber {color: #696969;}

    .commentnumber {font-family: impact;
    font-size: 12pt;
    width: 22px;
    color: black;
    line-height: 160%;}

    .commentpseudo a {color: black;}

    .commentpseudo a:hover {}

    .commentpseudo {font-family: bebas_neue;
    font-size: 20px;}

    .comment_admin .commentpseudo a{color: #ff497c;}
    .comment_admin .commentpseudo a:hover {color: white;}

    .commentdate {font-family: "lab";
    font-size: 13pt;
    letter-spacing: 3pt;}

    .commentavatar {margin-right: 10px;
    margin-left: 5px;}

    .commentavatar img {border-radius: 50px / 100px;
    border: 3px solid #dbdbdb;}


    /*--bouton--*/
    input[type=button],input[type=submit], button {background: #34c0cb;
    color: white;
    font-family: bebas_neue;
    font-size: 17px;
    letter-spacing: 1.2pt;
    border: none;
    padding: 2px 8px 0px 8px;}

    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {background-color: #ff497c;}

    /*--helpbubble--*/
    #help_bubble {background: white;
    border: 1px solid grey;
    color: grey;
    border-radius: 3px;}


    /*--forums--*/
    .post_table { margin-bottom: 15px;}

    .post_table_head {background: #ffaf44;
    padding: 5px;
    font-family: arial;
    color: white;
    text-align: right;
    border-bottom: 1px dashed #ababab;}

    .post_table_profile a {font-family: bebas_neue;
    font-size: 20px;}

    .post_table_profile a:hover {}

    .post_table_profile {text-align: right;
    width: 86px;
    padding-right: 5px;
    padding-bottom: 5px;
    background: #e9e9ea;
    border-right: 1px dashed #ababab;
    border-bottom: 1px solid #ababab;}

    .post_table_profile img {width: 75px;
    height: 75px;
    border-radius: 50px / 100px;
    border: 3px solid #ababab;}

    .post_table_msg {padding: 7px;
    background: #e9e9ea;
    border-bottom: 1px solid #ababab;
    border-right: 7px solid #ffaf44;}


    /*--pagination--*/
    .pagination {font-family: bebas_neue;
    font-size: 12pt;}

    .pagination a {padding-left: 3px; padding-right: 3px;}

    .pagination img {}

    /*fenetre*/
    .window_title{ font-size: 25px; color: white; text-shadow: 2px 1px 0px #5892b8;
    font-family: bebas_neue;
    letter-spacing: 1.3pt;
    line-height: 120%;}
    .window_handle_content {background: #95c6e6 ;text-align:center;}
    .window_handle_left{ background: #95c6e6 ;border-radius: 3px 0 0 0;}
    .window_handle_right{ background: #95c6e6 ;border-radius: 0 3px 0 0;}
    .window_content_wrapper1{ background: #95c6e6;}
    .window_content_wrapper2{ background: #95c6e6;}
    .window_bottom_wrapper1{ background: #95c6e6; border-radius: 0 0 3px 3px}
    .window_bottom_wrapper2{ background: #95c6e6 ;border-radius: 0 0 3px 3px}
    .window_bottom{ background: #95c6e6;}
    .window_tabs span.window_tab_active {background-color: COLOR;}
    .window_tabs span {background-color: color;}
    .window {box-shadow: 0px 0px 5px black;
    border-radius: 3px;}

    Pour installer le thème

      1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez.

      2. Choisir un seul menu à gauche.

      3. Vous ne devez garder qu'un seul module simple (pas de derniers visiteurs ou de shoutbox..etc).

      4. Ne pas mettre plus de 7 liens dans le menu du header.

      5. Copier, coller et appliquer les codes CSS du thème proposé.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1.  Considérez que ce thème n'a pas de menu !

    2. Au risque de me répéter : ce thème ne doit comporter qu'un seul module SIMPLE dans le menu de gauche, et il ne doit PAS y avoir de derniers visiteurs, de module de recherche et autre. Le module simple existant sert uniquement à ceux voulant faire une description de leur blog.

    3. L'apparence des commentaires et des messages du forum  a été codée.

    4. Ce thème devrait avoir un bon rendu sur les écrans petits comme grand.

    5. Ce thème a un meilleur rendu sur ordinateur !

     

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    21 avril 2015. Le thème est aussi adapté aux petits écrans (moins de 1100px de large)


    130 commentaires
  • Thème en libre service #6 - Manga Girl Violet/Jaune [BIENTOT]

     

    Les Codes

    @font-face {font-family: "trajan";

    src: url('http://ekladata.com/Rgb3CmX4cI4aez15Og9j-7S5AJQ/TrajanPro3-Regular.otf');}

     

    @font-face {font-family: "nathaniel";

        src: url('http://ekladata.com/Pfv8RPwS_IqupMJaS8KZVKMaoHo/Nathaniel.ttf');} 

     

    /*--fond fenêtre--*/

    #body {        background:url('http://ekladata.com/kpGAqaSeO7RLb8xhIlABYUbtf4A.png') repeat;}

    #body a { text-decoration: none;}

     

    /*--fond page--*/

    #background { background: url('http://ekladata.com/YFTCQVjb3mn2SXwjaPD5Nv_zF2A.jpg') no-repeat;

    width: 900px;

        background-color: #f6f4f3;

    box-shadow: 0px -3px 7px #0606;

    border-left: 1px solid #b7007a;

    border-right: 1px solid #b7007a;}

     

    /*--header--*/

    #header {background: url('http://ekladata.com/ovZgu0jpApcHNRmYzZ5K-XiyrvE.jpg');

    height: 320px;

    margin-bottom: 20px;}

     

     

    #titre_header {font-size: 35pt;

    color: black;

    font-family: Nathaniel;

        padding: 5px 5px 0px 5px;

        font-weight: lighter;}

     

    #titre_header a {color: white;

    text-shadow:  1px 1px 0px #ab0075, -1px -1px 0px #ab0075, -1px 1px 0px #ab0075, 1px -1px 0px #ab0075; }

     

     

    /*--menu header--*/

    #menu {display: none;}

     

    /*--menu1--*/

    #menu1 {

        border-radius: 10px 10px 10px 10px;

        background: rgba(207,0,107,0.4);

        width: 240px;

    color: #9e9e9e;

    margin-left: 10px;

    margin-top: 35px;}

     

    #menu1 a {color: #b7007a;}

    #menu1 a:hover {color: #e4079a;}

     

    #menu1 .module_menu_titre {height: 25px;

    font-size: 15pt;

        text-align: left;

    color: white;

    font-family: Trajan;

    line-height: 130%;

    text-shadow: 0px 0px 5px #f817ae;

    margin-top: 5px;

    margin-left: 10px;}

     

    #menu1 .module_menu_contenu {padding-left: 10px;

        padding-right: 10px;

    padding-top: 10px;

    padding-bottom: 30px;

    color: white;

    font-family: arial;

    font-size: 11pt;}

     

     

    /*--module dernier visiteurs--*/

    .module_menu_type_lastvisitors {position: absolute;

    top: 295px;

    margin-left: 270px;}

     

    .module_menu_type_lastvisitors img {width:35px;

    height: 35px;

    margin-bottom: 15px;

        border: 3px solid white;

    box-shadow: 0px 0px 4px #bababa;

    opacity: 0.9;

    margin-right: 5px;

    margin-left: 7px;

          -webkit-transition-duration: 0.3s;

                       -moz-transition-duration: 0.3s;

                       transition-duration: 0.3s;

    -webkit-transition-timing-function: ease-out;

                       -moz-transition-timing-function: ease-out;

                       transition-timing-function: ease-out;}

     

    .module_menu_type_lastvisitors img:hover{

    border-radius: 20px 85px / 75px 30px;

          -webkit-transition-duration: 0.3s;

                       -moz-transition-duration: 0.3s;

                       transition-duration: 0.3s;

    -webkit-transition-timing-function: ease-in;

                       -moz-transition-timing-function: ease-in;

                       transition-timing-function: ease-in;}

     

    /*--shootbox--*/

    .menu_shoutbox {background-color: #fbfbfb;

    border: solid 1px #c7c7c7;

    padding: 5px 5px 5px 5px;

    margin-bottom: 10px;

    color: grey;}

     

    .menu_shoutbox hr {width: 90%;

    border-bottom: dashed 1px #d5d5d5;}

     

    /*--article--*/

    #content {width: 590px;

    margin-left: 280px;

    margin-top: 90px;}

     

    .module_titre_contenu, .module_titre_contenu a {

        height: 32px;

        width: 580px;

    font-weight: lighter;

        font-family: Trajan;

        color: #b0007c;

        font-size: 16.3pt;

        letter-spacing: -0.3pt;

    text-decoration: none;

    text-align: center;

    text-shadow: 1px 1px 0px white, -1px -1px 0px white, -1px 1px 0px white, 1px -1px 0px white, 2px 2px 0px white, -2px -2px 0px white, -2px 2px 0px white, 2px -2px 0px white;}

     

    .module_titre_contenu {

    padding-left: 10px;

    line-height: 165%;

    border-bottom: double 3px #b0007c;}

     

    .article_info { height: 10px;

        font-size: 10px;

        font-family: arial;

        color: black;

        opacity: 0.5;

        text-align: right;

        padding-bottom: 10px;

    }

     

    .module_contenu {

        padding-top: -5px;

        padding-left: 3px;

        padding-right: 3px;

        padding-bottom: 10px;

    font-family: arial;

    font-size: 11.5pt;

    color: #565656;

    letter-spacing: 0.6pt;

    }

     

     

    .module_contenu a {

        color: #f98e2c;

        font-weight: bold;

    }

     

    .module_contenu a:hover {

        color: #f9cd2a;

    }

     

    .module_bottom {

        height: 40px;

     

    }

     

    /*--footer--*/

    #footer {

        height: 25px;

        font-size: 14px;

        color: black;

    float: right;

    padding-top: 45px;

    margin-right: 30px;

    opacity: 0.5;}

     

    #footer a {

        color: black;

    }

     

     

    #footer:after {content: "-  Design original by Elinae  -  © 2015";}

     

    /*--commentaire--*/

    .comment_normal, .comment_admin {

    width: 580px;

        background-color: #f8f4f3;

        border-radius: 15px 15px 15px 15px;

        color: #494949;

            border-top: 1px solid #494949;

        border-bottom: 3px solid #494949;

        border-right: 3px solid #494949;

        border-left: 1px solid #494949;

        margin-bottom: 20px;

        margin-top: 25px;

    }

     

    .comment_normal:hover, .comment_admin:hover {background: #efeae9;}

     

    div.commentheader{

    background: url('http://ekladata.com/AnDwxC5Jifd2TgyBVvYGbirwpps.png');

    background-color: white;

        border-radius: 15px 15px 0px 0px;}

     

    div.commentbody {

        padding-top: 10px;

        padding-right: 10px; padding-left: 10px;

        padding-bottom: 10px;

    text-align: justify;

    margin-bottom: 25px;}

     

    .comment_admin .commentnumber {

        color: #494949;

    font-family: impact;

    font-weight: lighter;

    font-size: 25px;

    float: left;}

     

    .commentnumber {

    float: left;

       color: #494949;

    font-family: impact;

    font-size: 25px;

            font-variant: normal;

    text-align: center;

    padding-right: 10px;

    width: 45px;

    padding-left: 10px;}

     

    .commentpseudo a {

    font-style: normal;

    text-decoration: none;

    font-variant: normal;

    }

     

    .commentpseudo {

        line-height: 140%;

    padding-top: 5px;

    font-family: Trajan;

        padding-right: 15px;

        font-size: 18px;

        font-weight: bold;

    float: right;

    letter-spacing: 3pt;

    text-shadow: 1px 1px 0px white, -1px -1px 0px white, -1px 1px 0px white, 1px -1px 0px white;}

     

    .comment_admin .commentpseudo {

    font-style: normal;

    text-decoration: none;

    font-variant: normal;

    }

     

    .commentdate {float: left;

    font-size: 9pt;

    padding-top: 5px;

    padding-left: 10px;

    font-family: Arial, Helvetica, sans-serif;

    color: #494949;

        opacity: 0.8;

        line-height: 200%;

    }

     

    .commentavatar {float: right;}

     

    .commentavatar img {

    width: 90%;

    border-radius: 75px 28px 43px / 65px;

    box-shadow: 0px 0px 5px #c0008d;}

     

     

    /*--bouton--*/

    input[type=button],input[type=submit], button {

        background: linear-gradient( #f67112, #faa060);

    padding: 7px 14px 3px 14px;

    color: white;

        border-radius: 10px / 20px ;

        border-top: 1px solid #ffc9a2;

        border-left: 1px solid #f67112;

        border-right: 1px solid #f67112; 

        border-bottom: 1px solid #f67112;

    font-family: Trajan;

    letter-spacing: 0.1pt;

    font-size: 11pt;}

     

    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {

        background: linear-gradient( #faa060, #f67112);

    }

     

    /*--helpbubble--*/

    #help_bubble {background: white;

        border: 1px solid grey;

    border-radius: 4px;

    color: grey;}

     

    /*--recherche--*/

    .module_menu_type_search { position: absolute;

        top: -30px;

    margin-left: 0px;}

     

    .module_menu_type_search [type="submit"] {opacity: 0;}

     

    /*--module recherche--*/

     

    #background input[type=text], #background select, #background textarea {

        width: 200px;

        height: 25px;

        margin-bottom: 5px;

    opacity: 0.7;

    border: none;

    border: 1px solid grey;}

     

     

    /*--forums--*/

    .post_table_head {background: rgba(182,0,119,.7);

        padding: 3px 2px 3px 2px;

    text-align: center;

    font-family: arial;

    color: white;

    border-radius: 15px 15px 0px 0px;}

     

    .post_table_profile a {position: relative;

        top: 105px;

        display: block;

        width: 100%;

        padding-top: 3px;

        background: rgba(255,255,255,.7);

        color: #f28026;}

     

    .post_table_profile a:hover {color: black;}

     

    .post_table_profile {background: url('http://ekladata.com/PDYSema1CchtOvZh15N7jV12KmA.jpg');

    width: 110px;

    height: 190px;

        padding-top: 10px;

    font-family: "Trajan";

    font-size: 17px;

        letter-spacing: -0.4pt;

    text-align: center;

    border-radius: 0px 0px 0px 15px;}

     

    .post_table_profile img {position: relative;

        top: -40px;

        border-radius: 8px / 20px;

        box-shadow: 0px 0px 8px white;}

     

    .post_table_msg { background: #f7f7f7;

    padding: 5px 10px 5px 10px;

    border-radius: 0px 0px 15px 0px;

    color: grey;

    box-shadow: inset 0px 0px 7px grey;}

    .post_table_msg p {width: 455px;}​

    Pour installer le thème

      1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

      2. Choisir un seul menu à gauche.

      3. Vous devez placer vous-même le titre de votre blog en allant dans Apparence > Modifier le thème > En-tête (header) > Titre > Déplacer à la souris.

      4. Ne pas mettre de lien dans le menu du header.

      5. Copier, coller et appliquer les codes CSS du thème proposé.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1. Enlever le titre du module "derniers visiteurs" pour que ça donne le même résultat que ci-dessus.

    2. Pour que la barre de recherche soit affichée en haut à gauche comme dans le screen, vous devez ajouté le module "recherche".

    3. L'apparence des commentaires, des messages du forum et de la shoutbox a été codée.

    4. A priori pas de bug pour ce thème : mais n'hésitez pas à me les signaler si il y en a.

     

    Thème en libre service #6 - Manga Girl Violet/Jaune [BIENTOT] Thème en libre service #6 - Manga Girl Violet/Jaune [BIENTOT] Thème en libre service #6 - Manga Girl Violet/Jaune [BIENTOT] Thème en libre service #6 - Manga Girl Violet/Jaune [BIENTOT] Thème en libre service #6 - Manga Girl Violet/Jaune [BIENTOT] Thème en libre service #6 - Manga Girl Violet/Jaune [BIENTOT]

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    27 mars 2015. Le thème est aussi adapté aux petits écrans (moins de 1100px de large)


    151 commentaires
  • Comme promis, après les 100 votes au sondage, voici le 5ème thème en libre service

    Thème en libre service #5 - Tamako Love Story

     

    Les Codes

    @font-face {font-family: "Bebas_Neue";
    src: url('http://ekladata.com/DQ4_vfzSOgR64n05EBmf7v_kH2U/BebasNeue.otf');}


    /*--fond fenêtre--*/
    #body {background:url('http://ekladata.com/HoUo8QjAQzTA1DGYPY3koHwKXMA.jpg') fixed repeat-x 50% 0%;}
    #body a { text-decoration: none;}

    /*--fond page--*/
    #background {
    width: 1100px;
    margin-top: 0px;
    border-right: solid 1px #858585;
    border-left: solid 1px #858585;
    box-shadow: 0px 0px 7px #b4b4b4;
    background: url('http://ekladata.com/3TJ8pywRld7WY8UooKNnnvYZMV0.jpg') no-repeat 50% 0% white;}

    /*--header--*/
    #header {
    height: 370px;}

    #titre_header {font-size: 0px;}

    .bannimg {position: absolute;
    top: 190px;
    margin-left: -720px;}

    #menu {position: relative;
    top: 10px;
    left: 35px;
    display: none;}

    #menu a {
    display: block;
    width: 110px;
    height: 30px;
    background: linear-gradient( #ffb381, #f19151);
    margin-right: 10px;
    border-radius: 6px;
    text-align: center;
    font-family: "Bebas_Neue";
    color: white;
    font-size: 15pt;
    letter-spacing: 2pt;
    line-height: 160%;
    text-shadow: 1px 1px 2px #e28141;
    border: solid 1px #e28141;
    opacity: 0.9;}

    #menu a:hover {
    background: linear-gradient( #99e55b, #7bca26);
    text-shadow: 1px 1px 2px #74cb2d;
    border: solid 1px #74cb2d;
    opacity: 1;}

    /*--menu1--*/
    #menu1 {
    margin-right: 32px;
    width: 320px;
    color: #9e9e9e;
    background: rgba(255,255,255,.60);
    border: 1px solid #99e55b;
    padding-top: 20px;}

    #menu1 a {color: #ea8d4f;
    font-weight: bold;}
    #menu1 a:hover {color: #ffba8c;}

    #menu1 .module_menu_titre {height: 45px;
    font-size: 25pt;
    background-color: #99e55b;
    color: white;
    text-align: right;
    padding-right: 15px;
    font-family: Bebas_Neue;
    line-height: 160%;
    text-shadow: 1px 1px 2px #74cb2d;}

    #menu1 .module_menu_contenu {padding-left: 8px;
    padding-right: 8px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #767c91;}


    /*--module dernier visiteurs--*/
    .module_menu_type_lastvisitors img {width:45px;
    height: 45px;
    margin-bottom: 15px;
    border-radius: 8px 3px / 4px 7px;
    box-shadow: 0px 0px 4px #bababa;
    opacity: 0.9;
    margin-right: 5px;
    margin-left: 7px;}

    .module_menu_type_lastvisitors img:hover{opacity: 0.2;}

    /*--derniers articles--*/

    .module_menu_type_lastarticles {position: absolute;
    top: -75px;
    margin-left: 105px;
    -webkit-transform: rotate(-16deg);
    -moz-transform: rotate(-15deg);
    -o-transform: rotate(-15deg);
    transform: rotate(-15deg);
    width: 200px;
    height: 230px;}

    .module_menu_type_lastarticles a {text-shadow: 1px 1px 0px white, -1px -1px 0px white, -1px 1px 0px white, 1px -1px 0px white;
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
    filter: grayscale(1);}

    .module_menu_type_lastarticles a:hover {color: #99e55b;}

    /*--shootbox--*/
    .menu_shoutbox {background-color: #fbfbfb;
    border: solid 1px #c7c7c7;
    padding: 5px 5px 5px 5px;
    margin-bottom: 10px;}

    .menu_shoutbox hr {width: 90%;
    border-bottom: dashed 1px #d5d5d5;}

    /*--article--*/
    #content {width: 670px;
    margin-left: 32px;
    background: rgba(255,255,255,.60);
    border: solid 1px #f8a167;
    padding-top: 20px;}

    .module_titre_contenu, .module_titre_contenu a {
    height: 45px;
    width: 645px;
    font-weight: lighter;
    font-family: "Bebas_Neue";
    color: white;
    font-size: 28pt;
    text-decoration: none;
    text-align: left;
    text-shadow: 1px 1px 2px #e28141;}

    .module_titre_contenu {
    padding-left: 25px;
    line-height: 125%;
    padding-top: 5px;
    background-color: #f8a167;}

    .article_info { display: none;
    }

    .module_contenu {
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 10px;
    font-family:arial;
    font-size: 11pt;
    color: #767c91;
    letter-spacing: 0.1pt;
    border-radius: 0px 0px 3px 3px;
    }


    .module_contenu a {
    color: #94d250;
    font-weight: bold;
    }

    .module_contenu a:hover {
    color: #b0f663;
    }

    .module_bottom {
    height: 20px;

    }

    /*--footer--*/
    #footer {
    height: 25px;
    font-size: 14px;
    color: grey;
    float: right;
    padding-top: 45px;
    margin-right: 30px;}

    #footer a {
    color: grey;
    }

    #footer a:hover {
    opacity: 0.7;
    }

    #footer:after {content: "- Design original by Elinae - © 2015";}

    /*--commentaire--*/
    .comment_normal, .comment_admin {
    width: 100%;
    }

    div.commentheader{
    background-color: #f9f9f9;
    margin-top: 10px;
    border-right: solid 5px #ebebeb;
    border-left: solid 1px #ebebeb;
    border-top: solid 1px #ebebeb;
    border-bottom: dashed 1px #dcdcdc;}

    div.commentbody {
    padding-top: 10px;
    padding-right: 2px; padding-left: 7px;
    padding-bottom: 10px;
    background-color: #f9f9f9;
    text-align: justify;
    margin-bottom: 25px;
    border-right: solid 5px #ebebeb;
    border-left: solid 1px #ebebeb;
    border-bottom: solid 5px #ebebeb;}

    .comment_admin .commentnumber {
    color: #9a9a9a;
    font-family: impact;
    font-weight: lighter;
    font-size: 25px;
    float: right;}

    .commentnumber {
    float: right;
    color: #9a9a9a;
    font-family: impact;
    font-size: 25px;
    font-variant: normal;
    text-align: center;
    padding-right: 10px;
    width: 45px;
    padding-left: 10px;}

    .commentpseudo a {
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    .commentpseudo {
    line-height: 140%;
    padding-top: 5px;
    font-family: "Bebas_Neue";
    font-weight: lighter;
    font-size: 18px;
    float: right;
    letter-spacing: 3pt;}

    .comment_admin .commentpseudo {
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    .commentdate {float: left;
    font-size: 9pt;
    padding-top: 5px;
    padding-left: 5px;
    font-family: Arial, Helvetica, sans-serif;
    color: grey;
    opacity: 0.8;
    line-height: 200%;
    }

    .commentavatar {float: right;}

    .commentavatar img {
    width: 90%;
    border-radius: 8px 3px / 4px 7px;
    box-shadow: 0px 0px 3px #9a9a9a;}


    /*--bouton--*/
    input[type=button],input[type=submit], button {
    background-color: #f8a167;
    padding: 5px 14px 5px 14px;
    border: solid 1px #e48748;
    color: white;
    font-family: "Bebas_Neue";
    letter-spacing: 1pt;
    font-size: 14pt;}

    /*--module recherche--*/
    .module_menu_type_search, input[type=button],input[type=submit], button {text-align: center;}

    #background input[type=text], #background select, #background textarea {
    width: 88%;
    height: 25px;
    margin-bottom: 5px;}

    /*--helpbubble--*/
    #help_bubble {background: #f9f9f9;
    border: solid 1px #9d9d9d;
    border-radius: 3px;
    color: #4c4c4c;}​

    Pour installer le thème

      1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

      2. Choisir un seul menu à droite.

      3. Ne pas mettre de slogan à votre blog.

      4. Copier, coller et appliquer les codes CSS du thème proposé.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1. le titre du blog est une image, pour qu'il y ai le titre de votre blog, demandez-le moi en commentaire ci-dessous.

    2. Une fois que vous aurez l'image correspondant au titre de votre blog, placez ce code dans le code source HTML d'un module simple :

    <div class="bannimg"><img src="LIENDEVOTREIMAGE"/></div>

    Puis enregistrez.

    3. A propos du module "derniers articles" : choisissez 10 articles affichés et faites-le avant d'installer le thème (une fois le thème installé vous ne pourrez plus modifier le module).

    4. Je vous déconseille de mettre des liens dans le menu du header car ça surcharge vraiment le thème, mais vous pouvez en mettre. Evitez seulement de mettre plus de 4 liens. /!\ Je n'ai pas codé le menu du header pour être un menu déroulant !

    5. Parfois une scrollbar horizontale s'ajoute toute seule sans qu'il y ai besoin d'en avoir une : je n'ai pas su régler ce problème là. 

    Pour info, le nom de la police du titre (image) est : Harabara

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    16 mars 2015. Le thème n'est pas adapté aux écrans de moins de 1100px de large


    166 commentaires
  • Thème en libre service #4 - just snap out of it

     

    Les Codes

    /*--fond fenêtre--*/
    #body {background: url('http://ekladata.com/tmeGD3203QtvcVEfDEfbluyJKqo.png') no-repeat 50% 0%, url('http://ekladata.com/egtRR48lSbvkb-6KGn-4051P76U.jpg') repeat-x 50% 0%, url('http://ekladata.com/lZFwOjGqaKuT9dGag-aG4z7Kv28.jpg') repeat 50% 0%;}
    #body a { text-decoration: none;}

    /*--fond page--*/
    #background {
    width: 1000px;
        margin-top: 0px;
    padding-left: 10px;
    padding-right: 10px;}

    /*--header--*/
    #header {
    height: 335px;
    margin-bottom: 40px;}

    #titre_header {font-size: 0pt;}

    .bannimg  {position: absolute;
    top: -88px;
        margin-left: -22px;}

    /*--menu header--*/
    #menu {
    position: absolute;
    top: 276px;
    left: 0px;
    text-transform: uppercase;
    font-size: 15pt;
    line-height: 290%}

    #menu li {
    float: left;
    }

    #menu a {
        display: block;
    height: 55px;
    width: 127px;
        padding-left: 5px;
        padding-right: 10px;
        color: #dfdfdf;
        text-align: center;
    }


    #menu a:hover {
    text-decoration: none;
        background-color: #82e353;}


    #menu ul a {
    height: 55px;
    width: 200px;
    background-color: #0d0d0d;
    text-align: left;
    padding-left: 10px;
         -webkit-transition-duration: 0.1s;
                       -moz-transition-duration: 0.1s;
                       transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
                       -moz-transition-timing-function: ease-out;
                       transition-timing-function: ease-out;}

    #menu ul a:hover {
        width: 180px;
        background-color: #82e353;
    padding-left: 30px;
          -webkit-transition-duration: 0.1s;
                       -moz-transition-duration: 0.1s;
                       transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
                       -moz-transition-timing-function: ease-out;
                       transition-timing-function: ease-out;}

    /*--menu1--*/
    #menu1 {position: absolute;
    top: 87px;
    margin-left: 35px;
    height: 150px;
        width: 331px;
    color: #9e9e9e;
    padding-left: 7px;
    padding-right: 7px;}

    #menu1 .module_menu_titre {height: 0px;
    font-size: 0pt;}
    #menu1 .module_menu_contenu {}

    .module_menu_type_lastvisitors {
        position: absolute;
    margin-left: -150px;
    width: 60px;
    top: 293px;}

    .module_menu_type_lastvisitors img {width: 50px;
    height: 50px;
    margin-bottom: 25px;
    border-radius: 25px 15px / 12px 18px;
    border: solid 4px #bababa;
    opacity: 0.6;}

    .module_menu_type_lastvisitors img:hover {opacity: 1;}

    /*--article--*/
    #content {width: 1000px;
    margin-left: 0px;}
    .module_titre_contenu, .module_titre_contenu a {
        height: 60px;
        width: 975px;
        background: linear-gradient( #363636, #262626);
    font-weight: lighter;
        font-family: arial;
        color: #bcfcaf;
        font-size: 22pt;
    text-decoration: none;
    text-align: left;
    border-radius: 3px 3px 0px 0px;
    text-shadow: 0px 2px 2px black;
    line-height: 220%;}

    .module_titre_contenu {
    padding-left: 25px;
    border-bottom: solid 4px #82e352;}

    .article_info { display: none;
    }

    .module_contenu {
        padding-top: 15px;
        padding-left: 15px;
        padding-right: 15px;
        padding-bottom: 10px;
        width: 970px;
        background-color: #fafafa;
    font-family:arial;
    font-size: 11pt;
    color: black;
    letter-spacing: 0.1pt;
    border-radius: 0px 0px 3px 3px;
    }


    .module_contenu a {
        color: #f05f88;
        font-weight: bold;
    }

    .module_contenu a:hover {
        color: #82e352;
    }

    .module_bottom {
        height: 40px;

    }

    /*--footer--*/
    #footer {
        height: 25px;
        font-size: 14px;
        color: black
            position: absolute;
    float: right;
    }

    #footer a {
        color: black;
    }

    #footer a:hover {
        opacity: 0.4;
    }

    #footer:after {content: "-  Design original by Elinae  -  © 2015";}

    /*--commentaire--*/

    .comment_normal, .comment_admin {

    width: 100%;

    }


    div.commentheader{
        background-color: #f9f9f9;
        margin-top: 10px;
        border-right: solid 1px #ebebeb;
    border-left: solid 8px #f57db5;
        border-top: solid 1px #ebebeb;
    }

    div.commentbody {
        background-color: white;
    padding: 5px 5px 7px;
    text-align: justify;
    margin-bottom: 25px;
     border-right: solid 1px #ebebeb;
    border-left: solid 8px #f57db5;
        border-bottom: solid 1px #ebebeb;}

    .comment_admin .commentnumber {
        color: #9a9a9a;
    font-family: impact;
    font-weight: lighter;
    font-size: 25px;}

    .commentnumber {
    float: left;
       color: #9a9a9a;
    font-family: impact;
    font-weight: lighter;
    font-size: 25px;
            font-variant: normal;
    text-align: left;
    padding-left: 10px;
    width: 35px;}

    .commentpseudo a {
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    .commentpseudo {
        line-height: 140%;
    float: left;
    padding-top: 5px;
    font-family: arial;
        font-size: 18px;}

    .comment_admin .commentpseudo {
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    .commentdate {float: right;
    font-size: 9pt;
    padding-top: 5px;
    padding-right: 5px;
    font-family: Arial, Helvetica, sans-serif;
    color: grey;
        opacity: 0.8;
        line-height: 200%;
    }

    .commentavatar img {border: 2px solid #9a9a9a;
    width: 90%;
    border-radius: 12px 25px / 13px 9px;
    box-shadow: 0px 0px 2px #9a9a9a;
    }


    /*--bouton--*/
    #background button, #background input[type=button], #background input[type=submit] {
    background-color: #54ca26;
    color: white;
    font-family: tahoma;
    font-size: 12pt;
    text-align: center;
    padding: 5px 15px 5px 15px;
    border: solid 0px black;}

    Pour installer le thème

      1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

      2. Choisir un seul menu à gauche.

      3. Ne pas mettre de slogan à votre blog.

      4. Ne mettre qu'un module dans votre menu en plus de celui des visiteurs.

      5. Copier, coller et appliquer les codes CSS du thème proposé.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1. le titre du blog est une image, pour qu'il y ai le titre de votre blog, demandez-le moi en commentaire ci-dessous faites le vous même, explication en dessous de l'encadré.

    2. Une fois que vous aurez l'image correspondant au titre de votre blog, placez ce code dans le code source HTML d'un module simple :

    <div class="bannimg"><img src="LIENDEVOTREIMAGE"/></div>

    Puis enregistrez.

    3. Eviter plus de 6 lignes de texte dans le module qui se trouve dans le header.

    4. Si vous avez un écran de moins de 1200px de large, vous ne pourrez pas voir le module "dernier visiteurs"..

    5. Ne pas mettre plus de 7 liens différent dans le menu du header [les liens en plus, mettez les dans le menu déroulant].

    Info, le nom de la police du titre (image) est: Allura. Le titre doit faire environ 410x120px (largeurXhauteur). Ecrivez le titre de votre blog avec la police Allura, faite le pivoter comme sur le screen puis ajouter une ombre portée à votre police de 5px (pas de décalage pour l'ombre). Enregistrer le titre SANS FOND (type render) au format .PNG.

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    11 mars 2015. Le thème n'est pas adapté aux écrans de 1000px de large et plus.


    250 commentaires
  • Thème en libre service #3 - Saber [Fate/Zero]

     

    Les Codes

    /*--fond fenêtre--*/
    #body {
    background-image:url("http://ekladata.com/4suYn_Yy23vMyMT_RR4e1lVBhb8.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center top;
    }

    /*--fond page--*/
    #background {
    background: rgba(0,0,0,.8);
    border-radius: 8px 8px 4px 4px;
    width: 1175px;
        margin-top: 355px;}

    /*--header--*/
    .bannimg  {position: absolute;
    top: 200px;
        margin-left: -50px;}

    #header {
    height: 41px;
    background: linear-gradient( #2a2a2a, #131313);
    border-bottom: 1px solid #1a1840;
    text-shadow: 1px 1px 0px black;
    margin-bottom: 15px;}

    #titre_header {font-size: 0pt;}

    /*--menu header--*/
    #menu {
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0px;
    left: 0px;
    }

    #menu li {
    float: left;
    }

    #menu a {
    color: #666666;
    display: block;
    height: 31px;
    width: 150px;
    padding: 5px 5px;
    line-height: 160%;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15pt;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    text-align: center;
    }

    #menu a:hover {color: #919191;}

    /*--menu1--*/


    #menu1 {width: 328px;
    padding-right: 30px;
    padding-top: 15px;}

    #menu1 .module_menu_titre {
    background: rgba(246,33,200,.4);
    border-radius: 5px 5px 0px 0px;
    text-shadow: 2px 1px 0px #400633;
    height: 19px;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: small-caps;
    color: white;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: 14pt;
    line-height: 90%;
    padding: 6px 25px 2px 5px;
    border-bottom: 1px dashed black;
    text-align: right;}

    #menu1 .module_menu_contenu {
    background: rgba(246,33,200,.2);
    border-radius: 0px 0px 5px 5px;
    color: white;
    margin-bottom: 35px;
    padding: 10px 10px;
    color: #cdcbcb;
    border-top: 1px dashed #f86bda;
    }

    #menu1 .module_menu_contenu a {
    color: #65b5ff;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    #menu1 .module_menu_contenu a:hover {
    opacity: 0.3;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    /*--article--*/

    .module_titre_contenu {    margin-left: 35px;}

    .module_titre_contenu, .module_titre_contenu a {
        margin-top: 35px;
        height: 35px;
    font-family: Impact;
    color: rgba(218,89,255,0.95);
    text-shadow: 1px 0px 0px black;
    font-size: 24pt;
    letter-spacing: 7pt;
    font-weight: lighter;
    line-height: 100%;
    font-style: normal;
    text-decoration: none;
    font-variant: small-caps;
    text-align: left;
    }

    .article_info {
    margin-top: 3px;
    padding-bottom: 10px;
    font-size: 7pt;
    color: #48a7ff;
    font-family: Arial, Helvetica, sans-serif;
    text-align: right;
    }

    .article_info a {
    color: #48a7ff;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    .article_info a:hover {
    color: rgba(218,89,255,0.95);
    }

    .module_contenu {
        margin-left: 30px;
        width: 740px;
    padding: 0px 10px 10px 10px;
    background: rgba(255,255,255,.15);
    border-radius: 0px 0px 4px 4px;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10pt;
    color: #efefef;
    text-align: justify;
    }


    .module_contenu a {
    color: #65b5ff;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    .module_contenu a:hover {color: #c8e0f8;}

    .module_bottom {
    margin-bottom: 30px;
    }

    /*--footer--*/
    #footer {
    clear: both;
    overflow: hidden;
    text-align: center;
    height: 39px;
    margin-top: 0;
    color: #919191;
    font-family: "MS Serif", "New York", serif;
    font-size: 9pt;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    line-height: 330%;
    }

    #footer a {color: #919191;}
    #footer a:hover {color: #efefef;}

    #footer:after {content: "  -  Design original by Elinae - © 2015";}

    /*--commentaire--*/

    .comment_normal, .comment_admin {

    width: 100%;

    }


    .comment_admin .commentnumber {
        color: #070605;}

    .commentnumber {
    float: left;
         color: #070605;
    width: 30px;
    font-weight: bold;
    font-size: 13px;
    padding-left: 5px;
    padding-top: 5px;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    text-align: left;
    font-family: "Times New Roman", Times, serif;
    }

    .commentpseudo a {
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    .commentpseudo {
    float: left;
    padding-top: 5px;
    font-family: "Palatino Linotype", "Book Antiqua",Palatino, serif;
        font-size: 10pt;}

    .comment_admin .commentpseudo {
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
    }

    .commentdate {float: right;
    font-size: 6.5pt;
    padding-top: 5px;
    padding-right: 5px;
    font-family: Arial, Helvetica, sans-serif;
    color: grey;
    }

    .commentavatar img {border: 1px solid white;
    width: 90%;
    border-radius: 7px 12px 7px 12px;
    box-shadow: 0px 0px 5px black;
    }

    .commentbody {padding: 5px 5px 7px;
    text-align: justify;
    }

    /*--derniers visiteurs--*/
    .module_menu_type_lastvisitors img {
    height: 42px;
    width: 42px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 10px;
    border-radius: 15px 17px 15px 17px;
    box-shadow: 0px 0px 3px black;
    border: 2px solid white;
    }
    .menu-lastvisitors-avatar {
        max-width: 100px;
    min-width: 30px;
    }

    /*--bouton--*/
    #background button, #backgroundinput[type=button],#backgroundinput[type=submit] {
    font-family: Georgia, serif;
    font-size: 15px;
    border-top: 0px solid black;
    border-right: 0px solid black;
    border-bottom: 0px solid black;
    border-left: 0px solid black;

    background-color: #0d0817;
    color: white;
    text-shadow: 1px 1px 0px #0f0f0f;
    padding-left: 17px;
    padding-right: 17px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 3px 3px 3px 3px;
    }

    /*--barre de recherche--*/
    #background input[type=text]:hover,#background select:hover, #backgroundtextarea:hover {
    background-color: #f6f6f6;
    }

    #background input[type=text], #backgroundselect,#background textarea {
    width: 85%;
    }

    #background input[type=text], #backgroundselect,#background textarea {
    border-top: 1px solid #DDDDDD;
    border-right: 1px solid #BBBBBB;
    border-bottom: 1px solid #BBBBBB;
    border-left: 1px solid #DDDDDD;
    font-family: Georgia, serif;
    font-size: 15px;
    color: #383737;
    }

    Pour installer le thème

      1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

      2. Choisir un seul menu à droite.

      3. Ne pas mettre de slogan à votre blog.

      4. Copier, coller et appliquer les codes CSS du thème proposé.

      5. NE PAS METTRE DE MENU DEROULANT

     

    Ce que vous devez faire et savoir en plus de copier le code

    1. le titre du blog est une image, pour qu'il y ai le titre de votre blog, demandez-le moi en commentaire ci-dessous.

    2. Une fois que vous aurez l'image correspondant au titre de votre blog, placez ce code dans le code source HTML d'un module :

    <div class="bannimg"><img src="LIENDEVOTREIMAGE"/></div>

    Puis enregistrez.

    3. Il y a un petit bug que je n'ai pas pu régler avec ce thème, lorsqu'on édite un article ou qu'on écrit un commentaire, le fond et la couleur de la police sont claires, il est donc difficile de tout lire (mais dans ce cas il suffit de cliquer sur "Activer/Désactiver l'apparence du thème" qui a une icône en forme de palette [pour peindre]). 

     Pour info : la police du titre (image) est Bebas Neue

    Image Image Image Image Image Image

     

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    Le thème date de décembre 2014. Le thème n'est pas adapté aux écrans de moins de 1200px de large


    162 commentaires
  •  

    Les Codes

    #content {    line-height1.4em;}

    @font-face {font-family"nathaniel";
        srcurl('http://ekladata.com/Pfv8RPwS_IqupMJaS8KZVKMaoHo/Nathaniel.ttf');


    #body {background-image:url("http://ekladata.com/lwub4gMoVNWU7qMVd4is5Ej67cI.png");
        background-positioncenter top;
    background-repeatrepeat;
    background-attachmentfixed;
    font-familyarial;
    text-alignjustify;}

    #body a {font-weightnormal;
    font-stylenormal;
    text-decorationnone;
    font-variantnormal;}

    #background {width1000px;
        background-color#fbf2d9;
    box-shadow0px 0px 5px black;}

    #header {    background-image:url("http://ekladata.com/TJQUMT6I_4B6DqUBNAwLNnHMzQI.png");
        background-positioncenter top;
    background-repeatno-repeat;
    background-attachmentabsolute;
    height415px;}

    #titre_header {font-family"nathaniel";
    color#faffe4;
    text-shadow0px 0px 5px #493e44;
    font-size40pt;}

    #titre_header {position: absolute;
    top: 210px;
    margin-left: 420px;}

    #slogan_header {font-family"arial";
    color#faffe4;
    font-size8pt;
    letter-spacing1pt;
    text-shadow0px 0px 3px #493e44;}

    #menu1 .module_menu_titre {background-color#ed6556;
    colorwhite;
    font-family"times new roman";
    text-shadow0px 0px 2px white;
    text-alignleft;
    padding-left25px;
    padding-top5px;
    height: 25px;}

    #menu1 .module_menu_contenu {background-color#ed6556;
    color#f8d8d2;
    padding0px 5px 5px;
    margin-bottom30px;}

    #menu1 {width200px;
    margin-top0px;
    margin-left15px;}

    .module_titre_contenu.module_titre_contenu {
        height: 35px;
        font-family"Times New Roman"Timesserif;
    font-size25pt;
    font-weightnormal;
    font-stylenormal;
    text-decorationnone;
    font-variantsmall-caps;
    text-aligncenter;
    color#42343b;
    text-shadow0px 0px 1px #42343b;}

    .article_info {margin-bottom: 15px;
        text-aligncenter;
        height10px;
        font-size8pt;
        colorblack;
        opacity0.6;
    margin-top-5px;}

    .article_info a:hover {color#ed6556;}


    #content {margin-left235px;
    margin-right15px;
    margin-top0px;}

    #menu1 {color#fee5a8;}
    #menu1 a:hover {color#d6d6d6;}

    .article_text {font-familyarial;
    font-size10pt;}

    .article_text {color#dc4c46;
    font-weightbold;}
    .article_text a:hover {color#66674c;}

    .module_contenu_block>{color#ea9174;}
    .module_contenu_block>a:hover {color#f6be6c;}


    .commentbody {    font-familyarial;
    font-size10pt;
    font-styleitalic;
    color#6a6a6a;
    padding-left10px;
    background-color#fadb89;
    border-radius0px 0px 45px 18px;
    margin-bottom20px;
    padding-right: 15px;}

    .commentavatar img {border-radius15px 32px 32px 15px;
    bordersolid 3px #ed6556;}

    .commentpseudo a{color:#ff4946;}

    .commentdate {font-familyarial;
    colorblack;
    opacity0.2;}

    .commentnumber {padding-left15px
        font-family'times new roman';
    font-weightbold;
    colorblack;
    padding-right: 15px;}

    .commentheader margin-top5px;
        background-color#fadb89;
    border-radius38px 23px 0px 0px;}


    .comment_admin .commentnumber {colorwhite;}
    .comment_admin .commentheader background-color#474145;
    border-radius38px 23px 0px 0px}

    .comment_admin .commentbody {color#d6d6d6;
        background-color#474145;
    border-radius0px 0px 45px 18px;}


    .commentavatar {padding-right5px;
    padding-left5pxpadding-bottom10px;}

    .comment_admin .commentavatar img {bordersolid 3px #e9e9e9;}
    .comment_admin .commentdate {font-familyarial;
    colorwhite;
    opacity0.2;}
    #footer:after {content"  -  Design by Elinae - © 2014";}

    ::-webkit-scrollbar {height0px;
    width9px;
    background-colorwhite;}

    ::-webkit-scrollbar-thumb:vertical {background-color#444147;}

    #footer height20pxcolorblack;
    opacity0.7;
    font-family"times new roman";}
    #footer {colorblack;
    font-family"times new roman";
    margin-left: 15px;}

    #footer a:hover {color#e7524c;
    font-family"times new roman";}

    Pour installer le thème

      1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

      2. Choisir un seul menu à gauche.

      3. Copier, coller et appliquer les codes CSS du thème.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1. Le code pour que la police du titre du blog soit visible par tous ne fonctionne pas toujours.

    2. Eviter de mettre des liens dans le menu du header. 

      

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    Le thème date de l'été 2014. Le thème adapté aux écrans de moins de 1000px de large et plus


    107 commentaires
  •  

    Les Codes

    #content {    line-height1.4em;
    }
     
    #background {width: 1000px;}

    #body {background-image:url("http://ekladata.com/mXC5_pYihKTvaOGyFwGxnp9DxHQ.jpg");
        background-positioncenter top;
    background-repeatno-repeat;
    background-attachmentabsolute;
    background-color#c1c2c2;
    font-familyarial;
    text-alignjustify;}

    #header {background-image:url("http://ekladata.com/l_LNeb5L5FBtt8tPswGXkepIDOM.png");
        background-positioncenter top;
    background-repeatno-repeat;
    background-attachmentabsolute;
    background-color#c1c2c2;
    height475px;}

    #footer {color#bebebe;}
    #footer {font-family"MS Serif";
        font-size10px;
            color#bebebe;}

    #background {background-color#d8d8d8;}

    #menu1 {background-color#e3e3e3;
        positionrelativetop-50px;
    width200px
    margin-right: 0px;}

    #menu1 .module_menu_titre {height: 30px;
    font-family: 'Book Antiqua';
    letter-spacing: 0.6pt;
    text-align: right;
    font-size: 13pt;
    padding-right: 10px;
    text-shadow: 0px 0px 1px #444444;}

    #menu1 .module_menu_contenu {
    margin-top0px;
    margin-bottom25px;
        margin-right10px;
    padding0px 0px;
    margin-left5px;
    font-familyarial;
    font-size11px;}

    #menu1 {font-weightbold;
    colorblack;}

    .module_contenu {margin-top0px;
    margin-bottom35px;
        margin-right10px;
    padding5px 5px;
    margin-left10px;}

    .module_titre_contenu,.module_titre_contenu {height:25px
        font-weightnormal;
    font-size24px;
    font-family"MS Serif""New York"serif;
    font-stylenormal;
    text-decorationnone;
    font-variantsmall-caps;
    color#333232;
    text-aligncenter;}

    .article_info {font-weightnormal;
    font-size12px;
    font-family"Arial";
    font-stylenormal;
    text-decorationnone;
    font-variantsmall-caps;
    color#a5a1a2;
    text-aligncenter;
    margin-bottom: 10px;}

    .article_info {color#a5a1a2;}
    .article_info a:hover {color#555354;}

    .module_menu_type_lastvisitors img {test-aligncenter;
        width40px;
        height40px;
    border-radius 20px 20px 20px 20px;
    -WEBKIT-TRANSITIONALL 0.2S EASE
        -MOZ-TRANSITIONALL 0.2S EASE
        -O-TRANSITIONALL 0.2S EASE;}

    .module_menu_type_lastvisitors img:hover {opacity0.2;
    -WEBKIT-TRANSITIONALL 0.2S EASE
        -MOZ-TRANSITIONALL 0.2S EASE
        -O-TRANSITIONALL 0.2S EASE;}

    #footer {height: 30px;}
    #footer:before {
    content"Design by Elinae - © 2014 - ";}

    .commentnumber {margin-right: 15px;}

    Pour installer le thème

      1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez sauf > ça <.

      2. Choisir un seul menu à droite.

      3. Copier, coller et appliquer les codes CSS du thème.

     

    Ce que vous devez faire et savoir en plus de copier le code

    1. Le titre "KG PROJECT ERROR" ne peut pas être changé.

    2. Le thème est entièrement en noir et blanc, à vous de voir si vous voulez ajouter de la couleur. 

    3. Eviter de mettre des liens dans le menu du header. 

      

    En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.

     

    Le thème date d'août 2014. Le thème adapté aux écrans de moins de 1000px de large et plus


    75 commentaires


    Suivre le flux RSS des articles de cette rubrique
    Suivre le flux RSS des commentaires de cette rubrique