Petit soucis avec le selecteur de couleurs.

[tara1505]

Bonjour.

Alors j'ai suivi ca : https://forum.forumactif.com/t287454-ajouter-un-selecteur-de-couleur

Et absolument rien a changé....


J'aimerais savoir ce qui cloche ou ce qui peut clocher

Mon css

Code:

/* POUR LE CORPS DU FO*/



body

{ background-attachment: scroll;
 background-repeat: no-repeat;
 background-position: top center;}


text-area{
background:#D3C299;
}

textarea.post{color: #270C03;
font-family:helvetica;
font-size:13px;
line-height:17px;
border-top: 3px #000000  dotted;
border-bottom: 8px #000000 solid;
border-right: 2px #000000  solid;
border-left: 2px #000000  solid;
-moz-border-radius:15px;
background:#D3C299;
padding:2px;}

.forumline{-webkit-border-radius:30px;
-moz-border-radius:30px;
padding:10px;
margin-top:5px;
margin-bottom:8px;
background:#D3C299;}

.postbody {
 
    text-align:justify;
padding-left:30px;
padding-right:30px; 
}

row1,row3.
{background:#D3C299;}



/* LIENS */

a:active
{
text-decoration: none;
}
a:link {text-decoration: none;}
a:hover{text-decoration: none !important;}
a { text-decoration: none; }
a:link { text-decoration: none; }
a:hover { text-decoration: none; }


/*MENU */

a.mainmenu{
TEXT-ALIGN: center
font-size:40px;
font-family:times new roman;
color: #270C03;
font-style:bold;
text-transform: uppercase;
font-weight: bold;letter-space:1px}



a.mainmenu:hover{
TEXT-ALIGN: center
font-size:40x;font-style:bold;
font-family:times new roman;
color:#170601;
text-transform: uppercase;

font-weight: bold;letter-space:1px}



/* personnalisations des titres by BestRPG */
.titreperso {
text-align: center;
font-family:Georgia;
font-size: 15px;
text-transform: uppercase;
color: #270C03;
-moz-border-radius:50px;
-webkit-border-radius:50px;
display:block;
padding:5px;

}

/* personnalisations des titres by BestRPG */
.titreperso:hover {
text-align: center;
font-family:Georgia;
font-size: 15px;
text-transform: uppercase;
color: #170601;
-moz-border-radius:50px;
-webkit-border-radius:50px;
display:block;
padding:5px;
opacity:0.5

}

/* QEEL */

.statistiques{
border:0px;
background-position: center;
text-align: justify;
height:200px;}

 
.groupes{
-moz-border-radius : 5px 5px 5px 5px;
height:40px;padding-right:30px;padding-left:5px;padding-bottom:3px;
font-size:15px;font-weight: bold;text-align: justify;
text-decoration: none !important;}



/* CADRE IMAGE */

.pix
{-moz-box-shadow: 0px 0px 15px #202020;
margin-top:1px;
margin-left:1px;
margin-right:1px;
}



.pix2
{-moz-box-shadow: 0px 0px 15px white;
margin-top:1px;
margin-left:1px;
margin-right:1px;
}
.pix3
{
background-color: transp;
opacity: 1.10;
margin-top:1px;
margin-left:1px;
margin-right:1px;
border: 5px solid  #b4cfcb;
-moz-border-radius: 10px;
}
.pix3:hover
{
opacity: 0.10;
border: 5px solid  #b4cfcb;
-moz-border-radius: 10px;
cursor:pointer;
}



/* DESCRIPTIONS */

.des {
-moz-border-radius-bottomleft:20px;
-moz-border-radius-bottomright:20px;
-moz-border-radius-topleft:20px;
-moz-border-radius-topright:20px;
-webkit-border-bottom-left-radius:20px;
-webkit-border-bottom-right-radius:20px;
-webkit-border-top-left-radius:20px;
-webkit-border-top-right-radius:20px;
padding:10px;
margin: 1px;

color:#270C03;
}



.desleft{background:-moz-linear-gradient(top, #822809,#D3C299);width: 120px;-moz-border-radius-bottomleft:20px;-moz-border-radius-bottomright:20px;-moz-border-radius-topleft:20px;-moz-border-radius-topright:20px;background:-webkit-linear-gradient(top, #822809,#D3C299);width: 120px;-webkit-border-bottom-left-radius:20px;-webkit-border-bottom-right-radius:20px;-webkit-border-top-left-radius:20px;-webkit-border-top-right-radius:20px;padding:10px;margin:0px;}




.title {color:#270C03;
}

/* NOM PROFIL */

.name a {
background:#270C03;
display:block;
font-variant:normal;
text-transform: uppercase;
letter-spacing:2px;
text-align:center
}


.profilentour {
text-align:center;
padding:9px;
background:#D3C299;
color: #270C03;
}

.profilentour {
text-align:center;
padding:9px;

-moz-border-radius-bottomleft:20px;-moz-border-radius-bottomright:0px;-moz-border-radius-topleft:0px;-moz-border-radius-topright:20px;
-webkit-border-bottom-left-radius:20px;-webkit-border-bottom-right-radius:0px;-webkit-border-top-left-radius:0px;-webkit-border-top-right-radius:20px;
}

.postdetails.poster-profile img  {
border:3px solid #270C03;
}


.postdetails.poster-profile{
 display:block;
text-align:justify
}

/* AUTOUR DU VAVA */

.postdetails.poster-profile a img {

-moz-border-radius-bottomleft:8px;
-moz-border-radius-bottomright:8px;
-moz-border-radius-topleft:8px;
-moz-border-radius-topright:8px;
-webkit-border-bottom-left-radius:8px;
-webkit-border-bottom-right-radius:8px;
-webkit-border-top-left-radius:8px;
-webkit-border-top-right-radius:8px;
border:3px solid #270C03;

}


/* bords code, citation arrondis */

.code {
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-webkit-border-bottom-left-radius:15px;
-webkit-border-bottom-right-radius:15px;
-webkit-border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
background:-moz-linear-gradient(top,#d6bc80, #fff);
background:-webkit-linear-gradient(top,#d6bc80, #fff);
color: #270C03;
width:450px;
padding:10px;



}
.spoiler {
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-webkit-border-bottom-left-radius:15px;
-webkit-border-bottom-right-radius:15px;
-webkit-border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
background:-moz-linear-gradient(top,#d6bc80, #fff);
background:-webkit-linear-gradient(top,#d6bc80, #fff);
color: #270C03;
width:450px;
padding:10px;

max-width: 100%;
}

.quote {
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-webkit-border-bottom-left-radius:15px;
-webkit-border-bottom-right-radius:15px;
-webkit-border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
background:-moz-linear-gradient(top,#d6bc80, #fff);
background:-webkit-linear-gradient(top,#d6bc80, #fff);
color: #270C03;
width:450px;
padding:10px;


}

.postspoiler {
    display: block;
    padding-left: 18px;
    padding-right: 18px;
    padding-top: 10px;
    text-align:justify; }


/* CÉLÉBRITÉS PRISE LIBRES */
.libre:hover
{color:LightSeaGreen;
}

.pris:hover
{color:LightCoral;
}


.shadow
{text-shadow: 1px 1px 1px #ffffff;
font-size: 16px;
}




/* MISE EN PAGE DES MESSAGES ADMINISTRATEURS PREMIER HAUT DEUXIEME BAS ET SOUSTITRES*/
.titreadmipost{
text-align:center;
padding:7px;
text-transform:uppercase;
font-weight:bold;
font-family:Georgia;
font-size:32px;

letter-spacing:-2px;
color:#270C03;}

.basadminpost{background:#d6bc80;
text-align:justify;
padding:20px;
font-family:arial;
width:450px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-webkit-border-bottom-left-radius:15px;
-webkit-border-bottom-right-radius:15px;
-webkit-border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
}

.a basadminpost{
color: #270C03;
}

/*selecteur de couleur*/
.colorpicker {
  width: 356px;
  height: 176px;
  overflow: hidden;
  position: absolute;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_background.png);
  font-family: Arial, Helvetica, sans-serif;
  display: none;
}
.colorpicker_color {
  width: 150px;
  height: 150px;
  left: 14px;
  top: 13px;
  position: absolute;
  background: #f00;
  overflow: hidden;
  cursor: crosshair;
}
.colorpicker_color div {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px;
  height: 150px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_overlay.png);
}
.colorpicker_color div div {
  position: absolute;
  top: 0;
  left: 0;
  width: 11px;
  height: 11px;
  overflow: hidden;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_select.gif);
  margin: -5px 0 0 -5px;
}
.colorpicker_hue {
  position: absolute;
  top: 13px;
  left: 171px;
  width: 35px;
  height: 150px;
  cursor: n-resize;
}
.colorpicker_hue div {
  position: absolute;
  width: 35px;
  height: 9px;
  overflow: hidden;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_indic.gif) left top;
  margin: -4px 0 0 0;
  left: 0px;
}
.colorpicker_new_color {
  position: absolute;
  width: 60px;
  height: 30px;
  left: 213px;
  top: 13px;
  background: #f00;
}
.colorpicker_current_color {
  position: absolute;
  width: 60px;
  height: 30px;
  left: 283px;
  top: 13px;
  background: #f00;
}
.colorpicker input {
  background-color: transparent;
  border: 1px solid transparent;
  position: absolute;
  font-size: 10px;
  font-family: Arial, Helvetica, sans-serif;
  color: #898989;
  top: 4px;
  right: 11px;
  text-align: right;
  margin: 0;
  padding: 0;
  height: 11px;
}
.colorpicker_hex {
  position: absolute;
  width: 72px;
  height: 22px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_hex.png) top;
  left: 212px;
  top: 142px;
}
.colorpicker_hex input {
  right: 6px;
}
.colorpicker_field {
  height: 22px;
  width: 62px;
  background-position: top;
  position: absolute;
}
.colorpicker_field span {
  position: absolute;
  width: 12px;
  height: 22px;
  overflow: hidden;
  top: 0;
  right: 0;
  cursor: n-resize;
}
.colorpicker_rgb_r {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_r.png);
  top: 52px;
  left: 212px;
}
.colorpicker_rgb_g {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_g.png);
  top: 82px;
  left: 212px;
}
.colorpicker_rgb_b {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_b.png);
  top: 112px;
  left: 212px;
}
.colorpicker_hsb_h {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_h.png);
  top: 52px;
  left: 282px;
}
.colorpicker_hsb_s {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_s.png);
  top: 82px;
  left: 282px;
}
.colorpicker_hsb_b {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_b.png);
  top: 112px;
  left: 282px;
}
.colorpicker_submit {
  position: absolute;
  width: 22px;
  height: 22px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_submit.png) top;
  left: 322px;
  top: 142px;
  overflow: hidden;
}
.colorpicker_focus {
  background-position: center;
}
.colorpicker_hex.colorpicker_focus {
  background-position: bottom;
}
.colorpicker_submit.colorpicker_focus {
  background-position: bottom;
}
.colorpicker_slider {
  background-position: bottom;
}

