Comment mettre un barre de recherche Google

[Dodo22]

Bonjour,
je voudrai savoir comment mettre un barre de recherche Google personnalisée sur mon forum,sachant que 'ai déjà eu le code et j'ai déjà essayé de mettre dans la feuille CSS personnalisé mais rien à faire ça ne marche pas.
Merci d’avance.

[Gorgorbey]

Bonjour,

Pouvez-vous mettre le code ici SVP ?

Cordialement.

[Dodo22]

Bonsoir,
Voici le code:

Code:

<div id="cse" style="width: 100%;">Loading</div>
<script src="http://www.google.fr/jsapi" type="text/javascript"></script>
<script type="text/javascript">
  google.load('search', '1', {language : 'fr', style : google.loader.themes.SHINY});
  google.setOnLoadCallback(function() {
    var customSearchOptions = {};
    var customSearchControl = new google.search.CustomSearchControl(
      '004782078408602834989:uyk7logv4sg', customSearchOptions);
    customSearchControl.setResultSetSize(google.search.Search.SMALL_RESULTSET);
    customSearchControl.draw('cse');
  }, true);
</script>
 <style type="text/css">
  .gsc-control-cse {
    font-family: Verdana, sans-serif;
    border-color: #DAE0E5;
    background-color: #ff0000;
  }
  input.gsc-input {
    border-color: #8A99A6;
  }
  input.gsc-search-button {
    border-color: #8A99A6;
    background-color: #D0D1D4;
  }
  .gsc-tabHeader.gsc-tabhInactive {
    border-color: #B2BDC6;
    background-color: #B2BDC6;
  }
  .gsc-tabHeader.gsc-tabhActive {
    border-color: #8A99A6;
    background-color: #8A99A6;
  }
  .gsc-tabsArea {
    border-color: #8A99A6;
  }
  .gsc-webResult.gsc-result,
  .gsc-results .gsc-imageResult {
    border-color: #FFFFFF;
    background-color: #FFFFFF;
  }
  .gsc-webResult.gsc-result:hover,
  .gsc-webResult.gsc-result.gsc-promotion:hover,
  .gsc-imageResult:hover {
    border-color: #D2D6DC;
    background-color: #EDEDED;
  }
  .gs-webResult.gs-result a.gs-title:link,
  .gs-webResult.gs-result a.gs-title:link b,
  .gs-imageResult a.gs-title:link,
  .gs-imageResult a.gs-title:link b {
    color: #0568CD;
  }
  .gs-webResult.gs-result a.gs-title:visited,
  .gs-webResult.gs-result a.gs-title:visited b,
  .gs-imageResult a.gs-title:visited,
  .gs-imageResult a.gs-title:visited b {
    color: #0568CD;
  }
  .gs-webResult.gs-result a.gs-title:hover,
  .gs-webResult.gs-result a.gs-title:hover b,
  .gs-imageResult a.gs-title:hover,
  .gs-imageResult a.gs-title:hover b {
    color: #0568CD;
  }
  .gs-webResult.gs-result a.gs-title:active,
  .gs-webResult.gs-result a.gs-title:active b,
  .gs-imageResult a.gs-title:active,
  .gs-imageResult a.gs-title:active b {
    color: #0568CD;
  }
  .gsc-cursor-page {
    color: #0568CD;
  }
  a.gsc-trailing-more-results:link {
    color: #0568CD;
  }
  .gs-webResult .gs-snippet,
  .gs-imageResult .gs-snippet,
  .gs-fileFormatType {
    color: #5F6A73;
  }
  .gs-webResult div.gs-visibleUrl,
  .gs-imageResult div.gs-visibleUrl {
    color: #5F6A73;
  }
  .gs-webResult div.gs-visibleUrl-short {
    color: #5F6A73;
  }
  .gs-webResult div.gs-visibleUrl-short {
    display: none;
  }
  .gs-webResult div.gs-visibleUrl-long {
    display: block;
  }
  .gs-promotion div.gs-visibleUrl-short {
    display: none;
  }
  .gs-promotion div.gs-visibleUrl-long {
    display: block;
  }
  .gsc-cursor-box {
    border-color: #FFFFFF;
  }
  .gsc-results .gsc-cursor-box .gsc-cursor-page {
    border-color: #B2BDC6;
    background-color: #FFFFFF;
    color: #0568CD;
  }
  .gsc-results .gsc-cursor-box .gsc-cursor-current-page {
    border-color: #8A99A6;
    background-color: #8A99A6;
    color: #0568CD;
  }
  .gsc-webResult.gsc-result.gsc-promotion {
    border-color: #D2D6DC;
    background-color: #D0D1D4;
  }
  .gs-promotion a.gs-title:link,
  .gs-promotion a.gs-title:link *,
  .gs-promotion .gs-snippet a:link {
    color: #0066CC;
  }
  .gs-promotion a.gs-title:visited,
  .gs-promotion a.gs-title:visited *,
  .gs-promotion .gs-snippet a:visited {
    color: #0066CC;
  }
  .gs-promotion a.gs-title:hover,
  .gs-promotion a.gs-title:hover *,
  .gs-promotion .gs-snippet a:hover {
    color: #0066CC;
  }
  .gs-promotion a.gs-title:active,
  .gs-promotion a.gs-title:active *,
  .gs-promotion .gs-snippet a:active {
    color: #0066CC;
  }
  .gs-promotion .gs-snippet,
  .gs-promotion .gs-title .gs-promotion-title-right,
  .gs-promotion .gs-title .gs-promotion-title-right *  {
    color: #333333;
  }
  .gs-promotion .gs-visibleUrl,
  .gs-promotion .gs-visibleUrl-short {
    color: #5F6A73;
  }
</style>

Merci d'avance

[Gorgorbey]

Allez dans : PA > Affichage > Page d'accueil > Généralités > Message sur la page d'accueil
Contenu du message : Mettez le code et enregistrez
Vous devez le mettre dans un endroit acceptant le HTML, la page CSS n'accepte QUE le CSS

[Dodo22]

Merci mais quand je l'ai fait ca ne mettait pas la barre de recherche est-ce qu'il n'y a pas des guillemets oudes choses dans le genre la a rajouté.(sachant que le portail est installé mais caché)
Merci d'avance.

[Gorgorbey]

Vous avez mis uniquement ce code dans la page d'accueil ?

[Dodo22]

Bonjour,
Oui j'ai mis que ce code dans la page d accueil
Merci d'avance.

[Gorgorbey]

Allez dans : PA > Affichage > Page d'accueil > Généralités > Message sur la page d'accueil
Contenu du message

Lorsque vous êtes là, vérifiez que le bouton HTML est bien comme ça : :+html: et non comme ça : :-html:
S'il est en rouge, cliquez pour qu'il redevienne vert.

[Dodo22]

Merci

[Dodo22]

Cela marche bien encore merci