-
libre service ; thème 1
thème libre service 01
J'inaugure cette rubrique avec un premier thème en full CSS/HTML. Il est assez minimaliste, je suis mauvaise pour faire des thèmes avec header. C'est les résidus d'un ancien thème d'un de mes RPG qui trainaient sur un blog test.
Vous pouvez visualiser le thème dans sa totalité en cliquant ici (www)
à savoir :
> Toutes les valeurs de l'éditeur de thème doivent être décochées/à zéro.
> Les couleurs et l'image du menu sont modifiables via le code. Je peux le faire pour vous si vous le souhaitez.
> le texte du menu doit rester relativement court puisque la taille de ce dernier est fixe. À part les derniers visiteurs, tout le reste est dans le même module.
Merci de ne pas retirer le crédit présent sur le menu, de préciser quelque part que le thème est de moi et bien sûr de me prévenir en commentaire si vous l'utilisez.
> edit : merci de ne pas modifier ce thème au delà des limites que j'ai fixé plus haut, j'y ai passé du temps, ce n'est pas pour que vous piquiez dans mon code pour faire carrément autre chose, à la limite, demandez au préalable et je verrais en fonction.
CSS:
/*entête déclarative*/
@font-face {font-family: "fox"; src: url('http://ekladata.com/H8mc56Q58KFb5qJ4juVJqwX5Tlk/SONGER-C-Regular.otf');}
@font-face {font-family: "great"; src: url('http://ekladata.com/Bubm7ggaaIYvR0yj4XFPGqcanZk/Great-Day-Personal-Use.ttf');}
/*fonds*/
#body { background:transparent url("http://ekladata.com/-g7dOf8A-03F1rc4M-8CgDh5NY8/concrete-texture.png")center top ;
height:100%;
position:fixed;}
#background {background: #eaeaea;
width: 800px;
margin-top:80px;
overflow: auto;
height:600px;
margin-bottom:none;
}
/*textes*/
#background a{font-family: arial;
font-size:12px;
text-transform:lowercase;
}
#background a:hover{font-family: arial;
font-size:10px;
color: #596e71;
text-transform:uppercase;
text-decoration: none;
}
#background {font-family: arial;
font-size:12px;
color:#221d19;
text-align: justify;
}
/*header*/
#header {
height:0px;}
#titre_header a {display: none;}
#slogan_header {display: none;}
/*menubar*/
.menubar_separation, #menubar_logo {
background:#1a1a1a;
color:white;}
.menubar_section > div, .menubar_section:hover div,.menubar_section:hover > a {
background:#1a1a1a;
color:white;}
#menubar a{background:#1a1a1a;
color: #a6c0c3;
text-transform:uppercase;
font-size: 10px;}
#menubar {background:#1a1a1a;
color: white;}
#menubar_section_content{background-image: none;}
#menubar_section_appearance{background-image: none;}
#menubar_section_interactions{background-image: none;}
#menubar_section_manage{background-image: none;}
#menubar_section_account{background-image: none;}
#menubar_notifications{background-image: none;}
#menubar_signin {background-image: none;}
#menubar_favorites {background-image: none;}
.menubar_button {background-image: none;}
#menubar_hide { position: absolute; width:0px }
.menubar_section{
font-style: none;
color:white;}
/*infobulle*/
#help_bubble {
background-color: #222;
color: #aaa;
border: 1px solid #111;
opacity: 0.7;
border-radius: 2px;
text-transform:uppercase;
}
/*boutons*/
input[type=button],input[type=submit], button {
margin: 5px;
margin-left: 0px;
min-width: 50px;
min-height: 20px;
background-color: #788895;
color: white;
border: 0px;
text-transform: lowercase;
font-weight: bold;
letter-spacing: 1px;
font-size: 11px;
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {
opacity: 0.8;
text-transform:uppercase;
}
/*****menu1******/
#menu1 {background: #1e1e1e;
padding-left: 15px;
padding-right: 15px;
width:200px;
margin-top:0px;
height:600px;
position: fixed;
overflow: none;
color:white;
}
#menu1 a:hover {color:#172528;
text-transform: uppercase;
font-weight:bold;}
#menu1 a {color:white;
text-transform: uppercase;
font-weight:bold;}
/* titre */
.module_menu_contenu {padding:15px;}
.module_menu_titre {display:none;}
/* derniers visiteurs */
.module_menu_type_lastvisitors img{
border-radius: 100px;
background-color: white;
max-height: 30px;
max-width: 30px;
margin-bottom: 5px;
padding: 3px;
}
#module_menu_type_lastvisitors img:hover{
opacity: 0.7;
}
/* titre articles*/
.module_titre {
height: 20px;
color: white;
text-align: center;
padding:15px;
font-family: arial;
font-size: 12px;
letter-spacing: 2px;
word-spacing: 1px;
border: 4px solid white;
margin-top:30px;
margin-right:30px;
margin-left:30px;
text-transform:lowercase;
background-color: #596e71;
}
.module_titre:hover {
height: 20px;
color: white;
text-align: center;
padding:15px;
font-family: arial;
font-size: 12px;
letter-spacing: 2px;
word-spacing: 1px;
border: 4px solid white;
margin-top:30px;
margin-right:30px;
margin-left:30px;
text-transform:lowercase;
background-color: #596e71;
}
.module_titre_contenu a { color: white;
text-align: center;
font-family: arial;
font-size: 10px;
letter-spacing: 2px;
word-spacing: 1px;
text-transform:lowercase;}
.module_titre_contenu { color: white;
text-align: center;
font-family: arial;
font-size: 13px;
letter-spacing: 2px;
word-spacing: 1px;
text-transform:lowercase;}
/*articles*/
.module_contenu {background: #dcdcdc;
margin-left: 30px;
margin-right: 30px;
margin-bottom:30px;
margin-top: 10px;
padding: 15px;
color:#221d19;}
.module_contenu a {color: #596e71;}
/*infos articles*/
.article_info {display:none;}
/*commentaires*/
.commentdate {display:none;}
.commentnumber {display:none;}
.commentavatar img {
border: 3px solid;
border-radius: 100px;
margin-left: 0px;
max-height: 40px;
max-width: 40px;
}
div.commentbody {margin-top:10px;}
/*pied de page*/
#footer {
display: none;}
/*champs*/
input[type="text"] {
padding:5px;
color: grey;
border: 1px solid #ccc;
background: #f0f0f0;
border-radius: 0px;
}
/******forums*****/
.post_table_msg {
background-color: #F9F9F9;
padding: 20px;
text-align: left;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
border:1px solid #ebebeb;
witdh:50%;
text-align:justify;
}
.post_table_head {color: #black;
font-size: 0px;
}
.post_table_profile img{
border: 4px solid white;
width: 50px;
border-radius: 50px;
margin-left: 25px;
margin-top: 10px;
margin-bottom: 20px;
}
.post_table_profile a{
color: white;
font-size: 13px;
font-family: consolas;
text-transform: uppercase;
display: block;
width: 76px;
padding: 2px 0px 2px 0px;
background-color: #788895;
text-align: center;
border-radius: 50px;
margin-top: 20px;
margin-left: 11px;
text-align: center;
}
.post_table_profile a:hover{
opacity: 0.7;
color: white;
}
.post_table_profile {
background-color: none;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}
#module_contenu_pageforums {text-align: justify;}
.topic_table {text-align:center;
width:100%;}
.forum-description {
background-color: #f1f1f1;
border: 1px solid lightgrey;
margin-top: 20px;
margin-bottom: 20px;
padding: 10px;
border-radius: 0px;
color: #333333
}
.block-reply {
border-left: 3px solid #ebebeb;
}
HTML MENU:<p style="text-transform: uppercase; font-size: 7px; text-align: center;"><span style="color: #4f4f4f;">(c) thème original de weana</span></p>
<p style="text-transform: uppercase; font-size: 7px; text-align: center;"> </p>
<p><img style="display: block; margin-left: auto; margin-right: auto; border-radius: 100px; border: 6px solid white; border-width: 6px;" src="http://ekladata.com/8ehsu8jVpYOz4bydXS0MmIWRJg0@100x100.jpg" alt="" width="100" height="100" /></p>
<p style="text-align: center;"><span style="font-size: 24pt; color: #ffffff;"><span style="font-family: 'great';">titre du blog</span></span> </p>
<p style="text-align: center;"><strong><span style="color: #788895;"><a style="color: #788895;" href="/www">LIEN</a></span> ; <span style="color: #788895;"><a style="color: #788895;" href="/www">LIEN</a></span> ; <span style="color: #788895;"><a style="color: #788895;" href="/www">LIEN</a></span></strong></p>
<p style="text-align: center;"> </p>
<div style="background-color: #333333; border: 1px solid drakgray; padding: 10px; text-align: justify;"><span style="color: #ffffff;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin dapibus erat nisi, nec consectetur orci tincidunt ut. </span></div>
<p style="text-align: center;"> <br /><br /></p>
<div style="background-color: #788895; width: 100%; padding: 6px; text-align: left;"><a href="http://theme-ls-1.cd.st/accueil-c32649478">accueil</a></div>
<p style="text-align: center; line-height: 10px;"> </p>
<div style="background-color: #788895; width: 100%; padding: 6px; text-align: left;"><a href="http://theme-ls-1.cd.st/forum-forum117304">forum</a></div>
<p style="line-height: 10px;"> </p>
<div style="background-color: #788895; width: 100%; padding: 6px; text-align: left;"><a href="/url du lien">LIEN 3</a></div>
<p style="text-align: center; line-height: 10px;"> </p>
<div style="background-color: #788895; width: 100%; padding: 6px; text-align: left;"><a href="/url du lien">LIEN 4</a></div>la bise,
Wea
-
Comments
Allô, ton thème de blog me plait beaucoup et j'essaie de l'installer sur mon blog, sauf que j'ai un petit souci : je ne sais pas où coller le code HTML du menu ! Est-ce qu'il faut que je le place à la suite du CSS ? Parce que j'ai essayé mais ça marque "erreur" -_-
Merci beaucoup, d'avance !
Piou.
Salut :)
Je viens de comprendre ! Oui, c'est sur Eklablog, mais j'avoue que je connais rien dans ce domaine haha :')
Merci beaucoup, du coup j'utilise ton thème, je te crédite aussi dans la partie "Crédit"
Piou.
BWAHA CE BLOG EST TELLEMENT BIEN POURQUOI JE SUIS PAS VENUE ICI AVAAAANT
Ducoup ducoup j'essaye d'installer ce thème bcp trop bg est est ce que c'est possible d’agrandir la fenetre ? pour qu'elle soit plus grande ? ;-;
Coucou hello bonsoir !
Magnifique thème, j'adore ce côté vintage.
Je recommence mon blog et je préviens que j'ai installé ton thème parce que je l'aime énormément <: Merci beaucoup pour ton travail !
Ce thème est tout simplement magnifique ^^ je pense l'utiliser pour mon rpg Harry Potter (si j'arrive à l'installer)
Add comment
il est super joli!