Jump to content

Adding text to header

Recommended Posts

  • 5 months later...
5 hours ago, ryan.eaton said:

Can we link parts of the text? like "Click Here to go here or click here to here"

 

this require JavaScript code (need a Business Plan or higher). If you share link to your site, we can test code easier

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
Guest MNDrums

Hi,

I'm also trying to add some text to the right of my Site Title, and I want it to be slightly smaller than the title text. The link to the site is below:

 

chicken-rhombus-tnea.squarespace.com 

Link to comment
On 1/20/2022 at 6:04 AM, MNDrums said:

Hi,

I'm also trying to add some text to the right of my Site Title, and I want it to be slightly smaller than the title text. The link to the site is below:

 

chicken-rhombus-tnea.squarespace.com 

Add to Design > Custom CSS

a#site-title:after {
    content: "Enter tag line";
    font-size: 16px;
    margin-left: 10px;
}
@media screen and (max-width:767px) {
a#site-title:after {
    display:block;
}
}

 

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
  • 3 months later...
On 12/8/2020 at 1:35 PM, nomadweek said:

Hello, 

I use this code - it works! How can I italicize only a part of my text (in my case like this: the delicious take away box) and show it in h3? and how can I make a line break after delicious? It would be great to get the code for this. 

Thanks a lot! 

Hello,

Im wondering if anyone had a solution to @nomadweek issue. Im looking for the same myself.

Link to comment
19 hours ago, ronanmor said:

Hello,

Im wondering if anyone had a solution to @nomadweek issue. Im looking for the same myself.

Hi. This will require Script code (need a Business Plan or higher). If you share link to your site, we can test some code

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
On 5/11/2022 at 9:50 AM, ronanmor said:

Is there any alternative means of getting a type based logo into the header above the main navigation?

If you want what nomadweek posted, mixed font styles in your type based logo, no.

Think of it like this. CSS is like paint. You can paint a car to change the color. Now say you a have Kia Rio but you want a Sorento Plug-In Hybrid. A coat of paint ( CSS ) isn't going to make the Rio into a Sorento. You'd need a mechanic to make that happen. JavaScript is the mechanic in this metaphor and JS requires the business plan or above.

Edited by creedon

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • 4 weeks later...
33 minutes ago, AndreaASC said:

How can I fix this?

Who's code are you referring to?

Please post the URL for a page on your site where we can see your issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site. Please read the documentation at the link provided to understand how it works.

Please read the documentation at the link provided on how to share a link to your site to understand how it works. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

We can then take a look at your issue.

Edited by creedon

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
6 hours ago, AndreaASC said:

I added the "now accepting new clients" underneath the navigation menu and it works on desktop but not tablet or mobile.

The code is different for mobile.

You could try something like the following for a start.

.header-menu-nav-folder-content:after {

  content : 'NOW ACCEPTING NEW CLIENTS';
  margin-top : 1em;
  
  }

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
10 hours ago, AndreaASC said:

Is there a way to have it show up underneath the hamburger menu. So It's there even without opening the menu? 

The structure of that area seems problematic to squeeze in text with CSS. It might be possible CSS/JavaScript.

The other option that comes to mind would be to put the text in a page section, then with CSS hide/show that section for mobile. I don't have any code off the top of my head for that.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • 4 months later...
On 12/2/2020 at 7:12 PM, tuanphan said:

Add to Home > Design > Custom CSS

.header-nav:before {
    content: "enter your text";
    display: block;
    position: relative;
    top: -50px;
}

 

Thank you so much. Went looking for a quick fix to a question I had, got a quick answer. Thanks so much.

Link to comment
  • 3 months later...
21 hours ago, Muncamoo2000 said:

@tuanphan I need to have the text in the header but I have 2 different colors. Dark blue color behind the logo, grey behind the navbar. I get either a blue bar or grey bar across my logo which blocks the logo. How do I fix this? 
Expectation 

image.thumb.png.dadefbf5d08774f5eb23b9a737e89eb9.png

 

situation:

image.png.229ae21bf09b86f7bafc8bb3a7669d61.png

 

Code:

image.png.0560b2a6662943e0b96a104459095e93.png

Thanks!

What is site url?

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
  • 10 months later...
  • 2 months later...
On 2/20/2024 at 9:32 AM, katepayne said:

Hi there! I modified one of these codes and it's working great, except I'd love to change the color to match my site palette. How do I enter a custom color?

https://www.katepayne.net/

Thanks!

You mean text under logo? Use this CSS code

.header-nav:before {
    color: #253551 !important;
}

 

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
  • 2 months later...

Hello, I am currently running into the same problem on my website. I am trying to input text along the same side and corner as the examples above. I have copied and pasted the existing code people used above and mine is not displaying. Any help?

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.