/* TITRES*/

.minititre{
text-align:center;
padding:7px;
font-weight:bold;
font-family:palatinotype;
font-size:24px;
font-style: italic;
letter-spacing:-2px;
color: #42090d;}



.title{
font-weight:bold;
font-family:palatinotype;
font-size:12px;
text-transform:uppercase;
color:#270C03;
}


/* fiche & staff */

.titreadmipost2{
text-align: center;
font-family:palatino linotype;
font-size: 40px;
color: #270C03;
letter-spacing:-5px;}

.titreadmipost3{
text-align: center;
font-family:palatino linotype;
font-size: 40px;
color: #270C03;
letter-spacing:-5px;}

.basadminpost1{width:500px;-moz-border-radius-bottomleft:0px;-moz-border-radius-bottomright:0px;-moz-border-radius-topleft:0px;-moz-border-radius-topright:0px;background:#d6bc80;-webkit-border-bottom-left-radius:0px;-webkit-border-bottom-right-radius:0px;-webkit-border-top-left-radius:0px;-webkit-border-top-right-radius:0px;font-family:Tahoma;color:d9d0c8;overflow:auto;}

.basadminpost22{width:500px;-moz-border-radius-bottomleft:0px;-moz-border-radius-bottomright:0px;-moz-border-radius-topleft:0px;-moz-border-radius-topright:0px;background:-moz-linear-gradient(top,#d6bc80, #fff);background:-webkit-linear-gradient(top,#d6bc80, #fff);-webkit-border-bottom-left-radius:0px;-webkit-border-radius-bottom-right:0px;-webkit-border-top-left-radius:0px;-webkit-border-top-right-radius:0px;font-family:Tahoma;color:#270C03;}


.basadminpost3{width:500px;-moz-border-radius-bottomleft:0px;-moz-border-radius-bottomright:0px;-moz-border-radius-topleft:0px;-moz-border-radius-topright:0px;-webkit-border-bottom-left-radius:0px;-webkit-border-bottom-right-radius:0px;-webkit-border-top-left-radius:0px;-webkit-border-top-right-radius:0px;padding:0px;margin: 1px;background:-moz-linear-gradient(top,#d6bc80, #fff);background:-webkit-linear-gradient(top,#d6bc80, #fff);color:#270C03;overflow:auto}
.textetit{color:d9d0c8;font-family:Tahoma;}




 /* bubulle */

.bulle img {background-color: transp;opacity: 1.10;margin-top:1px;margin-left:1px;margin-right:1px;border: 5px solid  #822809;-moz-border-radius: 10px;-webkit-border-radius: 10px;}
a.bulle  {position:relative;z-index: 999;text-align: center;}
a.bulle  span {display: none;}
a.bulle:hover {background: none;cursor: mini;text-decoration:none;text-align:center;}
a.bulle:hover span {display: block;position:absolute;top:-63px;right:3px;width:103px;font-size:11px;font-family:Georgia;text-decoration:none;border:#822809 2px solid;background:#D3C299;-moz-border-radius: 10px;-webkit-border-radius: 10px;color: #270C03;}




 /* bubulle2 */

.bulle2 img {background-color: transp;opacity: 1.10;margin-top:1px;margin-left:1px;margin-right:1px;border: 5px solid  #822809;-moz-border-radius: 10px;-webkit-border-radius: 10px;}
a.bulle2  {position:relative;z-index: 999;text-align: center;}
a.bulle2  span {display: none;}
a.bulle2:hover {background: none;cursor: mini;text-decoration:none;text-align:center;}
a.bulle2:hover span {display: block;position:absolute;top:-63px;right:3px;width:103px;font-size:11px;font-family:Georgia;text-decoration:none;border:#822809 2px solid;background:#D3C299;-moz-border-radius: 10px;-webkit-border-radius: 10px;color: #270C03;}




/* édité par */
tr.post span.gensmall{display: none;}

MOn overhall header

Code:

<!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" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB}>
<head>
   <!-- BEGIN meta_emulate_ie7 -->
   <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
   <!-- END meta_emulate_ie7 -->
   <title>{SITENAME_TITLE}{PAGE_TITLE}</title>
   <meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING};" />
   <meta http-equiv="content-script-type" content="text/javascript" />
   <meta http-equiv="content-style-type" content="text/css" />
   {META_FAVICO}
   {META}
   {META_FB_LIKE}
   <meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
   {T_HEAD_STYLESHEET}
   {CSS}
   <link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
   <link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
   <script src="{JQUERY_PATH}" type="text/javascript"></script>
   <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>

   <!-- BEGIN switch_fb_login -->
   <script src="http://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
   <script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
   <!-- END switch_fb_login -->

   <!-- BEGIN switch_ticker -->
   <link type="text/css" rel="stylesheet" href="{JS_DIR}jquery/ticker/ticker.css" />
   <script src="{JS_DIR}jquery/ticker/ticker.js" type="text/javascript"></script>
   <!-- END switch_ticker -->

   <!-- BEGIN switch_ticker_new -->
   <script src="{JS_DIR}jquery/jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
   <script type="text/javascript">//<![CDATA[
   /* Definir le sens de direction en fonction du panneau admin */
   var tickerDirParam = "{switch_ticker.DIRECTION}";
   var slid_vert = false;
   var auto_dir  = 'next';
   var h_perso = parseInt({switch_ticker.HEIGHT});

   switch( tickerDirParam )
   {
      case 'top' :
         slid_vert = true;
         break;

      case 'left':
         break;

      case 'bottom':
         slid_vert = true;
         auto_dir  = 'prev';
         break;

      case 'right':
         auto_dir  = 'prev';
         break;

      default:
         slid_vert = true;
   }

   $(document).ready(function() {
      var w_cont = $('#fa_ticker_container').width();

      if (w_cont > 0)
      {
         $('#fa_ticker_container').width(w_cont);

         /* Affichage de la liste */
         $('#fa_ticker_content').css('display','block');

         /* Calcul des dimensions du conteneur et des �l�ments */
         var width_max  = $('ul#fa_ticker_content').width();
         var width_item = Math.floor(width_max / {switch_ticker.SIZE});
         var height_max = h_perso;

         /* Calcul de la hauteur maximale du contenur en fonction des �l�ments et de la hauteur personnalis�e dans l'admin */
         $('ul#fa_ticker_content li').each( function () {
            if ($(this).height() > height_max)
            {
               height_max = $(this).height();
            }
         } );

         /* Redimensionnement des �l�ments et des images trop larges */
         $('ul#fa_ticker_content li').width(width_item).height(height_max).find('img').each(function () {
            if ($(this).width() > width_item)
            {
            var ratio      = $(this).width() / width_item;
            var new_height = Math.round($(this).height() / ratio);
            $(this).height(new_height).width(width_item);
            }
         });

         /* Redimensionnement et centrage du conteneur en mode vertical */
         if (slid_vert)
         {
            $('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft','auto').css('marginRight','auto');
         }

         /* Initialisation du caroussel */
         $('#fa_ticker_content').jcarousel({
              vertical: slid_vert,
            wrap: 'circular',
             auto: {switch_ticker.STOP_TIME},
             auto_direction: auto_dir,
              scroll: 1,
              size: {switch_ticker.SIZE},
              height_max: height_max,
              animation: {switch_ticker.SPEED}
          });
       }
       else
       {
          $('ul#fa_ticker_content li:not(:first)').css('display','none');
          $('ul#fa_ticker_content li:first').css('list-style','none').css('text-align','center');
       }
   });
   //]]>
   </script>
   <!-- END switch_ticker_new -->

   <script type="text/javascript">//<![CDATA[
   $(document).ready(function(){
      <!-- BEGIN switch_enable_pm_popup -->
         pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
         pm.focus();
      <!-- END switch_enable_pm_popup -->
      <!-- BEGIN switch_report_popup -->
         report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
         report.focus();
      <!-- END switch_report_popup -->
      <!-- BEGIN switch_ticker -->
         ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});
      <!-- END switch_ticker -->
   });

   <!-- BEGIN switch_login_popup -->
      var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;
   <!-- END switch_login_popup -->

   <!-- BEGIN switch_login_popup -->
   $(document).ready( function() {
      $(window).resize(function() {
         var windowWidth = document.documentElement.clientWidth;
          var popupWidth = $("#login_popup").width();
          var mypopup = $("#login_popup");

          $("#login_popup").css({
              "left": windowWidth/2 - popupWidth/2
           });
      });
   });
   <!-- END switch_login_popup -->
   //]]>
   </script>
   {GREETING_POPUP}
   <!-- BEGIN switch_ticker_new -->
   <style>
   .jcarousel-skin-tango .jcarousel-item {
       text-align:center;
       width: 10px;
   }

   .jcarousel-skin-tango .jcarousel-item-horizontal {
       margin-right: {switch_ticker.SPACING}px;
   }

   .jcarousel-skin-tango .jcarousel-item-vertical {
       margin-bottom: {switch_ticker.SPACING}px;
   }
   </style>
   <!-- END switch_ticker_new -->

   {HOSTING_JS}<!-- BEGIN google_analytics_code -->
   <script type="text/javascript">
   //<![CDATA[
     var _gaq = _gaq || [];
     _gaq.push(['_setAccount', '{G_ANALYTICS_ID}']);
     _gaq.push(['_trackPageview']);

     (function() {
       var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
       ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
       var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
     })();
   //]]>
   </script>
   <!-- END google_analytics_code -->

<!-- Compteur de mots by Suditidus _ tuto BestRPG _ http://best-rpg.forumpro.fr/ -->
<script language="javascript" type="text/javascript">
function calculeLongueur(chaine){
  var iLongueur; /* Ne pas modifier sans s'y connaître */
 
  var exp=new RegExp("[a-zA-Z0-9éèêëàáâäóòôöíìîïçÉÈÊËÀÁÂÄÒÓÔÖÌÍÎÏÇ-]+","g"); /* Ne pas modifier sans s'y connaître */
  var bbcode_reg = new RegExp("[[a-z]*]|[/[a-z]*]","g"); /* Ne pas modifier sans s'y connaître */
 
  var BBCode = chaine.match(bbcode_reg); /* Ne pas modifier sans s'y connaître */
  var Mots = chaine.match(exp); /* Ne pas modifier sans s'y connaître */
 
  if(BBCode) {
      iLongueur = Mots.length - BBCode.length; /* Ne pas modifier sans s'y connaître */
  }
  else {
      iLongueur = Mots.length; /* Ne pas modifier sans s'y connaître */
  }

  /* C'est le nombre 200 qu'il faut modifier pour changer les règles adaptées à votre forum */
  if(iLongueur < 400) {
      if (iLongueur <= 1) {
        document.getElementById('indic').innerHTML = iLongueur + " mot"; /* Ne pas modifier sans s'y connaître */
      }
      else {
        document.getElementById('indic').innerHTML = iLongueur + " mots"; /* Ne pas modifier sans s'y connaître */
      }
  }
  else {
      document.getElementById('indic').innerHTML = "LE MESSAGE POSTÉ EST VALIDE" + " <i>(" +  iLongueur + " mots)</i>";
  }
}
</script>
</head>
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
   <!-- BEGIN hitskin_preview -->
   <div id="hitskin_preview" style="display: block;">
      <h1><img src="http://2img.net/i/fa/hitskin/hitskin_logo.png" alt="" /> Hit<em>skin</em>.com</h1>
      <div class="content">
         <p>
            {hitskin_preview.L_THEME_SITE_PREVIEW}
            

            <span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
         </p>
      </div>
   </div>
   <!-- END hitskin_preview -->

   <!-- BEGIN switch_login_popup -->
   <div id="login_popup">
      <table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0">
         <tr height="25">
            <td class="catLeft">
               <span class="genmed module-title">{SITENAME}</span>
            </td>
         </tr>
         <tr height="{LOGIN_POPUP_MSG_HEIGHT}">
            <td class="row1" align="left" valign="top">
               <div id="login_popup_buttons">
                  <form action="{S_LOGIN_ACTION}" method="get">
                     <input type="submit" class="mainoption" value="{L_LOGIN}" />
                     <input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                     <input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" />
                  </form>
               </div>
               <span class="genmed">{LOGIN_POPUP_MSG}</span>
            </td>
         </tr>
      </table>
   </div>
   <!-- END switch_login_popup -->

   <a name="top"></a>
   {JAVASCRIPT}
   <table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
      <tr>
         <td class="bodyline">
            <table width="100%" cellspacing="0" cellpadding="0" border="0">
               <tr>
                  <!-- BEGIN switch_logo_left -->
                  <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                  <!-- END switch_logo_left -->
                  <td align="center" width="100%" valign="middle">
                     <!-- BEGIN switch_logo_center -->
                     <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
                     

                     <!-- END switch_logo_center -->
                     <div class="maintitle">{MAIN_SITENAME}</div>
                     

                     <span class="gen">{SITE_DESCRIPTION}
  </span>
                  </td>
                  <!-- BEGIN switch_logo_right -->
                  <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                  <!-- END switch_logo_right -->
               </tr>
            </table>

            <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
               <tr>
                  <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
               </tr>
            </table>

            <div style="clear: both;"></div>

            <!-- BEGIN switch_ticker_new -->
            <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
               <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
                  <tr>
                     <td {CLASS_TABLE_TYPE} align="left" class="row1">
                        <div id="fa_ticker_container">
                           <ul id="fa_ticker_content"  class="jcarousel-skin-tango" style="display:none;">
                              <!-- BEGIN ticker_row -->
                              <li>{switch_ticker.ticker_row.ELEMENT}</li>
                              <!-- END ticker_row -->
                           </ul>
                        </div>
                     </td>
                  </tr>
               </table>
            </div>
            <!-- END switch_ticker_new -->

            <!-- BEGIN switch_ticker -->
            <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
               <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
                  <tr>
                     <td {CLASS_TABLE_TYPE} align="left" class="row1">
                        <div id="fa_ticker_container">
                           <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
                              <div class="fa_ticker_content">
                                 <!-- BEGIN ticker_row -->
                                 <div>{switch_ticker.ticker_row.ELEMENT}</div>
                                 <!-- END ticker_row -->
                              </div>
                           </div>
                        </div>
                     </td>
                  </tr>
               </table>
            </div>
            <!-- END switch_ticker -->

            <div id="page-body">
               <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
                  <table cellpadding="0" cellspacing="0" width="100%" class="three-col">
                     <tbody>
                        <tr>
                           <td valign="top" width="{C1SIZE}">
                              <div id="{ID_LEFT}">
                                 <!-- BEGIN giefmod_index1 -->
                                 {giefmod_index1.MODVAR}
                                    <!-- BEGIN saut -->
                                    <div style="height:{SPACE_ROW}px"></div>
                                    <!-- END saut -->
                                 <!-- END giefmod_index1 -->
                              </div>
                           </td>
                           <td valign="top" width="100%">
<!-- BEGIN html_validation -->
                           </td>
                        </tr>
                     </tbody>
                  </table>
               </div>
            </div>
         </td>
      </tr>
   </table>
</body>
</html>
<!-- END html_validation -->

Et le javascript je l'ai mis "sur toutes les pages" voilà x)

[Invité]

Bonsoir,

Vous avez mis le code donné dans le tuto dans le template overall header ? Normalement il faut l'afficher dans une page HTML ou, maintenant que cela est possible dans une page javascript.

Et le script doit normalement se mettre dans la description du site.

Cordialement

[tara1505]

J'ai mis le code {HOSTING_JS} dans mon overhall.

Et j'ai mis sur une page pour javascript le code comme indiqué.

[Invité]

Mais il n'y a pas de code à mettre dans ce template, en tout cas pas pour le sélecteur de couleurs. Le code javascript peut être mis dans une page javascript.

En plus bien sûr du code CSS à insérer dans la feuille CSS.

Cordialement

[tara1505]

J'ai posté le css tout au début de mon post et le code y est. Et ils disent d'ajouter dans le overhall quand on en a un modifié. Ce qui est mon cas.

[Invité]

Je viens de relire le Tuto (vous parlez bien de celui-ci : https://forum.forumactif.com/t287454-ajouter-un-selecteur-de-couleur?highlight=s%E9lecteur+de+couleurs ?) et je ne vois aucune mention indiquant qu'il faut modifier ce template.

Cordialement

[tara1505]

Normal il est indiqué pour l'ajout du javascript et non directement là : ici
http://s301826463.onlinehome.fr/fdf/viewtopic.php?pid=9#p9

[Invité]

Oui, je le sais car le lien est fourni dans le tuto. Seulement à part le code à mettre dans la partie CSS et le code javascript à mettre dans les code javascript, il n'y a pas d'autres modifications à faire.

Cordialement

[tara1505]

Me suis trompée de lien xD

Ca et je fais un screen plus simple.

https://2img.net/r/ihimizer/img30/9107/testsvs.png

[Invité]

Ok, j'ai compris. Mais votre template overall header était-il modifié auparavant ?

Cordialement

[tara1505]

Oui justement sinon je n'aurais pas mis le code {HOSTING_JS} x)

A moins qu'il faille mettre autre chose dans le overall

[Invité]

Ok. Cela est résolu.

Pour ce qui est du sélecteur de couleurs, avant la mise en place de la gestion des codes javascript, il existait une autre solution pour installer le sélecteur. Vous pouvez éventuellement la tester :

1/ Mettre le code CSS fourni dans la feuille de style CSS.
2/ Créer une page HTML. Lui donner un nom et taper "abc" dans le contenu du code et valider. Retourner dans la page HTML et insérer le code javascript fourni dans le tuto.
3/ Mettre ce type de script

Code:

<script type='text/javascript' src='URL DU LIEN DE LA PAGE'></script>

dans la description du site.

Cordialement

[tara1505]

Je tente alors ^^
ET dans mon, overhall je laisse le pett code ?

[Invité]

Je pense que oui.

Cordialement

[tara1505]

Ca marche c'est parfait ^^
Merci !

[tara1505]

Heuuuuuuuuuuuu sur mes deux forums ca marche et sur l'in d'eux j'ai plus accès aux mp oO

[Invité]

A quel niveau se situe le problème ?

-Vous n'avez plus l'onglet des mp dans votre barre de navigation ?
-Vous arrivez à cliquer sur votre bouton mais la liste de vos mp ne s'affiche pas ?

Vérifiez dans le PA>Affichage>templates>poster et messages privés si l'un de vos templates n'est pas modifié. Si c'est le cas, supprimez ce template modifié.

Cordialement

[tara1505]

C'est bon merci xD