Removing Logo on Homepage Mobile View Only with Impact Theme

AirbusThunder
Tourist
5 0 2

Hello everyone,

I'm customizing my Shopify theme using the Impact theme. I'm looking to make a specific change to the logo on my shop's homepage, but only when viewed on a mobile device.

Specifically, I want to remove the logo "MYREMOVEBEFOREFLIGHT" from the header on the homepage in mobile view only. On other pages and in desktop mode, the logo should remain visible as usual.

Could someone guide me on how to achieve this by providing the CSS or Liquid code needed? I've searched through my theme files, but I haven't been able to pinpoint the exact section for this requirement.

Shop : https://myremovebeforeflight.fr/

Any assistance or pointers would be greatly appreciated. Thank you in advance for your help!

Best regards,

Aymimage_2024-04-12_200835458.png

Replies 8 (8)

Made4uo-Ribe
Shopify Partner
5977 1439 1777

Hi @AirbusThunder 

Would you mind to share your store URL? Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
For FREE, premium codes, and trusted, knowledgeable Shopify developers, visit us at

Made4uo.com


AirbusThunder
Tourist
5 0 2
Made4uo-Ribe
Shopify Partner
5977 1439 1777

Ju8st like to clarify, you like to remove the whole logo including the image? or only the white words.

Like this. 

Made4uoRibe_0-1712950174869.png

Check this one.

From your Shopify admin dashboard, click on "Online Store" and then "Themes"

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "theme. Liquid" file. Find the </body> tag and paste the code below before the tag. 

 

{% if template == 'index' %}
<style>
@media only screen and (max-width: 749px){
h1.header__logo {
    display: none;
}
}
</style>
{% endif %}

 

And Save. 

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
For FREE, premium codes, and trusted, knowledgeable Shopify developers, visit us at

Made4uo.com


AirbusThunder
Tourist
5 0 2

Exactly, I would like remove only the white words.

Thank you so much for your help! I've just implemented the change on a test Impact theme, and it seems to be working perfectly. Really appreciate your assistance! 🙂

 

 

Shop1.pngShop2.png

AirbusThunder
Tourist
5 0 2

@Made4uo-Ribe Thanks again for your help! Everything seems to be working smoothly with the logo adjustment.

I've noticed another issue with the slideshow on desktop where the images are getting cropped. Is there a way to have the media size set to "Original Ratio" for desktop and "Small" for mobile? Currently, the ratio looks good on mobile, but on desktop, some of the slides are being cut off.

Appreciate any guidance you can provide on this matter! 🙂

 

Made4uo-Ribe
Shopify Partner
5977 1439 1777

Which slideshow you mean? 

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
For FREE, premium codes, and trusted, knowledgeable Shopify developers, visit us at

Made4uo.com


AirbusThunder
Tourist
5 0 2

The blue and retro picture are the slideshow, on the top of the page 

IMG_6537.jpeg

Made4uo-Ribe
Shopify Partner
5977 1439 1777

Your welcome, please dont forget to hit likes also. It will help me a lot. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
For FREE, premium codes, and trusted, knowledgeable Shopify developers, visit us at

Made4uo.com