Jump to content

How to adjust main site header so my logo appears to float above content?

Recommended Posts

Hello, I was previously starting to design my site in a different application until I discovered Squarespace.

However I was previously able to make my logo in my header appear on top (or in the foreground) of my main content and also allow it to stick in position.

Is it possible to do this in Squarespace?

Please do check the video of my old work: 

 

Also this is the link to the current page I am working on: https://bluebird-porcupine-yzdg.squarespace.com/home-v7

Password is: squarespace

NOTE: I would like my brand logo the same position in my video i.e. to the left with the page links, cart and login button to the right.

Many thanks in advance,

Best,

Faizal

Link to comment
  • Replies 2
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

Thanks very much Derrick,

So I found the code useful as it makes my header sticky:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    if(window.location.href.indexOf("search") > -1) {
       var editCSS = document.createElement('style');
        editCSS.innerHTML = ".sqs-search-page-input {margin-top: 50px;} .Header { background-color: white !important; }";
        document.body.appendChild(editCSS);
    }
});
</script>

 

But I didn't know if I should add the next code as the document you shared states that it will turn my header from transparent to white.

I want to keep the header transparent.

I also notice that since I've added this code in my Page Settings / Advance, I notice now that some earlier code is now permanent on my homepage top even when I sign out and check the live site.

Please advise.

Sorry - I'm not at all confident with code.

Best,

Faizal

code-in-header.png

Edited by scholarsayze
I forgot to add a screen shot.
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.