How can I reposition texts on my webpage?

orange1989 · May 27, 2022, 4:35am

Hello,

I would like to change the position of the texts on this page.

I’d like to have the texts under the image to be on top of them.

Here’s the preview link,

https://n5myead3ba80oj0o-44305055895.shopifypreview.com

Hope you can help me. Thank you!

Mr_RaviRaj · May 27, 2022, 4:50am

@orange1989

it’s a customization work and you need to hire a developer,
or if you want to try your self then remove the title code and add it to the above of image code.
for these you must have a prior knowldege of coding.

thank you.

orange1989 · May 27, 2022, 4:53am

I do have a very basic knowledge in coding since I just started learning it. I would like to do this myself.

If you can tell me more about this, “remove the title code and add it to the above of image code”, that would be great.

Mr_RaviRaj · May 27, 2022, 5:02am

@orange1989

ONE-TIME PURCHASE

find this code on the featured-promotion.liquid file and add it to the above of image where do you want.

it difficult to guide you, give me this file featured-promotion.liquid code.

orange1989 · May 27, 2022, 5:10am

I don’t know how to export it so I copy pasted it.

Here it is,

{% comment %}
** Featured promotions - dynamic **

Draggable section
Uses blocks
{% endcomment %}

{% comment %} Content settings {% endcomment %}
{%- assign blocks = section.blocks -%}
{% comment %} End content settings {% endcomment %}

{% if section.blocks.size > 0 %}

{% for block in blocks %} {% comment %} Content settings {% endcomment %} {%- assign image = block.settings.image -%} {% comment %} End content settings {% endcomment %}

{% if block.settings.link != blank %} {% endif %}

{% if image != blank %} {% render 'image-element', image: image, alt: image.alt, %} {% else %} {% capture i %}{% cycle "1", "2", "3", "4", "5", "6" %}{% endcapture %} {{ 'collection-' | append: i | placeholder_svg_tag: 'placeholder-svg placeholder-svg--promotions' }} {% endif %}

{% if block.settings.title != blank %}

{% if section.settings.show_divider %}

{% endif %} {% endif %}

{% if block.settings.link != blank %}

{% endif %}

{% if block.settings.text != blank %}

{% endif %}

{% endfor %}

{% endif %}

{% schema %}
{
“name”: “Featured promotions”,
“class”: “shopify-section–featured-promotions”,
“max_blocks”: 4,
“settings”: [
{
“type”: “range”,
“id”: “featured_promos_per_row”,
“label”: “Promotions per row”,
“min”: 2,
“max”: 4,
“step”: 1,
“default”: 3
},
{
“type”: “select”,
“id”: “featured_links_style”,
“label”: “Animation”,
“default”: “animate_down”,
“options”: [
{
“value”: “”,
“label”: “None”
},
{
“value”: “animate_in”,
“label”: “Fade In”
},
{
“value”: “animate_up”,
“label”: “Fade Up”
},
{
“value”: “animate_down”,
“label”: “Fade Down”
}
]
},
{
“type”: “checkbox”,
“id”: “rounded_image”,
“label”: “Rounded images”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “show_divider”,
“default”: true,
“label”: “Show divider”
}
],
“blocks”: [
{
“type”: “image”,
“name”: “Promotion”,
“settings”: [
{
“type”: “image_picker”,
“id”: “image”,
“label”: “Image”,
“info”: “840px wide recommended”
},
{
“type”: “url”,
“id”: “link”,
“label”: “Link”
},
{
“type”: “text”,
“id”: “title”,
“label”: “Heading”,
“default”: “Promotion”
},
{
“type”: “richtext”,
“id”: “text”,
“label”: “Text”,
“default”: “

This is a featured promotion block, add some text here to talk about your promotion.

”
}
]
}
],
“presets”: [{
“name”: “Featured promotions”,
“category”: “Image”,
“settings”: {
},
“blocks”: [
{
“type”: “image”,
“settings”: {
“image”: “”,
“link”: “”,
“title”: “Promotion”,
“text”: “

This is a featured promotion block, add some text here to talk about your promotion.

”
}
},
{
“type”: “image”,
“settings”: {
“image”: “”,
“link”: “”,
“title”: “Promotion”,
“text”: “

This is a featured promotion block, add some text here to talk about your promotion.

”
}
},
{
“type”: “image”,
“settings”: {
“image”: “”,
“link”: “”,
“title”: “Promotion”,
“text”: “

This is a featured promotion block, add some text here to talk about your promotion.

”
}
}
]
}],
“templates”: [
“index”,
“product”,
“page”
]
}
{% endschema %}

Mr_RaviRaj · May 27, 2022, 5:13am

@orange1989

{% comment %}
** Featured promotions - dynamic **

Draggable section
Uses blocks
{% endcomment %}