libre service ; thème 1

libre service ; thème 1

Written by Weana in libre service de thèmes on 4 September 2020 à 22:48

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

« dessins traditionnels (01)041020 — page 30 »
Comments
1

Fabule

Saturday 5th September 2020 at 15:47
il est super joli!
Répondre
2

Pioupioupioupiou

Sunday 27th September 2020 at 17:47
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.
Répondre

Voir les réponses

Weana

Sunday 27th September 2020 at 17:57

salut :)

ce thème ci est fait pour eklablog, je sais pas sur quelle plateforme tu essayes de l'installer. Si c'est sur eklablog il faut que tu crée un nouveau module dans ton menu (il faut donc que ton blog ait un menu) et que tu ajoutes l'htlm dans l'onglet "code source" (< >).

Désolée si mes explications ne sont pas très claires.
3

Pioupioupioupiou

Sunday 27th September 2020 at 18:04
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.
Répondre
4

Huen

Tuesday 13rd October 2020 at 19:42
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 ? ;-;
Répondre

Voir les réponses

Weana

Wednesday 14th October 2020 at 11:15

hehe merci :)

en soi oui c'est possible mais toute la structure du code repose sur la taille du contenu, si j'agrandis la propriété #body, il faudra changer beaucoup d'autre choses. Si t'es à l'aise en CSS tu peux le faire toi-même, sinon je peux essayer mais je suis pas mal occupée en ce moment donc ça prendra quelques jours.

Huen

Wednesday 14th October 2020 at 18:52

Oulà moi et le css ;-; je veut bien que tu essaye TwT je suis pas prete de remtre mon blog en ligne de toute façon donc t'inquiète pas !
5

Shemi

Friday 4th December 2020 at 02:00
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 !
Répondre

Name / User name:

E-mail (optional):

Website (optional):

Comment:

Contact me in case of response
6

noisette grillée

Thursday 20th May 2021 at 00:54
Bonsoir merci du partage, je te le prends !
Répondre

Voir les réponses

Weana

Thursday 20th May 2021 at 09:08

Coucou,

alors c'est très gentil mais je vois que t'es allée prendre de codes également chez Fabule et que tu as mixé nos deux thèmes pour faire le mien. Pour être amie avec Fabule et pour avoir déjà emprunté des thèmes LS sur son blog, je sais qu'elle ne veut pas qu'on modifie ses thèmes, c'est explicitement précisé. Ce n'est marqué nul part chez moi mais je trouve que c'est un peu limite d'aller faire son marché de codes chez les uns et chez les autres. Le thème que j'ai fait est réalisé pour être installé tel quel, à la limite les couleurs peuvent être modifées et les marges agrandies mais c'est tout, là tu as utilisé mes codes pour faire carrément autre chose et je t'avoue que ça ne me plait pas trop. Surtout que tu n'as demandé ni à Fabule ni à moi avant de modifier nos codes.

noisette grillée

Thursday 20th May 2021 at 22:07

Bonsoir, excuse moi je ne pensais rien de mal en faisant cela, je vais retirer tout tout de suite et régler de la bonne façon, merci de m'avoir prévenue !!

Je m'excuse encore de ne pas avoir prévenue et de paraitre voleuse ce n'était absolument pas mon intention, j'admire grandement votre travail et votre temps passé dessus, mes excuses encore une fois..
7

✩Lunny☽

Sunday 9th January 2022 at 18:59
Ce thème est tout simplement magnifique ^^ je pense l'utiliser pour mon rpg Harry Potter (si j'arrive à l'installer)
Répondre
Suivre le flux RSS des commentaires

Add comment

Name / User name:

E-mail (optional):

Website (optional):

Comment:

Contact me in case of response

libre service ; thème 1

Comments