(+) Pour changer le titre, demandez moi et donnez moi le votre, je le ferais aussi vite que possible!
(+) Il faut que toutes les valeurs soit à zéro et décochées, sauf format du blog > page > automatique centré et contenu > forums - messages > marges extérieures d'un blog message
(+) Vous pouvez changer les couleurs si elles ne vous plaisent pas. Si vous avez besoin d'aide, n'hésitez pas! (je peux modifier une image pour vous, si vous voulez qu'elle s'accorde à peu près avec le thème)
(+) Les "XXXXXXXX" module_menu_contenuXXXXXXXX sont à remplacer par le "numéro" de votre module. Voici un tuto qui pourrait vous aider ici! Et si jamais, je suis joignable pour toute question.
(+) Le blog a deux menus, le deuxième menu est à largeur 0px et c'est dedans qu'on mettre les modules personnalisé qu'on mettra sur le haut du blog
(+) Si vous avez le moindre soucis, n'hésitez pas à m'envoyer un message ou à poster un commentaire!
CODE CSS:
@font-face {font-family: "novab";
src: url('https://ekladata.com/QRv_HTuPAUTxaFyUohFWpThI1aY/Proxima-Nova-Bold.otf');}
@font-face {font-family: "roboto";
src: url('https://ekladata.com/VcFzXkCFCJ4uo7A-mAn7kzw7Xbc/Roboto-BoldCondensed.ttf');}
@font-face {font-family: "robotoBI";
src: url('https://ekladata.com/Z5B6_aSg_DAeSfa--kAjF4QNQTs/Roboto-BlackItalic.ttf');}
#body {
background:url('https://ekladata.com/w_DpN64vYAuJxEXbFyEu1l9u86w/bande-menu.png') repeat-x 50% 0%,
url('https://ekladata.com/7Bi8_ewvtm3JvVZb3O4tRpswAC8/fond-page.png') repeat-y 50% 0%,
url() repeat left bottom;
background-color: #0C0C0C;
font-family: calibri;
font-size: 13px;
border-bottom: 0px solid black;
}
#body a {
font-weight: bold;
text-decoration: none;
-webkit-transition: all 0.7s ease;
-moz-transition: all 0.7s ease;
-o-transition: all 0.7s ease;
}
body a:hover {
-webkit-transition: all 0.7s ease;
-moz-transition: all 0.7s ease;
-o-transition: all 0.7s ease;
}
.module_contenu img {text-align: center;
margin 0px;
}
#background {
width: 1000px;
}
#header {
height: 500px;
margin-top:61px;
background:url('https://ekladata.com/rvuxM9lbK9_7g30S7udrMEXdm4g/header-test-evelynn-gifFINAL.gif');
border-top: 5px solid #350B1B;
}
.img_header{
position: absolute;
top: 0px;
margin-left: -195px;
}
#menu a{
text-transform: uppercase;
color: #aaa;
border-right: 1px solid #222;
letter-spacing: 3px;
width: 260px;
height: 35px;
margin-top: -65px;
margin-right: 5px;
padding-top: 20px;
padding-bottom: 5px;
text-align: center;
font-family: "roboto";
font-size: 20px;
}
#menu li a:after{
margin-left: 40px;
color: #444;
content: " V";
font-size: 19px;
padding-right: 3px;
}
#menu ul li a:after{
content: " ";
font-size: 13px;
padding-right: 3px;
}
#menu a:hover{
padding-bottom: 5px;
opacity: 0.8;
}
#menu li {
min-height: 20px;
width: 267px;
border-right: 0px;
}
#menu ul {
border-top: 5px solid #230712;
background: #111;
color: #555;
margin-left: -6px;
width: 267px;
}
#menu ul a {
padding: 5px;
font-size: 13px;
text-align: left;
color: #555;
border-right: 0px solid #fff;
border-bottom: 1px solid #222;
letter-spacing: 1px;
font-size: 12px;
}
#menu ul a:hover {
background-color: #222;
color: #aaa;
padding-left: 15px;
}
.video_menu {
padding: 50px;
background:url('https://ekladata.com/RaM-RTL1GOxvPEdueCGfh67ahcY/fond-video.png') center no-repeat;
}
.actu_menu{
width: 400px;
padding: 30px;
margin-left:15px;
background:url('https://ekladata.com/0xoUfpqsmCc5X2u75G4BIj9oUwg/fond-contexte.png') left center no-repeat;
}
#menu1 {
text-align: justify;
width: 224px;
color: #969696;
}
#menu1 .module_menu_titre {
padding: 20px;
height: 20px;
font-family: 'roboto';
text-transform: uppercase;
text-align: center;
letter-spacing: 2px;
font-size: 15px;
background-color: #090909;
border-bottom: 5px solid #240813;
}
#menu1 .module_menu_contenu {
background-color: #0C0C0C;
margin-bottom: 50px;
padding: 15px;
}
.liens a{
display: block;
background: #080808;
color: #888;
padding: 5px;
margin-top: 6px;
border-radius: 3px;
text-align: center;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 1px;
}
.liens a:hover{
background: #2B1420;
}
.module_menu_type_lasttopics a {
color: #553E44;
font-size: 11px;
text-transform: uppercase;
}
.module_menu_type_lasttopics li{
background-color: #090909;
padding: 5px;
border-radius: 3px;
margin-bottom: 3px;
}
.module_menu_type_lasttopics a:hover {
color: #2B4E5A;
}
.module_menu_type_lastvisitors {
margin-top: 50px;
font-size: 0px;
margin-bottom: 50px;
}
.module_menu_type_lastvisitors .module_menu_contenu {
padding: 12px;
}
.module_menu_titre_type_lastvisitors {
width: 200px;
}
.module_menu_type_lastvisitors img {
max-width: 60px;
margin-bottom: 5px;
margin-right: 1.5px;
border-radius: 50px;
padding: 2px;
border: 1px solid #86214A;
margin: 10px;
}
.module_titre {
background-color: #0E0E0E;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.module_titre_contenu{
height: 100%;
font-family: "roboto";
text-transform: uppercase;
padding-top: 25px;
padding-bottom: 50px;
text-align: left;
font-size: 18px;
letter-spacing: 2px;
background:url('https://ekladata.com/5hVXSBSVOxrpt4tc56DkzmnEgDk/titre-article.png') left bottom no-repeat;
color: #B4B2B1;
padding-left: 30px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.module_titre_contenu a{
min-height: 50px;
color: #B4B2B1;
padding-left: 10px;
padding-bottom: 10px;
letter-spacing: 2px;
word-spacing: 3px;
text-transform: uppercase;
}
.module_titre_contenu a:hover{
color: #B4B2B1;
opacity:0.5;
}
.article_info {
font-size: 0px;
color: #DCDCDC;
opacity: 0.5;
text-align: right;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 30px;
}
.module_contenu {
background-color: #0E0E0E;
color: #C1C1C1;
text-align: justify;
font-family: calibri;
font-size: 12px;
padding: 20px;
border-bottom-right-radius:5px;
border-bottom-left-radius: 5px;
margin-bottom: 50px;
}
.module_contenu a {
color: #2B4E5A;
text-transform: uppercase;
font-size: 11px;
}
.module_contenu a:hover {
color: #422F35;
}
.article_info a{
font-size: 0px;
}
.module_bottom {}
#footer {
height: 400px;
color: #333;
text-align: right;
padding-right: 20px;
text-transform: uppercase;
font-size: 11px;
font-family: calibri;
letter-spacing: 1px;
}
#footer a {
color: #333;
}
#footer a:hover {
color: #2B4E5A;
}
#footer:after {content: " Thème de Fabule";}
.comment_normal, .comment_admin {
width: 100%;
}
div.commentheader{
background-color: #141414;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
margin-bottom: 8px;
margin-top: 28px;
font-family: arial;
padding: 5px;
position: relative;
}
.comment_admin .commentheader{
background-color: #0D0E12;
}
div.commentbody {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
background-color: #191919;
padding: 10px;
color: #999999;
margin-top: -10px;
}
.comment_admin .commentbody {
background-color: #141414;
color: #555555;
padding: 10px;
}
.block-reply {
border-left: 3px solid #202020;
}
.comment-reply a{
color: #344A53;
font-weight: bold;
font-family: calibri;
text-transform: uppercase;
font-size: 10px;
letter-spacing: 1px;
}
.comment-reply a:hover{
color: #888;
}
.commentnumber {
font-family: "novab";
color: #344A53;
font-size: 15px;
padding-left: 5px;
opacity: 0.6;
}
.commentpseudo {
font-family: calibri;
color: #444;
margin-top: 3px;
font-size: 13px;
letter-spacing: 1px;
text-transform: lowercase;
}
.commentpseudo a {color: #555; font-weight: 600;}
.commentpseudo a:hover {color: white; opacity: 0.5;}
.commentavatar {
margin-right: 10px;
margin-top: -35px;
position: relative;
padding: 5px;
}
.commentavatar img {
border: 3px solid #141414;
border-radius: 100px;
}
.block-reply li .commentavatar {
margin-right: 5px;
margin-top: -5px;
position: relative;
padding: 5px;}
.commentdate {
font-size: 0px;
opacity: 0.5;
color: white;
}
input[type=button],input[type=submit], button {
margin: 9px;
margin-left: 0px;
min-width: 10px;
min-height: 20px;
background-color: #191919;
font-weight: bold;
color: #999999;
font-family: calibri;
border: 3px solid #191919;
text-transform: uppercase;
font-size: 11px;
letter-spacing: 2px;
border-radius: 5px;
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {
opacity: 0.7;
}
#help_bubble {
background-color: #111;
color: #999;
border: 1px solid #222;
border-radius: 5px;
opacity: 0.7;
}
.post_table_msg {
background-color: #151515;
padding: 10px;
border-bottom: 0px solid #222222;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
.post_table_head {
color: #3A3A3A;
font-size: 0px;
}
.post_table_profile img{
border: 2px solid #272727;
margin-left: 10px;
margin-top: -7px;
margin-bottom: 10px;
padding: 0px;
border-radius: 50px;
}
.post_table_profile a{
color: #555;
font-family: calibri;
text-transform: uppercase;
display: block;
width: 79px;
background-color: #151515;
margin-top: 15px;
margin-left: 10px;
text-align: center;
border-radius: 3px;
margin-top: 15px;
margin-left: 10px;
text-align: center;
}
.post_table_profile a:hover{
color: #555;
opacity: 0.8;
}
.post_table_profile {
background:url('https://ekladata.com/7Bi8_ewvtm3JvVZb3O4tRpswAC8/fond-page.png') left center repeat-y;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
opacity: 0.7;
border-bottom: 0px solid #000;
}
.forum-description {
background-color: #191919;
margin-top: 20px;
margin-bottom: 20px;
padding: 10px;
border: 4px double #111111;
}
input[type="text"] {
width: 90%;
height: 25px;
color: #888;
border: 1px solid #151515;
background: #090909;
border-radius: 5px;
}
.form_cavom{
color: #888;
border: 1px solid #151515;
background: #090909;
border-radius: 5px;
}
.scroll {
background-image: url('https://ekladata.com/g0EY1MKL8ufxXM7w_CSCIUIdJqg/super-fond-hihi.png');
color: #9D9D9D;
border: 3px solid #242B27;
border-radius: 3px;
padding: 10px;
margin-bottom: 5px;
height: 150px;
overflow-y: auto;
text-align: justify;
box-shadow: -1px 2px 10px 3px #0B0B0B inset;
}
.cadre {
background-image: url('https://ekladata.com/g0EY1MKL8ufxXM7w_CSCIUIdJqg/super-fond-hihi.png');
color: #9D9D9D;
border: 3px solid #0C0C0C;
border-radius: 3px;
padding: 10px;
margin: 5px;
margin-bottom: 5px;
overflow-y: none;
text-align: justify;
font-family: calibri;
box-shadow: -1px 2px 10px 3px #0B0B0B inset;
}
MENU DU HAUT - CSS:
MENU DU HAUT - HTML:
MENU SOUS LE HEADER - CSS:
MENU SOUS LE HEADE - HTML:
CODE HTML POUR LES LIENS MENU
<div class="liens">
<p><a href="#">lien 1</a></p>
<p><a href="#">lien 2</a></p>
<p><a href="#">lien 3</a></p>
</div>