Google Custom Search (CSEv2) Hilfe beim Styling?

8

Ich benötige Hilfe beim Gestalten der benutzerdefinierten Google-Suche (nicht die Ergebnisse)

Alte Stile verwenden die form -Tags, in denen Sie das Look & amp; Gefühl des Suchfelds.

%Vor%

Mit dem neuen CSEv2-Code ist er in den Skript-Tags enthalten:

%Vor%

und Sie müssen die folgenden Tags an die Stelle setzen, an der das Suchfeld angezeigt werden soll.

%Vor%

Ich brauche Hilfe, um das neue CSE so zu gestalten, dass es wie das vorherige aussieht. (Schriftgröße, Schaltfläche und Eingabefeld Größen .. etc, genau das gleiche Styling wie zuvor..apply Klassen / set font..etc)

Danke!

    
whispers 20.11.2013, 17:51
quelle

6 Antworten

7
  1. Verwenden Sie ein DOM-Inspektions-Tool, wie es in den Google Chrome- oder Firefox-Browsern integriert ist. (Klicken Sie mit der rechten Maustaste auf ein Element und wählen Sie "Inspizieren".) Dadurch können Sie die Element-IDs / Klassen und ihre aktuellen Stile bestimmen.

  2. Schreiben Sie CSS-Regeln, die diese Stile überschreiben, wie folgt:

    %Vor%
bwhet 03.01.2014 16:42
quelle
6

Sie müssen nicht all das tun, fügen Sie das einfach an das Ende der Google-Suche <script> tag Like So:

%Vor%

Stellen Sie sicher, dass Sie <gcse:searchresults-only ></gcse:searchresults-only> am Ende dieses schließenden Skript-Tags hinzufügen und fügen Sie ein eigenes Formular hinzu. Beispiel:

%Vor%

Dann style it, wie Sie jeden normalen HTML-Tag stylen würden, und Sie sind gut zu gehen! und es funktioniert genau so, wie es früher funktioniert hat. PS. Wenn Sie den Benutzer an einen anderen Ort für Beispiel search.html bringen möchten, fügen Sie einfach%%%%% von%% s% hinzu

Hoffnung Es hat dir geholfen! -Arqetech

    
Arqetech 14.11.2014 15:35
quelle
2

Auf der CSE-Seite

  1. Wählen Sie die Suchmaschine, die Sie stylen möchten.
  2. Klicken Sie auf Look and feel
  3. Klicken Sie auf den Tab Customize

Hier finden Sie Optionen, um jede Komponente von CSE zu formatieren, die Sie gestalten möchten.

Aktualisieren

Wenn Sie mehr Optionen als die im Steuerungsfeld angebotenen Optionen wünschen, müssen Sie die API verwenden , ein Beispiel für die Verwendung ist unten auf der Seite.

Besonders interessiert Sie API für die API für benutzerdefinierte Suchelemente , wo Sie dies tun können Geben Sie an, welches HTML-Tag die ID des Elements ist, das Sie dann verwenden können.

Beispieldemo :

%Vor%     
Pranav 웃 20.11.2013 18:06
quelle
1

WASSERZEICHEN LÖSCHEN:

%Vor%     
Nithin 07.03.2017 12:11
quelle
0

So habe ich das zur Arbeit gebracht. 1. Setzen Sie im Google-Skript async auf false (gcse.async = false); 2. Fügen Sie css unten hinzu. Es hängt wahrscheinlich von der Reihenfolge ab, in der die CSS geladen ist!

.gsc-Kontrolle-cse { Padding: 0! wichtig; }

    
Harry 11.08.2015 15:24
quelle
0

Sie müssen die Datei des Suchfelds und die Ergebnisse trennen.

Für die Hauptdatei:

%Vor%

Und für die Ergebnisdatei (Standard: search.html):

%Vor%

Wenn es nicht funktioniert, liegt es möglicherweise daran, dass Ihre Website nicht in der Google-Suchmaschine oder wahrscheinlich in einem Codefehler ist? Bitte antworten Sie, wenn es nicht funktioniert.

    
Kakkoiikun 26.06.2017 06:07
quelle

Tags und Links