BasisSeminare
Zum Seitenanfang Schritt hoch Schritt runter Zum Seitenende
Wie geht das? FiXed Navi und Iconbar - Version 1.001

Wie geht das? FiXed Navi und Iconbar - Version 1.001

13.07.2016 13:21

Navi und Iconbar - immer griffbereit

Sicherlich habt ihr euch schon daran gewöhnt, dass die Navi immer zur Verfügung steht, egal wo auf der Seite ihr euch gerade befindet. Dann nutzt ihr dieses Plugin bereits. Nun funktioniert das auch mit der Iconbar! Beim Schreiben langer Beiträge bleibt nun auch die Iconbar griffbereit, wenn ihr es wollt.

Ihr habt die Möglichkeit, Gruppenrechte und Z-Indexe, getrennt für Navi und Iconbar einzustellen und ...

... jetzt kommt's:

Anpassungen der schwebenden Bars per CSS


Wie geht das?


Was habt ihr getan?

Wir haben in diesem Plugin jeweils ein Feld für die Gestaltung der Navi und der Iconbar per CSS zur Verfügung gestellt.


Warum?

Wenn zum Beispiel die Iconbar über dem Beitrag schwebt, in dem du gerade schreibst, sollte sie sich vom Textfeld abheben. Sie muss etwas anders gestaltet werden, als wenn sie einfach nur am oberen Rand des Beitrags steht. Vielleicht soll auch das Navi-Menü eine besondere Gestaltung bekommen, wenn sie über Forum schwebt.


Warum habt ihr das nicht einfach für uns gemacht?

Weil ihr ganz sicherlich eine eigene Vorstellung vom Aussehen der fixierten Navi oder der "schwebenden Iconbar" in eurem Forum habt. Deshalb wollten wir die Gestaltung nicht vorgeben. Wir haben lediglich dafür gesorgt, dass die Hintergründe, die Breiten und die Positionen dem Standard entsprechen.


Warum gibt es diesmal keine einzelnen Variablen zum Einstellen?

Bei unseren Tests sind wir schon allein auf sieben Stellschrauben gekommen, um nur die Iconbar für das FoXum anzupassen.

Möglicherweise braucht ihr noch mehr. Man kommt da schnell auch auf die doppelte Anzahl. Woher sollen wir wissen, was ihr alles anpassen wollt? Also geben wir euch jeweils ein Feld, wo ihr alles nach Belieben eintragen könnt. Ihr könnt unser Beispiel nutzen und anpassen - ändern, löschen, hinzufügen, ...

Wichtig ist, das die SyntaxDie Syntax ist die Regelung, wie in Sprachen die Sätze aufgebaut sind.
Auch Programmiersprachen haben solche Vorgaben.
Wenn wir hier also von Syntax sprechen, meinen wir den Aufbau und die Reglen, wie ein Code aufgebaut ist.
erhalten bleibt.

In den Variablenbeschreibungen haben wir Vorschläge für solche CSS-Einträge gemacht. Für die Iconbar z.B. folgende:

1
2
3
4
5
6
7
 
'min-height':'39px',
'top': '60px',
'right': '7%',
'border': '0px solid #383838',
'background': '#F7F6F2',
'border-radius':'3px',
'box-shadow':'2px 2px 3px #383838'
 


Was macht dieser Code?

So, wie das nun da steht, macht der Code Folgendes:

Zeile 1 = Mindest-Höhe der Iconbar in Pixel - hier 39 Pixel
Zeile 2 = Abstand von oben in Pixel - hier 60 Pixel
Zeile 3 = Abstand von rechts in % - hier 7 %, eine größere Zahl rückt die Iconbar weiter nach links
Zeile 4 = Rahmenstärke in Pixel, Rahmenlinie, Rahmenfarbe - hier kein Rahmen, also 0 Pixel
Zeile 5 = Hintergrundfarbe - hier ein ganz helles Beige
Zeile 6 = abgerundete Ecken in Pixel - hier 3 Pixel, je größer die Zahl, desto runder die Ecken
Zeile 7 = Versatz des Schattens nach rechts und unten in Pixel, Ausdehnung des Schattens in Pixel, Schattenfarbe - hier 2 px-starker Schatten in Grau


Was mache ich, wenn ich das anders haben möchte?

Wenn du die Einstellungen ändern möchtest, darfst du nur die rot gekennzeichneten Werte ändern:

'min-height':'39px'
'top': '60px',
'right': '7%',
'border': '0px solid #383838',
'background': '#F7F6F2',
'border-radius':'3px',
'box-shadow':'2px 2px 3px #383838'


Die Erläuterungen hinter den Code-Zeilen dürfen also nicht mitkopiert und alle anderen Zeichen nicht gelöscht werden - und seien sie auch noch so klein. Natürlich kannst du Anweisungen, die du nicht benötigst weglassen. Oder auch weitere dazuschreiben - in der korrekten Syntax:

'eigenschaft': 'wert',


Zu beachten sind insbesondere die Hochkomma ' zum Einrahmen der Eigenschaften und Werte-Strings, der Doppelpunkt : als Trenner zu den Werten und das Komma , nach jeder Zeile.


Und was mache ich, wenn ich nicht aufgepasst und den Code verhauen habe?

Drücke in der Einstellungsmaske einfach auf den Button [Default wiederherstellen]. Dann stehen wieder unsere Vorschläge drin und du kannst es noch einmal versuchen.


Was habe ich davon, wenn ich in einem Plugin selbst solche Codes bearbeiten muss?

Abgesehen davon, dass du deine schwebenden Bars ganz individuell gestalten kannst?
Du lernst dabei auch noch etwas.

Na, alle Fragen beantwortet?
Wenn nicht, poste sie hier ...

Viel Erfolg! Euer FoX-Team

Einstellungen Beliebteste Blog-Artikel Andere Artikel dieser Kategorie, die für Sie interessant sein könnten: Neueste Artikel der Kategorie Hilfe für FoX-Plugins

Melden Sie sich an, um die Kommentarfunktion zu nutzen


Xobor Xobor Blogs
Datenschutz