Jump to content

Customizing my Header for FLATIRON Template

Recommended Posts

I currently need help editing my header so it looks similar to the image posted below.

I am looking to move the title "waqas" in the middle and the page links "Work" and "About" on each side respectively. 

ATTACHED is a mock-up i'm looking to achieve

Edited by Waqas
Link to comment
1 hour ago, Waqas said:

I currently need help editing my header so it looks similar to the image posted below.

I am looking to move the title "waqas" in the middle and the page links "Work" and "About" on each side respectively. Here's the page in question. Thanks so much in advance.

ATTACHED is a mock-up i'm looking to achieve1791774957_ScreenShot2022-01-17at9_52_01PM.thumb.png.fdee20813b5bf8fd574c450d755388aa.png

Which template and version are you using?

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Keyword Highlighter
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
7 hours ago, Waqas said:

I am using FLATIRON Version 7.0 Thanks so much in advance 🙂

Try adding to Home > Design > Custom Css

#navigator .siteTitle {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

Let me know how it works on your site

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Keyword Highlighter
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
6 hours ago, bangank36 said:
#navigator .siteTitle {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

This moved my name in the middle but I would like to move my page link  'ABOUT' on the right side of the page. This is how the top looks like right now - see file attahed.

Thanks so much for your help so far!

Screen Shot 2022-01-20 at 1.31.37 AM.png

Link to comment
On 1/19/2022 at 6:35 PM, bangank36 said:

Try adding to Home > Design > Custom Css

#navigator .siteTitle {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

Let me know how it works on your site

Any other tips you would suggest? This moved my name in the middle but I would like to move my page link  'ABOUT' on the right side of the page. This is how the top looks like right now - see file attahed.

Thanks so much for your help so far!

Screen Shot 2022-01-20 at 1.31.37 AM.png

Link to comment
On 1/22/2022 at 6:01 AM, Waqas said:

Any other tips you would suggest? This moved my name in the middle but I would like to move my page link  'ABOUT' on the right side of the page. This is how the top looks like right now - see file attahed.

Thanks so much for your help so far!

Screen Shot 2022-01-20 at 1.31.37 AM.png

Try adding this code to Design > Custom CSS

@media screen and (min-width:641px) {
#navigator header#topBar ul#nav>li:nth-child(3) {
    position: absolute;
    right: 0;
}
#navigator .siteTitle {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
}

 

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.