Debut Theme - Add links to the 'Text columns with images'

Solved
Highlighted
Tourist
12 0 3

Hello everyone,

I would like to remove Mutfak, Aydinlatma and Dekorasyon headers and the Incele buttons, but add the link of the Incele button to the images directly.

Example:

Screen Shot 2020-08-03 at 12.40.58.png

How can I do this?

I would really appreciate the help.

Thanks.

0 Likes
Highlighted
Shopify Partner
2712 589 730

Hey @mondecor,

Please provide your website URL. Also, let me know which theme you're using so I will check and provide a solution here.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Tourist
12 0 3

Hello @dmwwebartisan 

My shop link is: mondecor.myshopify.com

I really appreciate your help! Thanks a lot!

0 Likes
Highlighted
Shopify Partner
2712 589 730

Hey @mondecor,

Please add the following code at the bottom of your assets/theme.scss.liquid file.

div#shopify-section-feature-columns h3{
display:none;
}

This to hide headings for now.

Button "iNCELE" button has a link. Do you want that link to the images?

Asking because for this will have to modify liquid maybe. I will check.

Let me know.

 

Thanks! 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Tourist
12 0 3

Hey @dmwwebartisan 

thanks for your help. I added the code and the headers disappeared. 

And yes, I would like to also add the button link to the image and hide the buttons as well. 

I would really appreciate if you could show me how to do so. Thanks again!

0 Likes
Highlighted
Shopify Partner
2712 589 730

Hey @mondecor,

Can you tell me which theme you're using?

So I will tell you accordingly.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Tourist
12 0 3

Hello @dmwwebartisan 

I’m using the Free Shopify Debut theme. 

Thanks again

1 Like
Highlighted
Shopify Partner
2712 589 730

Hey @mondecor,

Please replace the following code of sections/feature-columns.liquid

feature-columns.jpg

 

With this one

% if block.settings.button_label != blank and block.settings.button_link != blank %}
   <a href="{{ block.settings.button_link }}" class="btn btn--secondary btn--small" aria-label="{{ ariaLabel | escape }}">
                    <img id="{{ img_id }}"
                         class="feature-row__image lazyload"
                         src="{{ block.settings.image | img_url: '300x300' }}"
                         data-src="{{ img_url }}"
                         data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
                         data-aspectratio="{{ block.settings.image.aspect_ratio }}"
                         data-sizes="auto"
                         alt="{{ block.settings.image.alt | escape }}">
       </a>
   {% else %}
                  <img id="{{ img_id }}"
                       class="feature-row__image lazyload"
                       src="{{ block.settings.image | img_url: '300x300' }}"
                       data-src="{{ img_url }}"
                       data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
                       data-aspectratio="{{ block.settings.image.aspect_ratio }}"
                       data-sizes="auto"
                       alt="{{ block.settings.image.alt | escape }}">
    {% endif %}

 

This should work for the image link. 

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Tourist
12 0 3

Hello @dmwwebartisan 

This didn't work I think... It gave me an error. How can I fix it?

Thanks for your help.

Screen Shot 2020-08-03 at 21.31.29.png

0 Likes
Shopify Partner
2712 589 730

Hey @mondecor,

Sorry, that was my mistake. the first curly bracket is missing.

Here is the correct code.

{% if block.settings.button_label != blank and block.settings.button_link != blank %}
   <a href="{{ block.settings.button_link }}" class="btn btn--secondary btn--small" aria-label="{{ ariaLabel | escape }}">
                    <img id="{{ img_id }}"
                         class="feature-row__image lazyload"
                         src="{{ block.settings.image | img_url: '300x300' }}"
                         data-src="{{ img_url }}"
                         data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
                         data-aspectratio="{{ block.settings.image.aspect_ratio }}"
                         data-sizes="auto"
                         alt="{{ block.settings.image.alt | escape }}">
       </a>
   {% else %}
                  <img id="{{ img_id }}"
                       class="feature-row__image lazyload"
                       src="{{ block.settings.image | img_url: '300x300' }}"
                       data-src="{{ img_url }}"
                       data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
                       data-aspectratio="{{ block.settings.image.aspect_ratio }}"
                       data-sizes="auto"
                       alt="{{ block.settings.image.alt | escape }}">
    {% endif %}

 

Hope this will work.

 

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes