Pique Theme Logo Size

• 

  jaclynmuns · Member · Jul 17, 2016 at 1:51 am

  • Copy link
  • Add topic to favorites

  Hello, I’m working on changing over the theme for a client. I love Pique, only under Customizing > Site Identity when I upload the logo, it’s very small. I have adjusted the size of the logo I upload but it doesn’t help. Any way to make it larger? Is there CSS to fix this? Thanks!

  The blog I need help with is: (visible only to logged in users)

• 

  hallluke · Member · Jul 17, 2016 at 9:11 am

  • Copy link

  The theme only loads the logo image in at a reduced size so if you want to make it much bigger you’re better off hiding the original and then loading the image again at full size and scaling it to the size you want.

  Here’s some code to try out, you will have to set the image URL and size and you might want to change the screen size it targets (1024px in my example) depending on what size image you choose and how long your site title and description are.

  @media screen and (min-width:1025px) {
    .site-branding .site-logo-link img {
      display: none;
    }
    .site-branding .site-logo-link {
      display: block;
      width: 200px;
      height: 200px;
      background-image: url("https://placehold.it/200x200");
      background-size: contain;
    }
  }