Jump to content

Adding a custom design below a header

Recommended Posts

Site URL: http://www.scienceseeds.com

We are migrating our existing website (www.scienceseeds.com) from Wordpress to Squarespace and would like to include the seed trail in the attached below the header on Squarespace. I have added the green border on the bottom of the header but not sure how to add the seed trail.

The seed trail is in a file seedpattern.png (not included).  

582541344_ScreenShot2020-03-30at8_49_41PM.thumb.png.3a5587c7daae02a20042ba0f792256a6.png

Link to comment
  • Replies 8
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

You can do this with CSS

Can you share link to your Squarespace site?

If your site is trial, you can setup password & share url.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
15 hours ago, MM1 said:

The website link:https://lynx-guppy-pnfz.squarespace.com

Password: tester123

Thanks!

Add to Home > Design > Custom CSS. Replace below image url with your image url

header.Header.Header--top:after {
    content: "";
    background-image: url(https://beaverhero.com/wp-content/uploads/2020/02/facebook-chatbox-min.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 50px;
    display: block;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
3 minutes ago, MM1 said:

Thank you! I got it to work - is it possible to add some padding above the image to make more space between the image and the logo's tagline?

use margin-top: 50px;

or

margin-bottom: 50px;

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

If I add padding to the bottom or to the top then the the product list filter for the store either disappears or is too close to the image - does that mean then that we need to add padding to every element them down? 

Link to comment

Add to Home > Design > Custom CSS to increase spacing between filter - image

main.Main.Main--products-list {
    margin-top: 50px;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.