label options für checkboxen oder Gruppen

Hallo Aicha,

habe deine Formulare schon erfolgreich eingesetzt, gefallen mir sehr - jetzt ein paar Fragen dazu und ich fange mit dem oben angegebenen Thema an:

ist es möglich den Label einer Checkbox oder einer Gruppe auszublenden? Das bräuchte ich hier:
hebammenzentrum.at/test/kontakt

Und hier noch zusätzliche Fragen, deren Lösungen ich über das Forum nicht gefunden habe:

1. nach der Installation von Visform ist alles auf Englisch - wie stell ich das auf Deutsch um?
2. wenn ich hier: hebammenzentrum.at/test/achter-heidi - das e-mail Feld auf required setze, dann wird es rechts ausgerichtet, wenn nicht required, dann links - ich hätte es gerne required und links ausgerichtet :)
3. dieses e-Mail Feld ist weiß hinterlegt und ich kann die Farbe im Firefox/Inspektor zwar ändern, aber nicht transparent setzen, würde ich aber gerne. Auch, wenn ich den background Eintrag im Inspektor disable wird der Hintergrund des Feldes weiß angezeigt - sonst hab ich keinen Eintrag gefunden, der die Hintergrundfarbe definiert.
4. und hier hab ich das gleiche Problem mit required - wenn Vorname, Nachname, E-Mail Adresse required ist, dann rechts ausgerichtet - und das Label Thema, ich möcht keine Labels anzeigen

Ich verwende SP Page Builder und Helix3 - hat das mit der Positionierung der Pflichtfelder zu tun?

lieben Gruß - Marco

Hallo Mario,

irgendwie sieht das HTML von Visforms ein ganz klein bisschen seltsam aus und es fehlt, soweit ich das auf den ersten Blick sehen kann, etwas CSS. Ich kann im Moment noch nicht entscheiden, ob das etwas mit dem Pagebuilder zu tun hat, ist aber gut möglich. Kannst du mir bitte Mal sagen, welche Visforms Version du verwendest?

Gruß,
Aicha

Hallo Mario,

so ich hatte nun Zeit, mir das etwas genauer anzusehen. Mit dem HTML ist erst mal alles ok.

In der aktuellen Visforms Version ist es nicht möglich das Label von Checkboxgruppen, Radion Buttons, Listboxen und einzelnen Checkboxen zu verstecken. Du kannst das aber mit eigenem CSS erreichen.

Du kannst eine für Visforms eine CSS-Datei anleigen, in die du eigenes CSS schreiben kannst. Siehe: vi-solutions.de/de/support/dokumentation...out-mit-css-anpassen

Um dein Problem mit dem linken Rand bei den "Required"-Feldern zu lösen gibst du in dieser CSS-Datei folgenden Code ein

.visform label.visCSSlabel {
display: none;
}

Um das Checkboxgruppen-Label dann komplett zu verstecken gibst du folgenden Code ein

.visform .visCSSmargLeft.visCSSrbinl {
margin-left: 0;
}

Damit die Eingabefelder einen transparenten Hintergrund haben müsstest du in deinem Custom CSS folgenden Code eingeben. (Das weiß kommt von deinem Template).

.visform input.visCSSinput {
background-color: transparent !important;
}

Mit der Sprache. Kann es sein, dass du auf deiner Webseite nicht de-DE verwendest, sondern de-AT? Die Visforms Sprachdateien heißen de-DE und irgendwie scheint es so, dass diese nicht korrekt gefunden werden, wenn die Seitensprache auf de-CH oder de-AT steht. Dieses Problem konnte ich bislang immer noch nicht lösen. Ich weiß nicht genau, wie man das lösen kann, der Nutzer, der folgenden Post geschrieben hat, hat es offensichtlch hinbekommen, aber nicht beschrieben wie. vi-solutions.de/de/support/forum/19-joom...ders-einfaerben#4551
Ich werde da noch mal weiter suchen und melde mich noch mal.
Gruß,
Aicha

Hallo,

also ich habe mir das mit der Sprache noch mal angeschaut. In Joomla! ist es so, dass de-DE und de-AT wirklich wie zwei unterschiedliche Sprachen behandelt werden. D.h. wenn ich möchte, dass auf einer Webseite, die als Sprache de-AT eingestellt hat, Visforms in Deutsch läuft, dann muss ich ein komplettes Sprachpaket de-AT anbieten. Joomla! selbst bietet keine Tools um zu sagen, dass, z.B. statt de-AT die de-DE Sprachdateien verwendet werden soll, falls de-AT nicht existiert.

Zusätzliche Sprachpakete für die insgesamt 5 deutschen Sprachausprägungen anzubieten, ist natürlich schon etwas Aufwand... hm

Prnzipiell lässt sich das Problem für dich also erst mal nur lösen, indem du sowohl die Verzeichnisse de-DE als auch in den Dateinamen der Übersetzungdateien das de-DE gegen de-AT ersetzt. Sprachdateien liegen sowohl in administrator/components/com_visforms/languages als auch in components/com_visforms/languages als auch in modules/mod_visforms/languages als auch in den Plugin Verzeichnissen.

Gruß,
Aicha

Hallo Aicha,

danke erstmal für deine rasche Antwort - und hier meine Antworten:

