Rich-Text oder mehrzeiliges Textfeld auf Produktseite

[RAlfV74]

Hallo

ich verwende das Impulse Theme und muss auf der Produktseite zusätzliche Informationen aus einem Metafeld eintragen. Ich kann das allerdings nicht über einen Tab Block machen, da die Information sofort sichtbar und nicht aufklappbar sein soll (also entweder direkt Rich-Text oder Mehrzeilige Textbox). Aktuell sieht das so aus.

Der Inhalt vom Tab Produktinformation soll allerdings immer sichtbar sein, also ohne ihn erst aufklappen zu müssen. Wäre dankbar für eure Unterstützung .

/Ralf

[Ben310]

Warum verwendest du “Collapsed Tabs” um einen persistenten Text anzuzeigen ? Das ist ja nicht der Sinn der Sache, da sie vom User ja zuerst wahlweise aufgeklappt werden müssen um den Inhalt zu expandieren. Wenn du den Text der Produktinformationen immer expandiert anzeigen möchtest anstatt im “collapsed state” dann würde ich vorschlagen einen anderen Theme Feature dafür zu verwenden. Ansonsten muss man das mit einem CSS coden (was deine Page Loading Speeds verschlechtern kann) wie z. B.:

.collapsibles-wrapper .collapsible-content {
    height: auto !important; 
    max-height: none !important; 
    display: block !important; 
}

.collapsible-trigger__icon {
    display: none;
}

.collapsible-trigger-btn {
    pointer-events: none;
    cursor: default;
    background: none; 
}

Oder (einfach CSS selber tweaken oder Experten engagieren):

.collapsibles-wrapper .collapsible-content {
    height: auto !important;
    max-height: none !important;
    display: block !important;
    overflow: visible !important; 
    opacity: 1 !important;
    visibility: visible !important;
    transition: none !important; 
}

.collapsible-trigger-btn {
    display: none !important;
}

[Finer]

@RAlfV74 leider lässt das Impulse-Theme einem nur die Option “Single Line Text”-Metafelder sichtbar einzubauen. Du kannst aber über einen Custom-Liquid-Block auf das Richt-Text-Metafeld verweisen. Dadruch wäre es immer sichtbar.

Im Custom-Liquid-Block setze zu Folgendes ein:

{% if product.metafields.custom.description != blank %}
{{ product.metafields.custom.description | metafield_text }}
{% endif %}

Denk daran, den Namespace und Key (“custom.description”) durch deine Werte zu tauschen.

Zudem ist in dem Code noch ein “Style”-Attribut enthalten, damit du noch das Erscheinungsbild (Schriftgröße oder Farbe) anpassen könntest. Das ist aber nur optional.

[RAlfV74]

@Ben310 , ich hatte mich vermutlich nicht korrekt ausgedrückt, ich möchte ja eigentlich gar keinen “Collapsed Tabs” verwenden, allerdings ist dies der einzige Block, über den ich einen mehrzeiligen Text mit dem Inhalt des Metafields anzeigen lassen kann. Ansonsten stehen nur das “Single-line-text” Feld zur Verfügung, welches mir allerdings nichts nützt, da der Inhalt ja mehrzeilig angezeigt werden soll.

Bezüglich Deiner CSS - erst mal danke dafür. Leider gibt es bei den Blöcken unter der Produktebene keine Möglichkeit CSS hinzuzufügen. Wenn ich das auf der Produktebene mache, werden aber alle “Collapsed Tabs” geändert. Dies ist leider auch nicht zielführend.

[RAlfV74]

@Finer Danke für Deine Antwort, aber das Custom Liquid kann ja nur als Abschnitt eingefügt werden, ich bräuchte aber einen Block im Produktabschnitt. Außerdem wird der Inhalt über das Liquid in einen einzeiligen Text umgewandelt. Auch das ist leider nicht das was ich mir vorgestellt habe.
Besteht irgendwie die Möglichkeit einen Block in der Produktgruppe zu erstellen als mehrzeiliger Text oder Rich-text?

[Ben310]

Nein auch als Custom HTML Block der Liquid Variablen und Filter unterstützt, den du dann per drag&drop nach oben ziehen kannst:

[RAlfV74]

@Ben310 mit HTML funktioniert es. Habe dann folgenden Code verwendet:

{% assign richText = product.metafields.custom.produktinformationen | strip_html %}

{{ richText | newline_to_br }}

Für meinen Anwendungsfall geht es damit einwandfrei.

Danke nochmal

[Ben310]