# Come scambiare semplicemente il logo dell'intestazione con CSS per rendere il tuo sito professionale!

**URL:** <https://meta.discourse.org/t/how-to-simply-swap-the-header-logo-with-css-to-make-your-site-look-work-related/110972>\
**Category:** Product Support\
**Created:** [7 Marzo 2019, 11:33am UTC](https://meta.discourse.org/t/how-to-simply-swap-the-header-logo-with-css-to-make-your-site-look-work-related/110972 "2019-03-07T11:33:25Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![WaitroseCarpark](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/waitrosecarpark/32/198599_2.png) [@WaitroseCarpark](https://meta.discourse.org/u/WaitroseCarpark)\
**Post date:** [7 Marzo 2019, 11:33am UTC](https://meta.discourse.org/t/how-to-simply-swap-the-header-logo-with-css-to-make-your-site-look-work-related/110972/1 "2019-03-07T11:33:25Z")

</div>

Can’t post to How-To category so thought I’d post here.

Lots of my users requested an alternative theme as the default made it obvious they were not on a work-related site. So I created a new theme they could choose so that if someone glanced at their screen it would look broadly work-related (‘Marketing Growth Hacking’).

I copied the default Light theme, uploaded the new banner and added this custom CSS:

```
/* Switches header */
.d-header #site-logo {
  display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url(https://your.logo.url/here.png) no-repeat;
  width: 461px; /* Width of new image */
  height: 45px; /* Height of new image */
  padding-left: 461px; /* Equal to width of new image */
}

```

Of course you should change the width/height/padding to match your new logo.

Hope this helps someone.

---

_[View the full topic](https://meta.discourse.org/t/how-to-simply-swap-the-header-logo-with-css-to-make-your-site-look-work-related/110972)._