gelöst Gestaltung der "additional_fields"

Thema wurde von florian-streicher, 9. Februar 2017 erstellt.

  1. florian-streicher
    florian-streicher Erfahrener Benutzer
    Registriert seit:
    10. Januar 2016
    Beiträge:
    69
    Danke erhalten:
    3
    Danke vergeben:
    34
    Hallo,

    die beim Artikel angelegten Zusatzfelder sind per Bootstrap mit col-xs-4 (Bezeichnung) und col-xs-8 (Inhalt/Wert) definiert. Da ich kurze Werte, aber lange Bezeichnungen habe, würde ich dies gerne umkehren, also dass der Bezeichner eine Spaltenbreite von col-xs-8 und der Wert nur col-xs-4 breit ist.

    Wo kann ich dies bearbeiten?
     
  2. Anonymous
    Anonymous G-WARD 2015/2016
    Registriert seit:
    20. Februar 2012
    Beiträge:
    9.094
    Danke erhalten:
    1.616
    Danke vergeben:
    1.214
    Moin

    evtl. hier: Honeygrid/snippets/shipping_time.html?
    Dort wird zumindest die col-Zahl für die Lieferzeit festgelegt...
     
  3. florian-streicher
    florian-streicher Erfahrener Benutzer
    Registriert seit:
    10. Januar 2016
    Beiträge:
    69
    Danke erhalten:
    3
    Danke vergeben:
    34
    Danke, aber das ist es nicht.
     
  4. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    Das richtet sich danach, wo die Felder angezeigt werden.
    Wenn Du das in dem Block hast, wo der Lagerbestand, Artikelnummer... angezeigt werden, erbt es die Größe von dort.
    Sonst würde das nciht einheitlich aussehen.
     
  5. florian-streicher
    florian-streicher Erfahrener Benutzer
    Registriert seit:
    10. Januar 2016
    Beiträge:
    69
    Danke erhalten:
    3
    Danke vergeben:
    34
    Nein, es ist nicht mehr in diesem Block.
    Ich bin mir relativ sicher, dass es nicht vererbt wird.
    In welcher Datei bzw. wie wird die Variable/Array $additional_fields erzeugt?
     
  6. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    Dann braucht man einen Link, um zu schauen wo und wie das bei Dir ist.
     
  7. florian-streicher
    florian-streicher Erfahrener Benutzer
    Registriert seit:
    10. Januar 2016
    Beiträge:
    69
    Danke erhalten:
    3
    Danke vergeben:
    34
    Entschuldigt bitte, ich stehe bei dem Projekt sehr unter Zeitdruck.
    Ich habe es nun quick&dirty gelöst:

    1. Zusätzlicher Container um die $additional_fields:

    Code:
    <div class="custom-additional-fields">
    {$additional_fields}
    </div>
    2. Überschreiben der Bootstrap-Klassen:

    Code:
    .custom-additional-fields .col-xs-4, .custom-additional-fields .col-xs-8 {width:50%;}
    So erhalte ich zwei gleich breite Spalten (eine andere Aufteilung z.B. 60:40 wäre so auch möglich...)

    Danke trotzdem für eure Antworten!
     
  8. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    col-xs-4 = 4 Teile von 12 bei einem Smartphone
    col-xs-8 = 8 Teile von 12 bei einem Smartphone

    Du gibst jetzt dem Bereich
    .custom-additional-fields
    einmal die Größe xs-4 und gleichzeitig die Größe xs-8. sagst ihm aber das xs-8 nicht 8 von 12 sondern 50% sein soll.
    Da fehlt die Unterteilung der Felder Titel und Text.
     
  9. florian-streicher
    florian-streicher Erfahrener Benutzer
    Registriert seit:
    10. Januar 2016
    Beiträge:
    69
    Danke erhalten:
    3
    Danke vergeben:
    34
    #9 florian-streicher, 9. Februar 2017
    Zuletzt bearbeitet: 9. Februar 2017
    Nein.
    Die Gambio Variable/Array {$additional_fields} gibt Folgendes aus:

    Code:
    <dt class="col-xs-4 text-left">HierDieBezeichnung</dt>
    <dt class="col-xs-8">HierDerWert</dt>
    Das war meine meine ursprüngliche Frage - welche Datei diesen Code erzeugt und wo ich diese Klassen (col-xs-4, col-xs-8) in diesem Zusammenhang ändern kann (z.b. in col-xs-6).

    Da ich darauf keine Antwort bekommen habe und auch selber nicht herausfinden konnte, habe ich um die Gambio Variable/Array den Container mit der Klasse "custom-additional-fields" erstellt.
    Mit diesem übergeordneten Container gebe ich, wenn man das so sagen will, den innerhalb liegenden Objekten eine eindeutige "Adresse". Mehr macht dieser Container nicht.

    Würde ich nun alle Bootstrap col-xs-4 Klassen im Template per CSS ändern wollen, würde ich die Klasse wie folgt ansprechen: .col-xs-4
    Da ich aber NUR diese spezielle col-xs-4 Klasse bei den Zusatzfeldern ändern wil, verwende ich:
    .custom-additional-fields .col-xs-4

    Ok?

    Der Rest ist dann nur noch einfache Mathematik:
    col-xs-4 und col-xs-8 zusammen ergeben: 100% Breite, da col-xs-4 = 33,3% (100/12*4) Breite und col-xs-8 = 66,6% (100/12*8) Breite entspricht.

    Eine genaue Erklärung zum Bootstrap Grid-System findet man hier: http://getbootstrap.com/css/#grid

    Da bei mir die erste Spalte grösser sein soll, setze ich beides auf 50%, indem ich die Standard-Bootstrap-Formattierung überschreibe.

    Ich sag ja, es ist nicht schön, aber es funktioniert.
    Wenn jemand eine elegantere Lösung weiß - lerne gerne dazu! :)
     
  10. barbara
    barbara G-WARD 2014-2020
    Registriert seit:
    14. August 2011
    Beiträge:
    35.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    #10 barbara, 9. Februar 2017
    Zuletzt bearbeitet: 9. Februar 2017
    Ich teste mal kurz etwas, kleinen Moment.

    Wenn ich die additional-fields über die "{$properties_selection_form}" verschiebe und denen Dein <div class...> verpasse, kann ich per css mit

    .custom-additional-fields dt {
    mein Code
    }

    und

    .custom-additional-fields dd {
    mein Code
    }

    gezielt die Titel und Texte anpassen.

    ich habe in meinem Test die Breite auf 60% / 40% gestellt, den Titel in grün und den Text in blau
    Unbenannt.JPG

    Zum Vergleich ist der Lagerbestand in der Standard-Einstellung darüber
     
  11. es kommt aus der Datei Honeygrid/module/additional_fields.html, da kann man die Werte anpassen
     
  12. florian-streicher
    florian-streicher Erfahrener Benutzer
    Registriert seit:
    10. Januar 2016
    Beiträge:
    69
    Danke erhalten:
    3
    Danke vergeben:
    34
    Ähm, danke postel! :)
    Frage mich gerade, wieso ich das nicht selber gefunden habe.
    Echt peinlich...

    Danke auch dir barbara für das nachforschen und deine Lösung! :)