epsilon
forum de libre service de codage,
aucune inscription
Une refonte complète d'Epsilon est prévue pour bientôt. Dans les mois qui suivent, le forum va totalement changer d'apparence et toutes les catégories vont être réorganisées. Pas de panique, aucun LS ne va disparaître !
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
Le Deal du moment : -42%
-42% Samsung TV QLED 4K 65″ 164 cm – ...
Voir le deal
699 €

Jawn
Jawn
The relations between us in those latter days were peculiar.
The relations between us in those latter days were peculiar.
QUI EST EN LIGNE - BEIGE Fhw7tEt

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 ****/

QUI EST EN LIGNE - BEIGE 7mExy2k

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 ****/
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum