Standardkonventionen für CSS-Klassen / ID-Namen

7

Beim Erstellen einer benutzerdefinierten Komponente und beim Entwerfen der Layoutdatei zum Rendern der Ansicht fällt es mir schwer zu bestimmen, welche CSS-Klassen / IDs in meinen HTML-Elementen verwendet werden sollen, um sicherzustellen, dass das in Joomla integrierte CSS und andere Vorlagen verwendet werden.

Ich verstehe, dass Joomla Bootstrap verwendet, das eine gewisse Konsistenz bietet und auf das hier verwiesen werden kann: http://getbootstrap.com/2.3.2/base-css.html

Gibt es neben der Bootstrap-Implementierung jedoch Standard-CSS-Klassen / -IDs, mit denen ich die Konsistenz über die vielen verfügbaren Vorlagen hinweg sicherstellen kann? Und wenn ja, gibt es Verweise auf diese CSS-Klassen / IDs?

Ich denke, ich frage Sie, ob Sie das Erscheinungsbild der Komponente entwerfen würden. Welche Schritte würden Sie unternehmen, um sicherzustellen, dass das Erscheinungsbild in Synergie mit Joomla und anderen Vorlagen funktioniert?

— user3804927
quelle

Was auch immer Sie am Ende tun, ich würde empfehlen, Ihre Komponente so einfach wie möglich zu überschreiben. Dies erleichtert Site Buildern wie mir die Arbeit. Wenn Sie beispielsweise eine ganze Liste von Elementen haben, die im Front-End angezeigt werden, und jedes Element ein anderer Elementtyp ist, geben Sie ihnen nicht nur dieselbe Klasse, sondern allen eine zusätzliche Klasse, die für jedes Element einzigartig ist. Diese Art von Dingen macht es viel einfacher, einen Gegenstand zu verstecken oder ihn mit CSS anders zu gestalten.

— Brian Peat

5

Welche Schritte würden Sie unternehmen, um sicherzustellen, dass das Erscheinungsbild in Synergie mit Joomla und anderen Vorlagen funktioniert?

Es gibt keine Möglichkeit zu wissen, was in einer Vorlage unterstützt wird und was nicht. Mein Rat wäre daher, sich überhaupt nicht auf eine Vorlage zu verlassen, um Ihre Komponente zu gestalten. Es ist unmöglich, das Erscheinungsbild sicherzustellen, das letztendlich von der Vorlage entschieden wird.

Es gibt drei mögliche Ansätze; 1) Tun Sie nichts, 2) Hoffen Sie, dass die Vorlage die BS2- oder BS3-Syntax unterstützt, und wählen Sie eine davon aus, oder 3) fügen Sie Ihre eigene CSS hinzu.

Wenn Sie die richtigen HTML-Elemente für den Job verwenden, übernimmt die Vorlage ohnehin den größten Teil Ihres Stils (Option 1). Verwenden Sie für alles andere einen logischen Ansatz zur Benennung von Klassen für Ihre Komponentenelemente, folgen Sie den Joomla-Codierungsstandards für HTML und CSS und fügen Sie Ihrer Komponente Ihre eigene CSS hinzu. Wenn Sie dies tun , geben Sie bitte einen Schalter an, um es zu deaktivieren.

Als Vorlagenentwickler mache ich das Styling für jede Komponente, die ich verwende. Ich brauche und möchte keine Komponentenstile, obwohl ich das zu schätzen weiß. Der beste Weg ist, einfache Optionen in Ihrer Erweiterungskonfiguration bereitzustellen. CSS laden? ja / nein, js laden? ja Nein. Andernfalls stellen Sie sicher, dass sie mindestens aus der Ansichtsdatei geladen sind, damit sie überschrieben werden können, ohne Ihre Erweiterung zu hacken.

— Seth Warburton
quelle

Danke, dies ist eine gute Antwort, aber können Sie Ihre Antwort bearbeiten und ein wenig über den "Schalter" erklären. Beziehen Sie sich auf eine Überschreibung? Wenn eine Komponente ein CSS hat, war mein Gedanke, dass es sowieso durch eine Überschreibung überschrieben wird.

— user3804927

4

Derzeit gibt es keinen solchen Standard. Das nächste ist in der Tat die Bootstrap-Klassen.

Normalerweise stelle ich sicher, dass es in Protostar funktioniert, und hoffe auf das Beste.

Es gab einmal eine Art Standard, aber die Unterstützung dafür war gering und die Dokumentation schlecht. Es war im Grunde nur eine Liste von IDs und Klassen, die von Core verwendet wurden.

— Bakual
quelle

4

Ich wünschte, es gäbe eine Lösung dafür, aber leider gibt es keine. Es wäre großartig, wenn wir alle Erweiterungen entwickeln könnten, die sich in alle Vorlagen integrieren lassen.

Verwenden Sie am besten die Bootstrap-Klassen. Wenn sich der Stil nicht gut integrieren lässt, kann der Benutzer einfach eine Vorlagenüberschreibung für Ihre Komponente erstellen .

Stellen Sie einfach sicher, dass alles so dynamisch wie möglich ist.

Möglicherweise haben Sie bemerkt, dass viele von ihnen das HTML-Markup in mod_modulename.php einfügen , wenn Sie sich jemals mit Modulcode von Drittanbietern befassen. Dies bedeutet, dass der Benutzer die Ansicht nicht überschreiben kann und daher einen Kern-Hack ausführen muss, um das Modul entsprechend zu gestalten ihre Bedürfnisse.

Aus diesem Grund sollten alle Markups immer in die Ansichtsdatei eingefügt werden.

Hoffe das hilft

— Lodder
quelle

Dies bietet Vorlagenanbietern auch die Möglichkeit, einen alternativen Stil für Ihre Komponente einzuschließen, wenn diese codieren. Dies ist also ein sehr guter Rat, wo das Markup platziert werden soll!

— David Fritsch