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

Adding text to navigation bar (tricky)


joequint

Question

Site URL: https://www.joequint.com/

I wanted to have titles for three different navigation sections of my site and the only way I could come up with to cheat it was to create folders - that don't drop down - with the words (ASSIGNMENTS, PROJECT, MOTION). Further, I wouldn't want the pages to be nested in folders anyway.

This is having detrimental impact in search... they end up being seen as 'pages' without text. And, if you were to type 'https://www.joequint.com/motion', you get a message saying 'This folder does not contain any pages'.

Is there a better solution other than using these folders as headings?

Link to comment

10 answers to this question

Recommended Posts

  • 0
8 minutes ago, joequint said:

Site URL: https://www.joequint.com/

I wanted to have titles for three different navigation sections of my site and the only way I could come up with to cheat it was to create folders - that don't drop down - with the words (ASSIGNMENTS, PROJECT, MOTION). Further, I wouldn't want the pages to be nested in folders anyway.

This is having detrimental impact in search... they end up being seen as 'pages' without text. And, if you were to type 'https://www.joequint.com/motion', you get a message saying 'This folder does not contain any pages'.

Is there a better solution other than using these folders as headings?

Get rid of the folder and take advantage of psuedo :before selector I can achieve this

#mainNavigation li:nth-child(1):before {
  content: 'ASSIGNMENTS';
  font-weight: bolder;
  margin-bottom: .1em;
  margin-top: 1em;
  color: #999;
}
#mainNavigation li:nth-child(6) {
  margin-top: 1em;
}
#mainNavigation li:nth-child(6):before {
  content: 'PROJECTS';
  font-weight: bolder;
  margin-bottom: .1em;
  color: #999;
}
#mainNavigation li:nth-child(10) {
  margin-top: 1em;
}
#mainNavigation li:nth-child(10):before {
  content: 'PROJECTS';
  font-weight: bolder;
  margin-bottom: .1em;
  color: #999;
}

image.png.3e59cbc230e348a52668fa4590c0c10a.png

Greeting, it's BaNgan from 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, Youtube Gallery for Squarespace
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
  • 0

Wow, @bangank36, that's pretty perfect... thanks so much.

One issue I was having had to do with SEO. I did an audit and those "pages" (I guess Google saw the folders as pages) were negatively impacting. Do you think, now that it's just text, I would be better off?

Link to comment
  • 0
Just now, joequint said:

Wow, @bangank36, that's pretty perfect... thanks so much.

One issue I was having had to do with SEO. I did an audit and those "pages" (I guess Google saw the folders as pages) were negatively impacting. Do you think, now that it's just text, I would be better off?

I dont answer for your question

Greeting, it's BaNgan from 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, Youtube Gallery for Squarespace
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
  • 0
16 minutes ago, joequint said:

@bangank36I know I'm being super-fussy but do you know how I would adjust the space under the word PROJECTS?

thanks!

Try the margin-bottom

Greeting, it's BaNgan from 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, Youtube Gallery for Squarespace
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
  • 0
Just now, joequint said:

hmm... no change.

Ok i will check tomorrow

Greeting, it's BaNgan from 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, Youtube Gallery for Squarespace
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
  • 0
8 hours ago, joequint said:

much appreciated.

Add this 

#mainNavigation li:nth-child(1) a,
#mainNavigation li:nth-child(6) a,
#mainNavigation li:nth-child(10) a {
margin-top: 1em;
}

 

Greeting, it's BaNgan from 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, Youtube Gallery for Squarespace
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

Create an account or sign in to comment

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

×
×
  • Create New...