Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Ajouter une barre de recherche Google à votre forum

Voir le sujet précédent Voir le sujet suivant Aller en bas

  • 0

Astuce Ajouter une barre de recherche Google à votre forum

Message par Shadow Jeu 17 Juil 2014 - 15:04

Ajouter une barre de recherche Google à votre forum

Cette astuce nécessite que vous possédiez un compte Gmail pour utiliser le service Google Custom Search Engine.

Cette astuce vous explique comment installer une barre de recherche Google sur votre forum Forumactif. Cet ajout est très utile pour trouver des sujets similaires sur le forum, et est très facile à configurer !

Créer le script via Google Custom Search Engine


Ajouter une barre de recherche Google à votre forum 14-05-10

  1. Cliquez sur le bouton "Ajouter" pour ajouter une barre de recherche ;

    Voir illustration :
    Ajouter une barre de recherche Google à votre forum 14-05-11

  2. Renseignez l'adresse URL de votre forum, choisissez la langue et renseignez un nom pour la barre si vous le souhaitez, puis valider en cliquant sur Créer.

    Voir illustration :
    Ajouter une barre de recherche Google à votre forum 14-05-12

  3. Dans modifier le moteur de recherche, personnalisez le rendu des résultats de recherche et de la barre en elle-même dans Apparence ;

    Voir illustration :
    Ajouter une barre de recherche Google à votre forum 14-05-13

  4. Vous pouvez personnaliser en fonction de votre forum et prévisualiser le résultat avant d’enregistrer ;

    Voir illustration :
    Ajouter une barre de recherche Google à votre forum Recher14

  5. Une fois votre barre personnalisée, sauvegardez et obtenez le code à copier sur votre forum :

    Voir illustration :
    Ajouter une barre de recherche Google à votre forum 14-05-14


Installer le script sur votre forum Forumactif


Dans le message sur page d'accueil de votre forum


Panneau d'administration  Affichage  Page d'accueil - Généralités

Voir illustration :
Ajouter une barre de recherche Google à votre forum 14-05-16

Ce qui donne comme résultat :

Ajouter une barre de recherche Google à votre forum 14-05-15

Sur la page d'accueil de votre forum via un script Javascript


Panneau d'administration  Modules  HTML & JAVASCRIPT - Gestion des codes Javascript

Assurez-vous que la gestion des codes Javascript soit activée, puis créez un nouveau javascript ayant pour titre "Barre de recherche Google" et pour placement "Sur toutes les pages" (plus d'informations sur la gestion des scripts).

Code:
$(function () {
  //Renseigner ici entre ' ' le code obtenu sur Google
  var cx = '004869397998480616231:wa9kmobovvq';
 
        if($("div#search-box").length){
      //phpBB3 avec barre de recherche
      $("div#search-box").html("<div id='my_gs'><gcse:search></gcse:search></div>");
  }else{
      if($("div#page-body").length){
        //phpBB2, phpBB3 sans barre de recherche & punBB
        $("<div id='my_gs'><gcse:search></gcse:search></div>").insertBefore("div#page-body");
      }else{
        //Invision
        $("<div id='my_gs'><gcse:search></gcse:search></div>").insertAfter("div#submenu");
      }
  }
 
  var gcse = document.createElement('script');
  gcse.type = 'text/javascript';
  gcse.async = true;
  gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
      '//www.google.com/cse/cse.js?cx=' + cx;
  var s = document.getElementsByTagName('script')[0];
  s.parentNode.insertBefore(gcse, s);
});

Dans le code ci-dessus, il faut remplacer la valeur de la variable cx par celle de votre script (élément surligné en jaune dans l'illustration ci-dessous) :

Voir illustration :
Ajouter une barre de recherche Google à votre forum 29-06-11

Personnaliser la barre de recherche


Vous avez la possibilité de personnaliser la barre de recherche afin de l'adapter au thème de votre forum :

Panneau d'administration  Affichage  Images et Couleurs - couleurs (Onglet Feuille de style CSS)

Pour personnaliser la barre de recherche


Code:
.my_gs{
      /* Propriétés CSS (sans !important) */
}
 
div#my_gs{
        width: 300px; /* Par exemple */
}

Pour personnaliser le cadre de recherche


Code:
input.gsc-input{
      /* Propriétés CSS (avec !important) */
}

Pour personnaliser le cadre Google


Code:
#gsc-i-id1{
        /* Propriétés CSS (avec !important) */
}

Pour personnaliser le bouton de recherche


Code:
input.gsc-search-button{
      /* Propriétés CSS (avec !important) */
}

Voir illustration :
Ajouter une barre de recherche Google à votre forum 17-07-10

Shadow

Shadow
Modéractive
Modéractive

Féminin
Messages : 24353
Inscrit(e) le : 30/03/2007

Voir le profil de l'utilisateur
Shadow a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum