Jawn
she/her mais n'importe quel pronom fera l'affaire - codeuse - accro à Genshin Impact - vive les fleurs et la nature - créditez les codes
73627/01/2018
Dans votre template index_body, entre les balises :
- Code:
<!-- BEGIN disable_viewonline -->
<!-- END disable_viewonline -->
Entre votre HTML >
- Code:
<div class="pourtester" style="text-align:center;">
<div class="welcometoi">bienvenue</div>
<span id="dernier_membre">{NEWEST_USER}</span>
<script type="text/javascript">document.getElementById('dernier_membre').innerHTML=document.getElementById('dernier_membre').innerHTML.replace(/L'utilisateur enregistré le plus récent est /g," ");</script>
</div>
<div class="totalqeel">
<div class="blokco">
<h1>Parcourant le forum...</h1>
<div class="totalusers">{TOTAL_USERS_ONLINE}</div>
<div id="jambon">{LOGGED_IN_USER_LIST}</div><script type="text/javascript">document.getElementById('jambon').innerHTML=document.getElementById('jambon').innerHTML.replace(/Utilisateurs enregistrés :/g," ");</script>
<script type="text/javascript">document.getElementById('jambon').innerHTML=document.getElementById('jambon').innerHTML.replace(/Moteurs de recherche :/g," ");</script>
</div>
<div class="bloklast">
<div class="premier">
<div id="membresqeel">{TOTAL_USERS}</div>
<script type="text/javascript">document.getElementById('membresqeel').innerHTML=document.getElementById('membresqeel').innerHTML.replace(/Nous avons/g," ");</script>
<script type="text/javascript">document.getElementById('membresqeel').innerHTML=document.getElementById('membresqeel').innerHTML.replace(/membres enregistrés/g," ");</script>
<div id="messagesqeel">{TOTAL_POSTS}</div>
<script type="text/javascript">document.getElementById('messagesqeel').innerHTML=document.getElementById('messagesqeel').innerHTML.replace(/Nos membres ont posté un total de/g," ");</script>
<script type="text/javascript">document.getElementById('messagesqeel').innerHTML=document.getElementById('messagesqeel').innerHTML.replace(/messages/g," ");</script>
<span id="avatar_dernier_membre"></span>
</div>
<div class="groupsqeel">
<a target="_blank" href="http://half-god-rpg.forums-actifs.net/g6-pnj"><img src="https://zupimages.net/up/19/43/aipf.png"/></a>
<a target="_blank" href="http://half-god-rpg.forums-actifs.net/g3-sang-melees-grecs"><img src="https://i.imgur.com/F1qSUgS.png"/></a>
<a target="_blank" href="http://half-god-rpg.forums-actifs.net/g4-sang-meles-romains"><img src="https://i.imgur.com/viqFE5r.png"/></a>
<a target="_blank" href="http://half-god-rpg.forums-actifs.net/g5-chasseresses"><img src="https://i.imgur.com/uI1J7bf.png"/></a>
<a target="_blank" href="http://half-god-rpg.forums-actifs.net/g7-autres-creatures"><img src="https://i.imgur.com/fibVccI.png"/></a>
</div>
</div>
<div class="bloklastco">
<h1>Il y a 48 heures</h1>
<div id="mayonnaise"><table>{L_CONNECTED_MEMBERS}</table></div>
<script type="text/javascript">document.getElementById('mayonnaise').innerHTML=document.getElementById('mayonnaise').innerHTML.replace(/Membres connectés au cours des 48 dernières heures : /g," ");</script>
</div>
</div>
Puis allez ajouter votre CSS :
- Code:
/**** QEEL MYRDDIN ****/
#page-footer {
margin-bottom: 10px !important;
font: 9px roboto;
color: #dad9df;
padding: 5px;
line-height: 0;
position: absolute;
text-align: center;
background: #f6f5f8 !important;
width: 100%!important;
}
#page-footer a {
color: #dad9df;
letter-spacing: 1px;
font:9px roboto;
}
.welcometoi {
font: 55px Hamilton;
text-align: center;
color: #c07c59;
margin: 80px 0px -40px 0px;
}
#dernier_membre {
text-align: center;
}
#dernier_membre strong {
font: 30px DM Serif Display;
text-transform: uppercase;
}
#dernier_membre a {
color: #262929;
}
.totalqeel {
background: #f1f0f4;
padding: 10px;
width: 100%;
margin-top: 20px;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.blokco {
width: 300px;
}
.blokco h1 {
color: #262929;
font: 20px DM Serif Display;
text-transform: uppercase;
}
.totalusers{
font: 8px roboto;
color: #c07c59;
}
#jambon {
width: 300px;
padding: 10px 10px 10px 0px;
height: 90px;
overflow: auto;
text-align: justify;
font-size: 11px;
}
#jambon br {
display:none;
}
.bloklast {
width: 230px;
}
.premier {
width: 64px;
height: 64px;
padding: 16px 10px 10px 10px;
background: #c07c59;
text-align: center;
color: #f6f5f8;
margin: -35px auto;
font: 10px roboto;
vertical-align: middle;
border-radius: 100%;
transition: 1.2s linear;
border: solid 2px #f6f5f8;
box-shadow: 1px 1px 10px #f1f1f1;
}
#avatar_dernier_membre {
width: 60px;
height: 60px;
overflow: hidden;
border-radius: 100%;
opacity: 0;
margin: -42px -30px -30px -30px;
position: absolute;
transition: 1.2s linear;
}
.premier:hover #avatar_dernier_membre {
opacity:1;
transition-duration: 1s;
transition-timing-function: ease;
}
#avatar_dernier_membre img {
width:100%;
}
.groupsqeel {
padding: 10px;
text-align: center;
margin-top: 40px;
}
.groupsqeel img {
padding:0px 5px 0px 5px;
}
.bloklastco {
width: 300px;
}
.bloklastco h1 {
color: #262929;
font: 20px DM Serif Display;
text-transform: uppercase;
}
#mayonnaise {
width: 300px;
padding: 0px 10px 10px 0px;
height: 90px;
overflow: auto;
text-align: justify;
}
#mayonnaise a {
font-size: 11px;
}
#jambon a {
font-size: 11px;
}
/**** FIN QEEL MYRDDIN ****/
Pour le footer, remplacez l'intégralité du template overall_footer_end par :
- Code:
<!-- BEGIN html_validation -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div>
<div>
<ul>
<li>
<!-- END html_validation -->
</li>
</ul>
<!-- BEGIN switch_footer_links -->
<ul class="footerbar-user">
<li><i class="ion-clock"></i>{CURRENT_TIME}</li>
<!-- BEGIN footer_link -->
<li class="rightside">
<a name="bottom" class="copyright" href="{switch_footer_links.footer_link.U_FOOTER_LINK_HREF}" rel="{switch_footer_links.footer_link.FOOTER_LINK_REL}" target="{switch_footer_links.footer_link.FOOTER_LINK_TARGET}" title="{switch_footer_links.footer_link.L_FOOTER_LINK_TITLE}">
{switch_footer_links.footer_link.L_FOOTER_LINK_TEXT}
</a>
</li>
<!-- END footer_link -->
</ul>
<!-- END switch_footer_links -->
</div>
<div class="copyright">
<div class="wrap">
<div class="copyright-body">
{ADMIN_LINK}
</div>
</div>
</div>
</div>
{PROTECT_FOOTER}
<div class="footerfo">
<div class="partos">
<a target="_blank" href="http://mahoutokoro.forumactif.com/"><img src="https://i.imgur.com/mBWaA2e.png"/></a>
<a target="_blank" href="http://under-the-moon.forumactif.com"><img src="https://zupimages.net/up/19/16/qlaa.png"/></a>
<a target="_blank" href="http://les4royaumes.forumperso.com"><img src="https://zupimages.net/up/19/13/8kqc.png"/></a>
<a target="_blank" href="http://tahncelhan.forumactif.com/"><img src="https://zupimages.net/up/20/19/eu9l.jpg"/></a>
<a target="_blank" href="http://www.atlantisinsurrection.com"><img src="https://i.servimg.com/u/f34/19/98/96/02/2019_510.jpg"/></a>
<a target="_blank" href="http://hakumei.forumactif.org"><img src="https://zupimages.net/up/20/24/0qsg.png"/></a>
<a target="_blank" href="http://chicagospulsions.forumactif.com/"><img src="https://www.zupimages.net/up/19/37/59e4.gif"/></a>
<a target="_blank" href="http://oso-version1-2.forumactif.org"><img src="https://nsa40.casimages.com/img/2019/04/12/190412122437274038.png"/></a>
<a target="_blank" href="https://pathofrebirth.forumactif.com/"><img src="https://cdn.discordapp.com/attachments/643078990323646465/695238825697345577/unknown.png"/></a>
<a target="_blank" href="https://tedd-deireadh.forumactif.com/"><img src="https://i.imgur.com/6J2HLEx.gif"/></a>
<a target="_blank" href="http://teyolia.forumgratuit.org"><img src="https://i.servimg.com/u/f20/16/46/10/05/50-5012.jpg"/></a>
<a target="_blank" href="https://ekoe-pokemon.forumactif.com/"><img src="https://zupimages.net/up/20/12/mpv5.png"/></a>
<a target="_blank" href="https://aelke-rpg.forumgaming.fr/"><img src="https://zupimages.net/up/20/24/b2hf.png"/></a>
<a target="_blank" href="https://soap.forumactif.com"><img src="https://i.imgur.com/EbKtNyA.png"/></a>
<a target="_blank" href="https://intodeepspace.forumactif.com"><img src="https://i.imgur.com/5hXqazW.gif"/></a>
<a target="_blank" href="http://half-god-rpg.forums-actifs.net"><img src="https://zupimages.net/up/19/42/3d79.png"/></a>
<a target="_blank" href="http://half-god-rpg.forums-actifs.net"><img src="https://zupimages.net/up/19/42/3d79.png"/></a>
<a target="_blank" href="http://half-god-rpg.forums-actifs.net"><img src="https://zupimages.net/up/19/42/3d79.png"/></a>
<a target="_blank" href="http://somuchgravity.forumactif.com"><img src="https://zupimages.net/up/20/02/qf4p.png"/></a>
<a target="_blank" href="http://wooruru.forumactif.com/"><img src="https://zupimages.net/up/19/40/dum7.png"/></a>
</div>
<div class="bloknew">
<div class="titlefoo">En ce moment</div>
<div class="subtitlefo">les news, les news</div>
<div class="txtnew">
Malgré les tensions qui continuent dans le monde, Half God essaie toujours de vous divertir au mieux !
Vous pouvez vous régaler avec les <a href="http://half-god-rpg.forums-actifs.net/t1766-lancement-event-n6">participations à l'event 6</a> qui est actuellement en cours ou
encore lire la <a href="http://half-god-rpg.forums-actifs.net/t1826-satyre-dechaine-19e-edition#30424">18e édition du Satyre Déchaîné</a> pour vous divertir un peu. Et puis, si jamais rien ne vous va,
pourquoi ne pas jeter un coup d'œil aux <a href="http://half-god-rpg.forums-actifs.net/t1796-les-defis-de-l-ete">défis de l'été</a> ?
</div>
<div class="entouremdm">
<div class="mdm" style="background-image:url(https://zupimages.net/up/20/31/092y.png)">
<div class="insidemdm">
<div class="titredurp"><a target="_blank" href="http://half-god-rpg.forums-actifs.net/u251">membre du mois</a></div>
<span>Kleman Dunn</span>
</div>
</div>
<div class="mdm" style="background-image:url(https://zupimages.net/up/20/31/gaa2.png)">
<div class="insidemdm">
<div class="titredurp"><a target="_blank" href="http://half-god-rpg.forums-actifs.net/t1721-talk-to-the-shadows-atem">rp du mois</a></div>
<span>Talk to the shadows, Maxine, Atem</span>
</div>
</div></div>
</div>
</div>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
$(window).scroll(function() {
var header_top = $('#headerbar-top');
if (header_top.hasClass('w-toolbar')) {
if ($(window).scrollTop() >= 42) {
header_top.addClass('is-sticky');
} else {
header_top.removeClass('is-sticky');
}
} else {
if ($(window).scrollTop() >= 1) {
header_top.addClass('is-sticky');
} else {
header_top.removeClass('is-sticky');
}
}
});
});
//]]>
</script>
<!-- BEGIN switch_facebook_login -->
<div id="fb-root"></div>
<script type="text/javascript">
$(document).ready( function() {
$('div.fb-login-button, span.fb-login-button').attr({
"data-scope": "{switch_facebook_login.FB_SCOPE}",
"data-max-rows": "{switch_facebook_login.FB_MAX_ROWS}",
"data-size": "{switch_facebook_login.FB_BUTTON_SIZE}",
"data-show-faces": "{switch_facebook_login.FB_SHOW_FACES}",
"data-auto-logout-link": "{switch_facebook_login.FB_AUTO_LOGOUT}"
});
$('div.fb-login-button, span.fb-login-button').each(function() {
if(typeof $(this).attr('onlogin') == typeof undefined || $(this).attr('onlogin') === false) {
$(this).attr('onlogin', '{switch_facebook_login.FB_ONLOGIN}');
}
if($(this).html() == '') {
$(this).html('{switch_facebook_login.FB_LABEL}');
}
});
FB.init({
"appId" : "{switch_facebook_login.FB_APP_ID}",
"cookie" : {switch_facebook_login.FB_COOKIE},
"xfbml" : {switch_facebook_login.FB_XFBML},
"oauth" : {switch_facebook_login.FB_OAUTH},
"version" : "{switch_facebook_login.FB_VERSION}"
});
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/{switch_facebook_login.FB_LOCAL}/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
});
function onLoginFB() {
window.location.replace('{switch_facebook_login.FB_ONLOGIN_URL}')
}
</script>
<!-- END switch_facebook_login -->
<!-- BEGIN switch_topicit_connect -->
<script type="text/javascript">
$(document).ready( function() {
$('div.ti-connect, span.ti-connect').attr({
"data-loc": "{switch_topicit_connect.TOPICIT_URL}",
"data-login": "{switch_topicit_connect.BOARD_LOGIN}",
"data-version": "{switch_topicit_connect.TOPICIT_VERSION}",
"data-lang": "{switch_topicit_connect.BOARD_LANG}"
});
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "{switch_topicit_connect.TOPICIT_ENDPOINT}";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'topicit-connect'));
});
</script>
<!-- END switch_topicit_connect -->
<script type="text/javascript">
//<![CDATA[
fa_endpage();
//]]>
</script>
</body>
</html>
Et enfin, allez ajouter votre CSS :
- Code:
/**** FOOTER MYRDDIN ****/
.footerfo {
background-image: url(https://i.imgur.com/DNYAb2e.png);
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 246px;
height: 320px;
}
.partos {
width: 450px;
text-align: center;
padding-right: 30px;
}
.partos img {
margin: 6px;
}
.bloknew {
width: 500px;
padding-left: 30px;
}
.titlefoo {
color: #262929;
font: 50px DM Serif Display;
text-transform: uppercase;
text-align: center;
}
.subtitlefo {
font: 55px Hamilton;
text-align: center;
color: #c07c59;
margin-top: -34px;
}
.txtnew {
padding-left: 20px;
border-left: solid 5px #c07c59;
color: #262929;
font: 11px roboto;
text-align: justify;
}
.txtnew a {
color:#c07c59;
font-style:italic;
}
.entouremdm {
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
padding-top: 20px;
}
.mdm {
width:233px;
height:56px;
transition: 1.2s linear;
}
.insidemdm {
background: #c07c59;
width: 233px;
padding: 15px 10px 10px 10px;
height: 56px;
text-align: center;
opacity: 0;
transition: 1.2s linear;
}
.insidemdm a {
font: 12px DM Serif Display;
color: #f6f5f8;
text-transform: uppercase;
}
.insidemdm span {
color:#f6f5f8;
font:9px roboto;
font-style:italic;
}
.mdm:hover .insidemdm {
transition: 1.2s linear;
opacity:1;
}
/**** FIN FOOTER MYRDDIN ****/
# QUI EST EN LIGNE - BEIGE - Lun 4 Jan - 3:29Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum|
|
|
