Jump to content

Header nav items not displaying correctly.

Go to solution Solved by tuanphan,

Recommended Posts

Site URL: https://cat-fish-xrta.squarespace.com/

Hello guys, since I have embedded Commerce7 to Squarespace, I copied and pasted the installation code as Commerce7 guide below, but it seems the Login and Cart are not displaying correctly as I expect them to show on the right side aligned. I would appreciate any help about css code to correct this issue. Thank you!

<!-- Adds the Commerce7 styles -->
<link href="https://cdn.commerce7.com/v2/commerce7.css" rel="stylesheet">

<!-- Adds Commcerce7 widgets for the cart and customer account login -->
<script type="text/javascript">
    document.addEventListener('DOMContentLoaded', function(event) {
    var node = document.createElement('div')
    var accountNode = document.createElement('div')
    accountNode.id = 'c7-account'
    var cartNode = document.createElement('div')
    cartNode.id = 'c7-cart'
    var header = document.getElementsByTagName('header')[0]

<!-- Tells Commerce7 which account to connect to -->
<script type="text/javascript" 


Link to comment
  • Solution
11 minutes ago, CharlieJIN said:

Hi I have set my site with passcode: cape



Try adding to Design > Custom CSS

@media screen and (min-width:992px) {
div#c7-account, div#c7-cart {
    position: absolute;
    right: 0;
    top: 50px;
    right: 50px;
div#c7-cart {
    right: 10px;
    top: 30px;


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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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.