Moin Zusammen,
Ausgangssituation ist, dass ich einen Code habe für eine Sektion in unserem Theme, der Code aber nicht das macht, was ich gerne hätte. 
Ziel ist es einen Text-Block zu bekommen, den wir für innere Verlinkungen benutzen wollen, um unser SEO zu verbessern. Es soll wie bei Snocks aussehen, also einen Abschnitt zu haben, der in 2 Spalten und 3 Zeilen Texte mit Überschriften zeigt (zu finden auf deren Homepage ganz unten, vor dem Footer):
Mein bisheriger Code sieht folgendermaßen aus:
<section class="seo-text-section">
<div class="seo-text-container">
<div class="seo-text-grid">
<div class="seo-text-block">
{{ section.settings.text_block_1 }}
</div>
<div class="seo-text-block">
{{ section.settings.text_block_2 }}
</div>
<div class="seo-text-block">
{{ section.settings.text_block_3 }}
</div>
</div>
</div>
</section>
<style>
.seo-text-section {
padding: 40px 20px;
background-color: #f9f9f9;
font-family: sans-serif;
}
.seo-text-container {
max-width: 1200px;
margin: 0 auto;
}
.seo-text-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 40px 60px;
}
.seo-text-block {
break-inside: avoid;
}
.seo-text-block h2 {
font-size: 20px;
margin-bottom: 10px;
}
.seo-text-block p {
font-size: 15px;
line-height: 1.6;
color: #333;
}
.seo-text-block a {
color: #0073e6;
text-decoration: underline;
}
@media (max-width: 768px) {
.seo-text-grid {
grid-template-columns: 1fr;
}
}
</style>
{% schema %}
{
"name": "SEO Text Block",
"settings": [
{
"type": "richtext",
"id": "text_block_1",
"label": "Text Block 1",
"default": "<h2>Deine Überschrift</h2><p>SEO-Text mit <a href='#'>Link</a></p>"
},
{
"type": "richtext",
"id": "text_block_2",
"label": "Text Block 2",
"default": "<h2>Weitere Inhalte</h2><p>Mehr Content</p>"
},
{
"type": "richtext",
"id": "text_block_3",
"label": "Text Block 3",
"default": "<h2>Dritter Block</h2><p>Noch ein Text</p>"
},
{
"type": "richtext",
"id": "text_block_4",
"label": "Text Block 4",
"default": "<h2>Vierter Block</h2><p>Noch ein Text</p>"
},
{
"type": "richtext",
"id": "text_block_5",
"label": "Text Block 5",
"default": "<h2>Fünfter Block</h2><p>Noch ein Text</p>"
},
{
"type": "richtext",
"id": "text_block_6",
"label": "Text Block 6",
"default": "<h2>Sechster Block</h2><p>Noch ein Text</p>"
}
],
"presets": [
{
"name": "SEO Text Block",
"category": "Custom"
}
]
}
{% endschema %}
Momentan wird der Code leider so angezeigt:
Unsere Webseite findet ihr hier.
Weiß jemand was am Code verbessert werden muss, es wäre eine große Hilfe.
Vielen Dank im voraus und Liebe Grüße,
Simon