Hallo, bin WP Anfänger und benötige Hilfe!
Meine Installation:
- WP-Version:3.6
- Themes Twenty Thirteen
Link zur Page: Siehe Profil – URL Ergänzung: /bilder-fuer-koenigskinder/
(es handelt sich um eine Arbeitsdomain, die ich nicht gerne öffentlich poste – wegen Suchmaschinen etc.)
Ich möchte eine Seite erstellen, auf der bis zu 40 Bilder als Thumbnails dargestellt werden sollen. Die Thumbnails sollen an klickbar sein. Mit klicken soll sich eine bestimmte Unterseite öffnen. Also keine Großansicht des Bildes.
Mir ist wichtig dabei:
Responsive Design, Bilder aus der Galerie sollen beim Skalieren der Page sauber unter einander floaten.
Zunächst habe ich versucht:
- mit Boardmitteln das gewünschte Design umzusetzen. Also über Seite erstellen Datei /Medien einfügen. Das verlinken der Thumbnails funktioniert ohne Probleme. Die Thumbnails ließen sich jedoch nicht sauber nebeneinander anordnen. Eine Tabelle möchte ich ungern nutzen wollen.
- mit NextGEN eine Galerie erstellt, nur lassen sich die Thumbnails leider nicht mit einem Link zum Artikel versehen. Siehe Post: http://forum.wpde.org/plugins-und-wi…n-aber-wie.html
- mit Boardmittel hier WP-Gallery eine Galerie erstellt, dort habe ich das gleiche Problem ich kann die Thumbnails nicht mit einem Link versehen
Wie kann ich das Problem lösen? Gibt es evtl. ein Script? Oder kann ich den Shortcodes der Galerie anpassen?
Bin für jeden Tipp Dankbar!!!
Rüdiger
Anfänger benötigt Hilfe! - Vorschaubilder mit Link zum Beitrag versehen -
-
-
- Gerade eben
- Anzeige
Hallo!
Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.
- ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
- ✔️ Deutsche Server & DSGVO-konform
- ✔️ Persönlicher Support (kein 0815-Ticket-System)
-
Du könntest den Thumbs eine Class geben und über CSS dann eine width und height, damit sie alle gleich groß sind. Oder die img über die page-ID formatieren. Mit float:left lässt Du sie nebenenander setzten. Das wäre dann auch im Bezug auf Responsive ok.
-
SirEctor
lieben Dank für die schnelle Rückmeldung! :-) Kannst du mir evtl. bei der Umsetzung behilflich sein? Ich bin wie beschrieben WP Anfänger. Ich kenne mich nur etwas mit PHP, Html und CSS aus. Wie und wo muss ich die CSS Class definieren?LD
Rüdiger -
Ohne Kenntnisse wird es schwer. Wenn Du auf der angegebenen Seite die Bilder rein setzt, dann teste mal folgendes:
Damit sollten dann alle Bilder auf dieser Seite eine Breite von 140px+10px Margin haben. Somit passen bei 604px Content-Breite 4 Bilder nebeneinander.Sonst musst Du die Class von Body auslesen und ändern. Mit der Breite und dem Margin kannst Du natürlich spielen.
-
@[COLOR=#3E3E3E]SirEctor,
jo, soll ich denn den Code Schnipsel einfügen? In der "Seiten bearbeiten" über den Editor- Text? [/COLOR]
-
Ich kenne mich nur etwas mit PHP, Html und CSS aus.
War das geschwindelt?Füge es ganz ans Ende Deiner style.css ein, entweder über Design->Editor oder über FTP.
-
[COLOR=#333333]@[/COLOR][COLOR=#3E3E3E]SirEctor,
Was meinst du mit; [/COLOR][COLOR=#333333]War das geschwindelt? [/COLOR][COLOR=#3E3E3E]
ok, mache ich. Kannst du mir bitte sagen wofür dieser Teil:[/COLOR] body.page-id-41 .entry-content im Code steht? Ich würde gerne dazu lernen.
Rüdiger
-
auf diese Weise?
@body.page-id-41 {
.entry-content img {float:left;width:140px;height:auto;margin:10px 5px;}
} -
Nein, nur so wie ich es geschrieben habe. Einfach ans Ende der style.css.
[COLOR=#333333]body.page-id-41 steht dafür, dass ich nur die Seite ansprechen will, die im body die class .page-id-41 hat und .entry-content heißt es soll nur der div mit der class .entry-content angesprochen werden.[/COLOR]
-
ok, habe den Code ans Ende angefügt. Noch eine Frage zur [COLOR=#333333].page-id-41 wo hast du diese Id bezogen? Ist das eine bestimmte Unterseite meines Themes? Und werden in Folge nur dort die die Änderungen angefügt?
Werde jetzt auf die Unterseite /[/COLOR]bilder-fuer-koenigskinder/ über den Seiten Editor 3 St. Bilder nebeneinander einfügen. Richtig? Sollten jetzt die Bilder sauber floaten...
-
In einem modernen Browser einfach mal F12 drücken und mit den Developer-Tool spielen. Damit bekommst Du IDs und Classes ziemlich schnell raus. Schau Dir an was bei body steht.
[COLOR=#333333].page-id-41 heißt, dass nur auf der Seite [/COLOR][COLOR=#333333][COLOR=#333333]/[/COLOR][/COLOR][COLOR=#333333]bilder-fuer-koenigskinder/ die Bilder formatiert sind, nicht auf Unterseiten oder sonstiges. Dazu einfach im Beitrag die Bilder einfügen. Ich kann Dir auch nicht versprechen ob meine Beispiel-Formatierung reicht. Musst Du mal testen. Kann sein, dass Du sonst etwas bei height angeben musst und width auf auto stellst.
Ich dachte nur, dass Du ein bisschen CSS kannst. Hattest Du das nicht geschrieben?[/COLOR]
-
Danke für deine Hilfe! Ok, mit den CSS Anweisungen selbst komme ich einigermaßen klar. Nur wie und wo bei WP Stellschrauben gedreht werden verstehe ich noch nicht! Werde jetzt mal an den CSS Anweisungen schrauben. Mal sehen was geht.
-
Wünsche Dir viel Erfolg.
-
werde mich mit Ergebnissen melden... für Heute mache ich den Deckel drauf. G.N. Rüdiger
-
SirEctor, habe die CSS Class jetzt für meine Bedürfnisse angepasst. Vielen Dank für die Unterstützung! Siehe: /bilder-fuer-koenigskinder/
Könntest Du mir noch einen Tipp geben, wie ich einen Eleganten Seitenwechsel hinbekommen? Die Galerien sind für eine Seite zu groß, also werde ich mehrere Seiten mit Vorschaubildern erstellen. Jetzt würde ich gerne im unteren Bereich der jeweiligen Seite einen Seitenzahl und Seitenzahlübersicht erstellen. So das der User komfortabel von einer Seite zur anderen Seite surfen kann.
Rüdiger
Jetzt mitmachen!
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!