-
Salut.
Yo l'ami. Nouveau thème en LB, parce qu'on chôme pas ici. Et je préfère faire ça que de réviser pour le bac blanc. Donc voici, un thème vert et orange tout beau, pour page en 900px, et trois modules de menu.
Aussi, j'ai pas trouvé de bon moyen de caler un lien vers les forums, mais ils sont aussi codés (légèrement, mais tu connais) : ici.
-> j'ai trouvé les images du sites en tapant sur google image "orange and green aesthetic".
(mon compte principal : ライラック)
INSTALLER CE THÈME SUR MON BLOG
- avant d'appliquer le code CSS, veillez à désactiver tout ce qui est coché dans les différentes onglets de "Modifier le thème".
>> en revanche, veillez à bien mettre la largeur de page à 900px et à centrer la page dans "Modifier le thème" > "Format du blog" > "Page".
>> veillez également à ce que la les largeurs des commentaires ("Contenu" > "Commentaires"), des listes de forums ("Contenu" > "Forums - listes") et des messages de forums ("Contenu" > "Forums - listes") soient à 100%.
ce sont les seuls trucs qui doivent être remplis/cochés. (cliquez sur les images plus les voir plus grandes)
>> pour que l'affichage des modules fonctionne au mieux (que vous n'ayez pas beaucoup à régler les marges), je vous conseille de ne mettre sur le menu de gauche dans cet ordre :
- le module dernier visiteurs, et d'afficher les 2 derniers.
- un module "derniers articles", et d'afficher les 3 derniers.
- enfin, vous pouvez mettre l'équivalent du module du centre, sous la forme d'un module simple (à titre informatif : l'image fait 201*89px).
pour mettre le module simple que vous aurez créé à la place du milieu, il vous faudra cliquer droit dessus, sélectionner inspecter l'élément, puis récupérer les 9 chiffres qui identifient votre module.
vous remplacerez ces 9 chiffres par le XXXXXXXXX dans le code.- du fait du menu en haut au lieu d'à gauche ou à droite, les codes vont différer selon les modules que vous souhaitez mettre. si vous appliquez le code CSS une première fois et même en ayant respecté l'ordre indiqué ci-dessus, il ne sera pas étonnant que le menu entre le header et le contenu fasse un peu n'importe quoi (il faudra régler les champs margin). si vous ne vous débrouillez pas trop en CSS, mettez-moi une permission sur votre blog et je vous l'installerai directement.
- après avoir respecté ces pré-requis, vous pouvez copier/coller le code CSS dans "Modifier le thème" > "Ajouter du CSS". et voilàà !
/*THÈME LB GABRIELLE*/
/*POLICES*/
@font-face{font-family:"amalfi";
src:url("http://ekladata.com/VtVl8BandDMGZXw3jzxvBrX_Qc0/Amalfi.ttf");}
@font-face{font-family:"rachel";
src:url("http://ekladata.com/GdmSrq5Fbp3YBguTkWRfeRHg8ag/Rachel-Roman.ttf");}
@font-face{font-family:"deluxes";
src:url("http://ekladata.com/EBFz-nTuB3L9EaYX38woewui_bY/DeluxesBold-BWpyd.otf");}
@font-face{font-family:"playfair";
src:url("http://ekladata.com/zeMc2MMPyn40H97Pc7O3qe0bavw/PlayfairDisplay-Regular.ttf");}
@font-face{font-family:"playfair bold";
src:url("http://ekladata.com/tqnRFgK_ijX-8OrSueGlXn48bXQ/PlayfairDisplay-SemiBold.ttf");}
/*CORPS*/
#body{background:#FCFCFA;
font-family:playfair;
text-align:justify;
color:#111;
font-size:13px;}
#background{background:#fff;opacity:1;border:1px solid #E8E8E0;}
a{text-decoration:none;}
a:hover{text-decoration:none;}
.module_contenu a{color:#ED5D04;font-family:playfair bold;font-size:13px;}
.module_contenu a:hover{color:#E8A15B;}
.module_contenu p, #Menu1 p{font-family:playfair strong;font-size:14px;}
strong{font-family:playfair strong;font-size:14px;}
hr{border-top:1px solid #ddd;}
blockquote{border-left:5px solid #B9CFB1;}
/*MARGES*/
#background{margin-top:10px;margin-bottom:15px;}
#content{margin-right:30px; margin-left:30px;}
#header{margin-bottom:170px;}
/*HEADER*/
#header{height:200px;}
#header{background:url('http://ekladata.com/QJGMposplAzuILxghXCkwV6ynFA/header.png');}
#titre_header{top:}
#titre_header a{color:#fff;text-shadow:0.5px 0.5px 0px #4D4945;font-family:amalfi;font-size:40px;}
/*MENU DE L'EN-TÊTE*/
#menu{height:40px;
width:100%;
top:180px;
left:0px;
background:#E8E8E0;}
#menu li {width:25%;
text-transform:uppercase;
text-align:center;}
#menu li a{color:#333;
font-family:rachel;
font-size:16px;
line-height:270%;}
#menu li a:hover{text-shadow:1px 1px 0px #fff;background:#E6C7A7;}
#menu li a:after, menu li p:after{content:'.';}
#menu ul{opacity:0.8;width:25%;background:#E8E8E0;}
#menu ul a, #menu ul a:hover{width:225px;}
#menu ul li{height:40px;}
#menu ul li:hover{background:#C3E0BA;}
/*MENU1*/
#menu1{width:px;}
#menu1 a{color:#494D48;font-family:playfair bold;}
#menu1 a:hover{color:#9EA89B;}
.module_menu{
text-align:center;}
.module_menu_titre{background:#B9CFB1;font-family:deluxes;font-size:17px;line-height:190%;}
.module_menu_contenu{background:#D7EDD0;
border:1px solid #B9CFB1;
padding:5px;}
/*--modules--*/
.module_menu_type_lastarticles{position:absolute;
width:210px;
top:250px;
margin-left:50px;}
.module_menu_type_lastarticles a:before{content:'∙ ';}
.module_menu_type_lastvisitors{position:absolute;
width:210px;
top:250px;
margin-left:640px;}
.menu-lastvisitors-avatar{border-radius:50px;
filter: saturate(120%);
filter: contrast(120%);
width:58px;}
#module_menu_titre169214578{display:none;}
#module_menuXXXXXXXXX{position:absolute;
width:212px;
top:248px;
margin-left:345px;}
/*BULLE D'AIDE*/
#help_bubble{background:#E8E8E0;
opacity:0.9;
border:1px solid #CCCCC3;
color:#888;
border-radius:2px;
text-transform:uppercase;
font-family:rachel;
font-size:9px;}
/*CONTENU*/
.module_titre_contenu, .module_titre_contenu a{color:#333;font-size:20px;text-align:center;}
.module_titre_contenu{background:#CCCCC3;font-family:playfair bold;padding:6px;padding-left:12px;padding-bottom:3px;}
.article_info{font-family:playfair bold;text-transform:uppercase;font-size:10px;text-align:center;padding-bottom:5px;}
.article_info a{color:#AB5E10;font-size:10px;font-family:playfair bold;}
.article_info a:hover{color:#ED5D04;}
.module_contenu{border:1px solid #CCCCC3;margin-bottom:25px;}
.module_contenu{
background:#F0F0EA;
padding-left:10px;padding-right:10px;padding-bottom:10px;padding-top:10px;}
.article_readmore a{background:#ED8D51;color:#fff;font-family:deluxes;font-size:16px;padding:3px;padding-left:10px;padding-right:10px;}
.article_readmore a:hover{background:#E6CBAF;color:#fff;text-shadow:1px 1px 0px #E8A15B;}
/*COMMENTAIRE*/
/*--en-tête--*/
.commentheader{background:#f9f9f9;padding:7px;border:1px solid #CFB49B;border-bottom:3px solid #CFB49B;}
.commentnumber{position:absolute;
z-index:99;
font-size:20px;
color:#B9CFB1;
text-shadow:1px 1px 0px #404D3C;
font-family:rachel;
width:20px;
margin-left:762px;
margin-top:64px;}
.commentdate{font-size:11px;}
/*--avatar--*/
.commentavatar img{
-webkit-transition: all 0.2s ease;
margin-top:4px;
border-radius:50px;
opacity:0.8;}
.commentavatar img:hover{opacity:1;}
/*--contenu--*/
.commentbody{background:#EBD0B6;
margin-bottom:20px;
padding:7px;
border:1px solid #CFB49B;}
/*--réponses--*/
.block-reply{border-left:3px solid #CF6B36;}
.block-reply .commentheader{
background:#eee;
border:1px solid #CF6B36;
border-bottom:3px solid #CF6B36; }
.block-reply .commentbody{
padding:7px;
border:1px solid #CF6B36;
background:#EB8B57;}
/*FORUMS*/
/*--liste des forums--*/
.forum_table td{padding-top:10px;}
/*--messages--*/
.post_table_head{text-align:left;color:#888;border-bottom:9px solid #A1B39B;font-size:10px;font-family:rachel;}
.post_table_profile{line-height:100%;}
.post_table_profile a{background:#B9CFB1;padding:2px;padding-left:6px;padding-right:6px;color:#fff;}
.post_table_profile img{
margin-top:10px;
border-radius:50px;
margin-bottom:15px;
width:50px;}
.post_table{border-bottom:1px solid #CCCCC3;}
.post_table_msg{padding-bottom:20px;padding-top:5px;}
/*BOUTONS*/
/*--champs--*/
#background input[type=text]{
font-family:playfair;
font-size:11px;
padding:2px;
background:#fff;
color:#aaa;
border:1px solid #999;}
#background input[type=text]:hover{border:1px solid #B9CFB1;}
/*--boutons--*/
#background button, #background input[type="button"], #background input[type="submit"]{
text-decoration: none;
padding:4px;padding-left:10px;padding-right:10px;
font-size:12px;
background:#B9CFB1;
color:#fff;
text-shadow:1px 1px 0px #64705F;
border:0px solid black;
border-radius:1px;
text-transform:uppercase;
font-family:deluxes;}
#background button:hover, #background input[type="button"]:hover, #background input[type="submit"]:hover{
border:0px solid black;
text-shadow:1px 1px 0px #ED5D04;
background:#E6C7A7;
color:#fff;}
/*MENUBAR*/
/*--menubar--*/
#menubar, #menubar_section_account{border-bottom:1px solid #CCCCC3;}
#menubar, #menubar a {font-family:playfair bold;color: #757570;
background:#E8E8E0;font-size:10px;}
.menubar_section, #menubar_logo, .menubar_separation, #menubar_favorites, .menubar_button, #menubar_signin {background : none ; }
.menubar_section:hover div{background:#E8E8E0;color:#ED5D04;}
/*--eklablog--*/
#menubar_logo img:hover{border-radius:0px;background:#E8E8E0;}
/*--listes--*/
.menubar_section li {
color:#757570;background:#E8E8E0;opacity:0.9;}
.menubar_section li:hover{
background:#E8E8E0;color:#ED5D04;}
.menubar_section li:last-child{background:#E8E8E0;padding-bottom:2px;}
.menubar_section li:last-child:hover{
background:#E8E8E0;color:#ED5D04;}
/*--liens--*/
#menubar a:hover{background:#E8E8E0;color:#ED5D04;}
#menubarabsolute .icon{border-radius:50px;}
/*--notifications--*/
#notifications_panel a,
#notifications_panel div {background:#E8E8E0;opacity:1;}
#notifications_panel a:hover,
#notifications_panel div:hover {background:#E8E8E0;
color: #B9CFB1; }
/*PIED DE PAGE*/
#footer{height:25px;font-size:11px;text-align:center;font-family:deluxes;}
#footer, #footer a{color:#444;}
#footer a:hover{color:#666;text-shadow:1px 1px 0px #D7EDD0;}
#footer:after{content:'thème par ライラック';color:#666;}
NOTES UTILES
- ce thème est assez modulable : vous pouvez notamment modifier l'espace entre le header et le contenu, pour mettre des modules plus longs.
Suivre le flux RSS des commentaires
Ajouter un commentaire
gabrielle
Créer mon blog
Hello, sache que j'aime beaucoup ce thème, alors je me suis permise de le prendre dans son entièreté pour mon blog privé (de couple !!) ; il y a eu quelques soucis avec certains codes, que je suis en train de remanier mais je pense que le plus gros a été fait !
Merci beaucoup <3
coucou! ravie que le thème te plaise (:
oui malheureusement le thème est un peu casse gueule à installer tout seul, mais super si t'as pu le faire! si t'as besoin de quoique ce soit tu peux toujours me mp (sur mon compte principal je réponds plus vite) <3