Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Header image on mobile


benja

Question

Site URL: https://tuba-octopus-s32b.squarespace.com/

Hello friendly helpers!

I'm working on this website and managed to add a background image to the navigation.

Is it possible to add this on the mobile version behind the logo, like a header?
I already have a plan B, the image is now in the navigation, but I would love to add it as a header.
It should look like the attached example.

I'm using a brine template: https://tuba-octopus-s32b.squarespace.com/
The password is: umoweb

It would be nice, if anyone could help me.

example.jpg

Link to comment

7 answers to this question

Recommended Posts

  • 0

Use this code

header.Header, .Mobile-bar.Mobile-bar--top {
    background-image: url('https://static1.squarespace.com/static/60618935c17ee2510420a2b2/t/6065add59bd4fa05043b458e/1617276373903/Gluecklicht_Navigation.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
4 hours ago, benja said:

Thank you so much @tuanphan, that's perfect!

Do you want to fix these?

1. (Tablet-Homepage) Blue bar on right of screen

tuba-octopus-s32b.squarespace.com-01.png

2. (Mobile-Homepage) White bar at bottom of homepage

tuba-octopus-s32b.squarespace.com-02.png

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
On 5/4/2021 at 8:23 PM, benja said:

@tuanphan yes that would be great, do you have a solution

Add to Design > Custom CSS

html, body {
    overflow-x: hidden;
}
@media screen and (max-width:991px) {
.Mobile-bar.Mobile-bar--bottom {
    display: none;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
On 5/12/2021 at 4:04 PM, benja said:

@tuanphan thank you so much for your help!

You're welcome. If you have any other problems, just reply here or ask new question.

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...