Moteur de recherche google

Résolu/Fermé

trickylola Messages postés 28 Date d'inscription mardi 9 avril 2013 Statut Membre Dernière intervention 19 juillet 2017 - Modifié le 19 juil. 2017 à 07:29
trickylola Messages postés 28 Date d'inscription mardi 9 avril 2013 Statut Membre Dernière intervention 19 juillet 2017 - 19 juil. 2017 à 10:36

Bonjour, je viens de créer un moteur de recherche google pour mon site perso mais lorsque je l'intègre dans ma page, la fenêtre de recherche prend toute la largeur de l'écran.

Voici le code:

<script>
  (function() {
    var cx = '002218182929357581679:wh3pn0_vkgy';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:search></gcse:search>

quelqu'un peut-il me dire quoi modifier pour que la fenêtre soit plus petite?

Merci

A voir également:

Moteur de recherche google
Google maps satellite - Guide
Dns google - Guide
Google earth - Télécharger - 3D
Rechercher ou entrer l'adresse mm - recherche google - Guide
Google - Guide

1 réponse

Réponse 1 / 1

dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021 1 451
19 juil. 2017 à 08:18

Bonjour,

Tu peux créer une class dans ta feuille de styles, par exemple google et appliquer cette class à une div.

Par exemple :

<div class="google">
<script>
  (function() {
    var cx = '002218182929357581679:wh3pn0_vkgy';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:search></gcse:search>
</div>

.google {
margin-left:auto;
margin-right:auto;
width:50%;
}

trickylola Messages postés 28 Date d'inscription mardi 9 avril 2013 Statut Membre Dernière intervention 19 juillet 2017
19 juil. 2017 à 08:27

Bonjour Dugenou et merci.
J'ai collé les deux codes que tu viens de mettre dans mon document html mais le résultat est identique.
Dois-je modifier une valeur dans ceux-ci ? De plus, je les ai placé à la suite dans le document. Aurais-je fait une erreur?

dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021 1 451 > trickylola Messages postés 28 Date d'inscription mardi 9 avril 2013 Statut Membre Dernière intervention 19 juillet 2017
Modifié le 19 juil. 2017 à 08:52

Le code CSS est à mettre dans ta feuille de styles ou entre des balises <style>.

.google {
margin-left:auto;
margin-right:auto;
width:50%;
}

trickylola Messages postés 28 Date d'inscription mardi 9 avril 2013 Statut Membre Dernière intervention 19 juillet 2017 > dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021
19 juil. 2017 à 09:04

Génial, ça marche. Merci infiniment Dugenou. Pour finir, en espérant ne pas abuser, puis-je savoir quel code ajouter afin que la fenêtre de recherche se situe par exemple à gauche du site, ou a droite, ou plus haut, ou plus bas, car en cet instant précis, elle se situe au milieu alors même que j'ai ajouté la balise </center> au dessus du code que tu m'as donné :). Une balise qui ici, ne semble avoir aucun effet sur le positionnement de la fenêtre de recherche.

Il ne faut pas utiliser la balise <center>, il faut jouer sur les marges (margin-left ou margin-right) pour positionner ton champs de recherche plus à droite ou plus à gauche.

Au pire, dans la balise <div> tu peux appliquer un style de cette manière :

<div style="text-align: center;">

Pour les autres positions, c'est assez variable, ça dépend de la structure de ta page.
Pour faire simple, tu peux placer ton script et sa balise <div> à l'endroit de la page de ton choix, c'est à dire, en haut ou en bas. Si tu as créé une partie "footer", ça peut être un bon emplacement.

Super, j'ai obtenu ce que je voulais et ce, grâce à toi.
MILLE MERCIS !!!

:)

Discussions similaires

Yahoo Search (moteur de recherche) revient