Sujets similaires

je dois être complètement à l'ouest en ce moment mais je ne comprends pas, pourrais-tu me montrer un exemple s'il te plaît ?

merci beaucoup, c'est le truc qui est en bas, c'est bien ça ?

C'est la barre noire avec le logo menant au facebook W3universe et les infos directs ?

génial merci beaucoup

Je me posais juste une question, après avoir bidouillé avec ardeur... Est-il possible que cette barre n'apparaisse qu'en page d'accueil et non lorsque l'on rentre sur les forums ?

Désolée du double post, mais visiblement on ne peut plus éditer =)
Je rajoute une seconde question: Est-il possible, par un code quelconque, de faire en sorte qu'en cliquant sur un bouton ce ne soit que la barre qui se ferme et non tout la page ? (J'ai déjà testé avec la balise

Code:: <html>
<head><script language="Javascript">
function Fermer()
{
opener=self;
self.close();
}
</script></head>

Mais c'est (comme on pouvait s'y attendre ._.) toute la page qui se ferme.

Sujet: Re: Barre Hitskinienne avec logo (messages) Lun 25 Oct 2010, 09:11

Coucou!

J'ai une question: peut-on mettre la barre de naviguation dans la barre ? ^^
Si oui, comment fait-on ?

Sujet: Re: Barre Hitskinienne avec logo (messages) Lun 25 Oct 2010, 10:16

Coucou, c'est très simple pour le faire. Tu recherches dans ton template ceci: {GENERATED_NAV_BAR} que tu mets entre les deux td

Sujet: Re: Barre Hitskinienne avec logo (messages) Lun 25 Oct 2010, 10:18

Oooh ! D'accord ! Merciii beaucoup !!! =D

Sujet: Re: Barre Hitskinienne avec logo (messages) Mar 16 Nov 2010, 09:17

Merci beaucoup pour ce tuto !
Je n'avais pas prévu de faire ça à la base mais au final c'est l'idéal.
La possibilité de permettre une navigation enrichie en peu de place cheers

Sujet: Re: Barre Hitskinienne avec logo (messages) Mer 26 Jan 2011, 19:58

Merci Orange,
Merci Little Lady,

bon tuto
et bon conseil.

Je progresse ! Barre Hitskinienne avec logo (messages) 3933776953

Sujet: Re: Barre Hitskinienne avec logo (messages) Mer 26 Jan 2011, 21:40

Bonjour,
(impossible d'éditer mon dernier message : c'est normal ?)

En suivant les 2 tuto de Orange et le conseil de Little Lady pour mettre la barre de navigation dans la barre Hitkinienne, ça a bien marché.
J'ai rajouté center et hauteur 25. Et pointillés sous la barre.

Mais les textes ou images de la barre de navigation restent en partie basse de la barre fixe,
et les images sont intégrées en mini mini.

J'ai cherché, mais rien trouvé, y compris dans les anciens messages.

Si quelqu'un peut m'aider ?

Je n'ai rien mis dans le CSS, car rien ne fonctionnait, j'ai tout enlevé.
Donc, pas de CSS à vous fournir.

Mon template, modifié uniquement sur l'intégration des barres de navigation et Hitki, comme indiqué ci-dessus :

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>

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

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

<link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />

{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>


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



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



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


<script type="text/javascript">//<![CDATA[
$(document).ready(function(){
   
      pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
      pm.focus();
   
   
      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();
   
   
      ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});
   
});


   var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;



$(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
      });
   });
});

//]]>
</script>
{GREETING_POPUP}

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



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

</head>
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
<table style="position: fixed; left: 0px; top: 0px; right: 0px; background-color: #560060; z-index:1000; width: 100%; border-bottom:1px white dotted;" ><tr height="20"></tr>
<tr><td>

<center><span class="navi">{GENERATED_NAV_BAR}</span></center>

</td></tr></tr></table>


<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}
         <br />
         <span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
      </p>
   </div>
</div>



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


<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>
               
               <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
               
               <td align="center" width="100%" valign="middle">
                  
                  <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
                  <br />
                  
                  <div class="maintitle">{MAIN_SITENAME}</div>
                  <br />
                  <span class="gen">{SITE_DESCRIPTION}<br />  </span>
               </td>
               
               <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
               
            </tr>
         </table>

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

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

         
         <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;">
                           
                           <li>{switch_ticker.ticker_row.ELEMENT}</li>
                           
                        </ul>
                     </div>
                  </td>
               </tr>
            </table>
         </div>
         

         
         <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">
                              
                              <div>{switch_ticker.ticker_row.ELEMENT}</div>
                              
                           </div>
                        </div>
                     </div>
                  </td>
               </tr>
            </table>
         </div>
         

         <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}">
                              
                              {giefmod_index1.MODVAR}
                                 
                                 <div style="height:{SPACE_ROW}px"></div>
                                 
                              
                           </div>
                        </td>
                        <td valign="top" width="100%">

                        </td>
                     </tr>
                  </tbody>
               </table>
            </div>
         </div>
      </td>
   </tr>
</table>
</body>
</html>

Je vous donne également une image, c'est la barre provisoire de mon forum, avec l'option affichage sans les textes (je changerai les boutons plus tard avec du texte intégré) :
Barre Hitskinienne avec logo (messages) Captur14

Les images utilisées font 1cmx1cm, j'aimerais bien que ça reste à peu près cette dimension dans la barre fixe.

Le résultat du test est ici : http://fjtest.kanak.fr/forum

J'ai ajouté au code donné par Orange, height=25, mais je ne sais pas si la barre doit en fait s'élargir automatiquement en fonction du contenu ?

En résumé, je voudrais surtout que les images soient dimensionnables (1cmx1cm environ)
et éventuellement qu'elles soient centrées en hauteur dans la barre,
ou qu'elles soient de la même hauteur que la barre.

Merci pour vos réponses.

Sujet: Re: Barre Hitskinienne avec logo (messages) Jeu 27 Jan 2011, 10:53

Ok, sNipe et merci.
J'ai fait un copié-collé, mais je ne peux pas éditer.

Bye. Very Happy

Sujet: Re: Barre Hitskinienne avec logo (messages) Jeu 27 Jan 2011, 15:14

Hello lapamina (:
Juste pour information, c'est tout à fait normal que tu ne puisses pas éditer ^^
La fonction "éditer" n'est pas disponible dans les tutoriels et les codes à copier/coller donc ne t'inquiète pas (:
Voilàà =D

Haaan merci. Sa fait toujours plaisir de trouver plusieurs codes utiles

Barre Hitskinienne avec logo (messages)

Barre Hitskinienne avec logo (messages)

Sujets similaires

Sujets similaires

Partenaires Or