Hello Everyone!
I have added the image with text section through coding but I want to keep the section as shown in the image below. Please help me. Thank you.
Store: https://bdcoffeeshop.myshopify.com/products/mushroom-coffee-with-6-adaptogenic-mushrooms
Password: Admin
What I want
I have used this code
{% schema %}
{
“name”: “Glowy Skin Section”,
“settings”: [
{
“type”: “image_picker”,
“id”: “glowy_skin_image”,
“label”: “Upload Image”
}
],
“presets”: [
{
“name”: “Glowy Skin Section”
}
]
}
{% endschema %}
.glowy-skin-section {
display: flex;
align-items: center;
justify-content: center;
padding: 40px;
background-color: #fff;
}
.glowy-image img {
max-width: 100%;
border-radius: 10px;
}
.glowy-content {
padding-left: 30px;
max-width: 500px;
}
.glowy-title {
font-size: 28px;
font-weight: bold;
color: #000;
display: flex;
align-items: center;
}
.glowy-title svg {
margin-left: 8px;
color: #ff4081;
}
.glowy-stats {
margin-top: 20px;
}
.stat-item {
display: flex;
align-items: center;
margin-bottom: 15px;
}
.stat-circle {
width: 50px;
height: 50px;
border-radius: 50%;
border: 5px solid #1d7c3e;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
font-weight: bold;
margin-right: 15px;
color: #1d7c3e;
}
.stat-text {
font-size: 14px;
color: #333;
}
The Future is Glowy Skin
97%
Said the appearance of fine lines and wrinkles have disappeared
96%
Noticed a reduction in the appearance of stretch marks on my belly
93%
Said their skin feels smoother and soft
Hi @dreamtechzone_5
You can use Custom Liquid block, the result will be as shown
https://i.imgur.com/nEmzxM3.png
1 Like
I don’t want to add images. I want to add a section for it. After using the code it looks like this but I want to keep it like the image below.
Now
What I want
