Different logo in mobile view

General HivePress
1

How to have different logo in desktop and mobile view in this HivePress theme?

3

Hi,

Unfortunately, there’s no such feature, it would require a custom implementation. If customizations are required for your site, please try customizing it using the collection of code snippets Search · user:hivepress · GitHub and other developer resources, or consider hiring someone for custom work Experts | HivePress

4

Hi! Add this CSS from the front end admin top bar->customize “Additional CSS” field:

@media only screen and (max-width: 47.99em)
{.header-logo {
	content: url(https://hivepress.io/wp-content/uploads/2021/01/logo.svg);
	width: 200px;
	height: auto;
	}}

Replace the url to your desired mobile view logo url. If that logo is in your WordPress media library, go to that image, and copy/paste the image url. Finally, set the width: sizeyouwantinpixels;

5

wow! this really works… but how to make it clickable to go to homepage?

6

I see 2 way :

  • Custom the HTML to include your link a href
  • or use JS.
7

Just use “.custom-logo” class, instead of “.header-logo” in the css.

8

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.