How to customize site title only for mobile/tablet screens

Sydney
#1

Hi,

I would like to set a different color for the site title on mobile/tablet screens than that of PC screen.
For example, the tile is now in white both for PC screens and mobile/tablet screens, and I want to have the title in mobile/tablet screens in blue while maintaining the title in white for PC screens.

Can you provide me with the code with which I can set a color of the site title only for mobile/table screens?

Thank you in advance!
Regards,

#2

Hi,

Can you share your site URL here and can you tell me more specifically which title you want to modify?

Regards,

#3

Hi,

Here is my site. PLEASE delete the space after the period(.) before “com”.

http://suzuki-akiko. com

On the PC screen, the site title (top left of the screen) is now in blue and not so visible.
On the mobile/tablet screen, the title in blue is fine as the background is pale blue.

I would like to have the title on the PC screen in pale color as menu items next to it while keeping the title on mobile/tablet screen as it is (in blue).

I hope it clarifies.
Regards,

#4

Hello there,

Thank you for sharing the link to your website. Please try adding the below CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (min-width: 1025px) {
      .site-title a {
        color: #fff;
      }
      .site-title a:hover {
        color: #31c648;
      }
    }

Regards,
Kharis
aThemes Support

#5

Hello,

It worked perfectly!
Thank you.

Regards,

1 Like
#6

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis
aThemes Support