How can I add a URL to a footer image on my Sense theme?

Store Design
1

Hi Community,

I am trying to add a URL to an ´image´ banner on the footer section of my site but there is no such option to add it.

I’m thinking it could be done in the code editor.

Can anyone help?. I’m using Sense free theme.

Thanks in advance

imagen_2022-06-24_203241529.png
imagen_2022-06-24_203241529.png327×317 8.02 KB

2

Hi @eristorecl ,

Please follow the instructions below. I hope you are a little comfortable with coding.

  1. Go to Admin > Online store > Themes > Actions > Edit code
  2. Go to Section folder, and open the footer.liquid file
  3. Replace the code in between the {%- when ‘image’ -%} and the {%- endcase -%} with the code below.
{% if block.settings.image_link %}{% endif %}
                  

                    {%- if block.settings.image != blank -%}
                      {%- assign image_size_2x = block.settings.image_width | times: 2 | at_most: 5760 -%}
                      
                    {%- else -%}
                      {{ 'image' | placeholder_svg_tag: 'placeholder-svg placeholder' }}
                    {%- endif -%}
                  

                   {% if block.settings.image_link %}{% endif %}

Please refer to the image below for code placement.

made4Uo_1-1656119336079.png
made4Uo_1-1656119336079.png2420×1562 537 KB

  1. Next, go down to find the image_picker under the {% schema %}, and paste the code after the }. Then click SAVE
,{
          "type": "url",
          "id": "image_link",
          "label": "Image link"
        },

Please refer to the image for code placement.

made4Uo_0-1656119226434.png
made4Uo_0-1656119226434.png2376×1539 239 KB

7 Likes
3

Made4uo,

Just wow! this worked perfectly.

I am very thankful for the quick and accurate solution you provided.

Ty!!

1 Like
4

This solution is very excellent. This should be the default code!

Free Tip: If the steps provided didn’t work for you, it’s likely because you have one more step. After completing the steps in the answer, you need to go into the website editor, choose the image in your footer, and enter the link you want to use with the image.

1 Like
5

Salutare. Poti sa-mi spui te rog cum ai rezolvat sa adaugi link-ul? si eu ma confrunt cu aceeasi problema si nu reusesc

6

This solution isn’t working for me, I’m getting the following error message when I try the save the code changes. I’m using theme Publisher. Thanks

Unable to update the file

  • Invalid JSON in tag ‘schema’
7

I am getting this error message also! Any luck?

8

Hi @blonde_creative

Make sure you dont have two commas before the code, and copy the image code below

made4Uo_0-1686176565355.png
made4Uo_0-1686176565355.png400×259 24.9 KB

9

Thanks for responding - still no luck! I’m a fool.

10

Wait, I removed the comma. Perfect - thank you!!!

11

Me again, It works perfectly for desktop but mobile view the link doesn’t work - any help as to why? Do I need additional css

12

Hi

Do you mind sharing your website so we can take a look?

13

Checkout this youtube video for easier instructions: