Solved

html code in footer.liquid not showing on mobile, only on desktop

Startup87
Tourist
17 0 1

Hi,

 

I have added the following code in the footer.liquid (Palo Alto Theme) and its showing perfectly fine (including link) on desktop, but not showing at all on mobile.

 

website: https://nonu.shop/

 

This is only about this peace of code:  <a href="https://verbraucherschutz.de/hautfreundlicher-schmuck-von-nonu-shop-berlin/"><img src="http://verbraucherschutz.de/verbraucherschutz_de_service_versprechen.png" alt="Verbraucherschutz.de Serviceversprechen nonu.Berlin" width="100" height="120"></img></a>

 

 <div class="Footer__Content Rte" style="display: flex">
                   	<img src="https://cdn.shopify.com/s/files/1/0608/0888/8535/files/DHL_GG_KNV_rgb_BG.png?v=1649320860" alt="Eden Reforestation" style="margin-left: 0px; margin-right: 50px; width: 150px">
                       <a href="https://verbraucherschutz.de/hautfreundlicher-schmuck-von-nonu-shop-berlin/"><img src="http://verbraucherschutz.de/verbraucherschutz_de_service_versprechen.png" alt="Verbraucherschutz.de Serviceversprechen nonu.Berlin" width="100" height="120"></img></a>
                        <img src="https://cdn.shopify.com/s/files/1/0608/0888/8535/files/Eden-Stacked-Green.png?v=1649320848" alt="DHL Go Green Logo" style="margin-left: 50px; margin-right: 20px; height: 70px; width: 150px">
                        </div>

 

 

 

Accepted Solution (1)

AnneLuo
Shopify Partner
211 44 50

This is an accepted solution.

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme. css file and add the following code at the end of the file:

 

 

@media screen and (max-width: 749px) {
  .Footer__Content a img {
     max-width: unset !important;
   }
}

 

 

The image will be displayed normally on the mobile end.

 

AnneLuo_0-1709640277845.png

 

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to contact me on luomingxia@shinetechsoftware.com.

View solution in original post

Reply 1 (1)

AnneLuo
Shopify Partner
211 44 50

This is an accepted solution.

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme. css file and add the following code at the end of the file:

 

 

@media screen and (max-width: 749px) {
  .Footer__Content a img {
     max-width: unset !important;
   }
}

 

 

The image will be displayed normally on the mobile end.

 

AnneLuo_0-1709640277845.png

 

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to contact me on luomingxia@shinetechsoftware.com.