1. ich verwende Visforms Version 3.11.6
2. alle CSS Einträge tun genau das was ich brauche, danke!
3. ist ja kein Problem für mich die Sprache auf de-DE umzustellen - wichtig ist dann auch die Sprache beim Benutzer umzustellen, hat auch ein bischen gedauert, bis mir das klar wurde. Visform wird also jetzt in Deutsch angezeigt - danke!

Jetzt brauch ich nur mehr den Klassennamen für den Senden Button für dieses Formular, weil ich den Button hier anders einfärben möchte: hebammenzentrum.at/test/kontakt
Habe ich zwar schon mit eigener CSS Class "submitt_button" versucht, gelang mir aber nicht wirklich, keine Änderung der backround-color. Der Eintrag erscheint im Inspektor durchgestrichen - kannst du mir da bitte weiterhelfen?!

Und noch eine Frage bezüglich diesem Formular:
Gibt es die Möglichkeit, je nach dem, ob keine Checkbox ausgewählt wurde oder die Checkboxen "Newsletter" oder "Magazin", verschiedene E-Mail Adressen zu hinterlegen? Bei den Hebammen sind verschiedene Personen für verschiedene Bereiche zuständig - also allgemeine Anfragen/Themen die eine Person, Anmeldungen für Newsletter oder Magazin eine andere Person ...

Wobei ... in Zukunft sollten die Newsletteradressen in einer Liste landen, damit ein Abmelden per Link auch möglich wäre, so wie z.B. mit MailChimp. Kennst du da eventuell ein Produkt, welches du empfehlen kannst für Newsletter? Muss nicht unbedingt auf amerikanischen Servern laufen

Und dann hab ich noch eine Frage - Fragen über Fragen - wenn das Formular, z.B. auf meiner Kontaktseite, auf einem Handy angezeigt wird, dann steht da für:
.visCSSinput, .editor {
width: 66%;
margin-top: 10px;
background: none;
}

Kann ich bei veringerter Auflösung die volle Breite des Bildschims benutzen - also 100%?!

Danke nochmal für deine Hilfe und liebe Grüße nach Oberzent

Hallo Mario,

visforms setzt auf dem Button die background Eigenschaft auf none. Deshalb musst du in deinem Custom CSS auch mit der background Eigenschaft arbeiten. Du kannst dort eine Farbe angeben oder aber auch eine url für ein Background-Image.

.visform .btn.submit_button {
background: #777;
}

Sieh dir mal das Subscription Plugin Custom Mail Address an. vi-solutions.de/de/support/dokumentation...-custom-mail-address
Damit kannst du deine E-Mail Anforderung lösen.

Wenn du sehr experimentierfreudig bist, kannst du auch Visforms 3.12.2-Beta und die Visforms Subscription 3.3.2-Beta umsteigen (Download nur hier über die Webseite, bitte wirklich gründlich testen und gute Backups machen). Dort habe ich die Konfiguration für solche optionsabhängige Mailempfänger komplett umgearbeitet, so dass man diese in der Feldkonfiguration sehr kompfortabel eingeben kann und nicht mehr über den sehr entwicklernahen String in der Pluginkonfiguration. Siehe: vi-solutions.de/de/support/dokumentation...ngige-mailempfaenger

Mit der Newsletter Komponente kann ich dir leider nicht weiterhelfen.

Hinsichtlich der Feldbreite. Visforms kommt mit unterschiedlichen Layouts. Standardmäßig ist das "Visforms" Layout gewählt, das einfach auf den allermeisten Webseiten passt. Dieses Layout arbeitet tatsächlich für alle Device-Größen mit den prozentualen Größen für die Label-Breite und die Input-Breite. Andere Layouts, z.B. die Bootstrap 2 oder Bootstrap 3 Layouts dagegen verhalten sich richtig responsiv, allerdings benötigt man dann auch ein Template, dass das entsprechende Boostrap 2 oder Boostrap 3 CSS liefert.

Deine Nachfrage hat mich nun allerdings auf die Idee gebracht, dass ich auch für das Visforms Standardlayout eigentlich sehr einfach ein resonsives Verhalten im CSS implementieren kann und dass das vielleicht eine richtig gute Idee ist. Man kann dies über eine sogenannte media-Query erreichen und ich denke ich werde das gleich implementieren, so dass es mit dem nächsten Visforms release raus geht.

Für dich ist die Lösung eigentlich relativ einfach in deinem Custom CSS umsetzbar. Du kannst entweder für alle Bildschirmbreiten die Breite der inputs auf 100% setzen

.visform .visCSSinput, .visform .editor {
width: 100%;
}

oder du packst diesen CSS-Schnipsel in eine media-Query, so dass er nur auf kleineren Bildschirmen zum Tragen kommt. Den Wert bei max-width kannst du an deine Bedürfnisse anpassen.

@media (max-width: 979px) {
.visform .visCSSinput, .visform .editor {
width: 100%;
}
}

Für die Sprachen habe ich jetzt auch ein Lösung gefunden. Ich habe mir endlich mal die Zeit genommen und ein Installer-Script geschrieben, dass mir automatisiert aus den de-DE Sprachdateien Installationen für die anderen deutschen Sprachen erstellt. Diese werde ich zukünftig auf unserer Webseite zum Download anbieten, so dass man sich diese dann eben auch einfach dazu installieren kann.

Liebe Grüße;
Aicha