Forum: NOF - Tutorials (185 anschauliche Tutorials zum Lesen und Nacharbeiten) > Problembehebung in NOF

Navigationspfeile und Bilder der NOF-Galerie zentrieren

(1/1)

nettesekel:
Wechselt man in der NOF-Bildgalerie von einem quer- zu einem hochformatigen Bild, werden die Navigationspfeile nicht mehr zentriert positioniert.

Während bei einem querformatigen Bild die Pfeile korrekt zentriert werden sind sie bei einem hochformatigen Bild rechts ausgerichtet und ragen je nach Bild sogar über den rechten Rand des Bildes hinaus.

Wer nicht weiß, was gemeint ist, kann sich auf dieser Demoseite das beschriebene Verhalten der Navigationspfeile ansehen. http://demos.nof-community.de/bilder-und-navigationspfeile-der-nof-bildgalerie-zentrieren/demo1.html

Weil schön anders ist, habe ich mich bemüht, eine Lösung für dieses Problem zu finden und die sieht wie folgt aus.

Hinweis:
Einige der Screenshots in diesem Tutorial verursachen ihrer Größe wegen einen Querscroller. Das ist beim Lesen nicht immer so ganz bequem. Wer lesen möchte ohne querscrollen zu müssen, kann über den kleinen Minus-Button unterhalb der Google-Übersetzer-Maske die linken Forenblöcke ausblenden und gewinnt so den benötigten Platz um die Screenshots im Ganzen sehen zu können.



Solltet ihr in eurer Galerie Bilder verschiedenen Formats nutzen und vor dem beschriebenen Problem stehen, dann öffnet zunächst aus der Baumansicht heraus die von NOF generierte Galerieseite. Damit ist nicht die Seite gemeint, auf welcher sich eure Thumbnails befinden, sondern die mit den vergrößerten Bildern zum durchblättern. Ihr erkennt sie an der besonderen Art von Ordner. (Siehe Screenshot)





Auf dieser Seite seht ihr nun eines der Bilder eurer Galerie und oberhalb dieses Bildes die drei Navigationspfeile.
Ich habe hier gezielt ein Bild im Querformat gewählt. Zieht euch zunächst an irgendeiner Stelle einen kleinen Layoutbereich auf, auf dem in etwa die 3 Navigationspfeile Platz haben.





Nun markiert ihr die drei Navigationspfeile, indem ihr mit gedrückter Hochstelltaste (die für Großbuchstaben) nacheinander alle drei Pfeile anklickt. Danach lasst ihr die Hochstelltaste los, klickt auf einen der drei Pfeile und haltet die Maustaste dabei gedrückt. Zieht die drei Pfeile nun mit gedrückter Maustaste auf den Layoutbereich und lasst die Maustaste los.
Wenn die Pfeile auf dem Layoutbereich liegen, schiebt ihr den Layotbereich soweit es geht in Höhe und Breite zusammen.

nettesekel:
Nun fügt ihr eine Tabelle mit einer Spalte und zwei Zeilen ein, Höhe und Breite Automatisch, Text- und Zellenabstand auf 0.





Stellt im Anschluss auch den Rahmen auf 0 und schiebt dann den Layoutbereich mit den Pfeilen in die obere Zeile der eingefügten Tabelle.





Markiert den Layoutbereich mit einem einfachen Klick, aktiviert auf der EP den reiter für die Ausrichtung und setzt einen Punkt bei "zentriert".

nettesekel:
Nun markiert ihr die untere Zeile der Tabelle mit einem einfachen Klick. Der Cursor darf nicht blinken, die Zelle muss einen schwarzen Rand haben. Aktiviert auf der EP den Reiter für die Tabellenzeile-eigenschaften und stellt die vertikale Ausrichtung auf oben.





Im Anschluss markiert ihr eure Galerie indem ihr sie am ganz äußeren Rand anklickt, im Screenshot der dünne grüne Rahmen und zieht die Galerie in die untere Tabellenzeile.






Auch für die Galerie stellt ihr die Ausrichtung auf zentriert. (siehe Screenshot)





Wenn ihr eure Galerie nun publiziert verhalten sich Bilder und Navigationspfeile wie es in folgender Demo  zu sehen ist.  http://demos.nof-community.de/bilder-und-navigationspfeile-der-nof-bildgalerie-zentrieren/demo2.html
Wem das Ergebnis seiner Arbeit gefällt, der kann an dieser Stelle halt machen. Wen es jedoch stört, dass die schmalen Bilder zur Mitte hin "springen" der kann mit wenigen Schritten auch das noch abändern.

nettesekel:
Hierzu klickt ihr euch über die im Screenshot markierte Schaltfläche bis zu einem Bild im Hochformat durch.
Ihr könnt an der Breite der Tabelle jetzt schon erkennen, warum hohe Bild zur Mitte hin springt.





Markiert nun die Tabelle mit einem einfachen Klick und schiebt sie soweit es geht zusammen.





Hat die Tabelle die Breite des hohen Bildes angenommen, dann publiziert erneut eure Galerieseite.




Nun wird sich die Galerie beim durchblättern so verhalten, wie es in dieser Demo zu sehen ist. http://demos.nof-community.de/bilder-und-navigationspfeile-der-nof-bildgalerie-zentrieren/demo3.html

nettesekel:
Ich hoffe, ich kann mit dieser kleinen Anleitung dem Einen oder Anderen helfen und wünsche gutes Gelingen.  (fubar)

Navigation

[0] Themen-Index