Bei einer Avada Pricingtable die Farben ändern

Das Avada WordPress Theme ist ziemlich beliebt. Auch bei meinen Kunden.

Gerade hatte ich die Frage auf dem Tisch, ob man die Hintergrundfarbe des mittleren Produkts einzeln ändern könnte, um es noch mehr hervorzuheben.

Prinzipiell kann man bei der Avada Pricingtable die Farben nur für die ganze Tabelle bestimmen. Es haben also also Produkte den gleichen Hintergrund.
Dafür hat man dann einen Mouse-Over Effekt, der den Hintergrund ein wenig ändert, wenn man mit der Maus darüber fährt.

Möchte man die Farbe einzelner Elemente ändern, muss man zunächst die ganze Tabelle mit einer eigenen Klasse versehen.
Das macht man direkt bei den Einstellungen der Pricingtable. Einfach den „class“ Parameter auf einen beliebigen Namen, z.B. „meineTabelle“ setzen.

Dann benötigen wir ein CSS Ergänzungen, die wir unter Design / Theme Options / Custom CSS eintragen:

.meineTabelle .panel-wrapper:nth-child(2) .panel-heading {
background-color: white !important;
}
.meineTabelle .panel-wrapper:nth-child(2) .panel-body {
background-color: white !important;
}
.meineTabelle .panel-wrapper:nth-child(2) .list-group-item {
background-color: white !important;
}
.meineTabelle .panel-wrapper:nth-child(2) .panel-footer {
background-color: white !important;
}

Das .panel-wrapper:nth-child(x) sucht das x-te Panel aus der Tabelle heraus. Hier also das zweite (mittlere von dreien).
Alle Versuche auf das mittlere Panel mit Hilfe von Klassen oder id’s zuzugreifen sind übrigens fehlgeschlagen, nur die nth-child Methode hat funktioniert.
Jede Zeile ändert die Hintergrundfarbe eines anderen Teils des Eintrags, hier mache ich den kompletten Eintrag weiß.

Eine andere Frage war die Ausrichtung des Textes in den Einträgen.

Soll sie in der ganzen Tabelle gleich sein, folgendes zu den Custom CSS hinzufügen:

#wrapper .fusion-pricing-table .list-group-item {
text-align: left;
}

Soll nur ein einzelnes Panel betroffen sein, einfach das Schema von oben benutzen. Aber nur die list-group-item Klasse:

.meineTabelle .panel-wrapper:nth-child(2) .list-group-item {
background-color: white !important;
text-align: left;
}

 

Kommentare jetzt wieder möglich

Peinlich, peinlich ….

Gerade habe ich mich gewundert, dass der Artikel zu „Owncloud und selinux“ recht oft gelesen wird, aber nie irgendwelche Kommentare geposted werden.

Also hab ich versucht einen Test-Kommentar zu erstellen und bin prompt gescheitert. Fehlermeldungen beim Captcha.

Der Grund war schnell gefunden: Fehlende Schreibrechte auf einem SI-Captcha Cache Verzeichnis. Lies sich mit FileZilla leicht beheben, obwohl ich bei dem Server keinen Zugang zu einer SSH Console habe. Rechts-klick auf den Folder, Eigenschaften, Rechte auf 777 (schreiben für alle).

Das heisst Kommetare sind ab sofort wieder möglich und ich freue mich über jeden einzelnen!