Logo size fix mobile

Hello my website is Tunetoyz.com and I want to make my logo slightly bigger on mobile only. How can I do this.

Thank you

Hi @TuneToyz ,

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above tag:


Here is result:

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you :heart_eyes:

To make your logo slightly bigger on mobile only, you can add custom CSS to your Shopify theme. Here’s how:

  1. Go to your Shopify Admin and click on Online Store > Themes.

  2. Find your current theme and click on Actions > Edit code.

  3. In the left sidebar, locate and click on Assets, then find the file named theme.scss.liquid or similar (it may vary by theme).

  4. Add the following CSS code at the bottom of the file:

    css

    Copy code

    @media only screen and (max-width: 768px) { .site-header__logo img { width: 120%; /* Adjust percentage as needed / height: auto; / Maintain aspect ratio */ } }

  5. Save your changes.

This code targets mobile devices and increases the logo size. Adjust the percentage to achieve your desired size. Let me know if you need further help!