Offcanvas Logo

Resolved polsogood
(@polsogood)

3 years, 3 months ago

Hi everyone!

I was wondering if there was a way to set a different logo – than the one on the main header – on the offcanvas menu which automatically shows the main header one and only gives the one option to show it or hide it.

Another way would be to set any additional element on top of the menu links. Would anyone happen to know how to do that?

I would really appreciate your help. Thank you!

The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

Kharis Sulistiyono
(@kharisblank)

3 years, 3 months ago
Hi @polsogood,

Currently the theme doesn’t have an option for that. But you may be able to achieve it with custom CSS that you can add to Customize > Additional CSS, for example:
```
.botiga-offcanvas-menu .mobile-header-item .row .col:nth-of-type(1) {
    flex-grow: 12;
    -webkit-box-flex: 12;
    height: 80px;
    background-image: url('https://lamardemol.com/wp-content/uploads/2023/01/la-mar-de-mol-oscuro-sinfondo.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
```
Thread Starter polsogood
(@polsogood)

3 years, 3 months ago

It is amazing! That worked.

Would you happen to know what should I put instead of .mobile-header-item for it to show on computers as well?

Thank you so much for your help!

Thread Starter polsogood
(@polsogood)

3 years, 3 months ago

Anyone?
maaprote
(@maaprote)

3 years, 3 months ago
Hi @polsogood,

We sorry for the delay here!

To have it on the desktop offcanvas too, please try adding this custom CSS code below:
```
#masthead .botiga-desktop-offcanvas > .row > .col-12:nth-child(1):before {
    content: '';
    flex-grow: 12;
    -webkit-box-flex: 12;
    height: 80px;
    background-image: url(https://lamardemol.com/wp-content/uploads/2023/01/la-mar-de-mol-oscuro-sinfondo.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    display: block;
    max-width: 170px;
    margin: 0 auto;
}
```
We hope this helps!

Kind Regards,

Rodrigo.
Thread Starter polsogood
(@polsogood)

3 years, 2 months ago

Hi @maaprote

Thank you, it worked!

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Offcanvas Logo’ is closed to new replies.

Tags