Adding a line break in site title

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

Hi, looking to add a line break to my site title to make it read:

"the art of

Susan Boser"

The password for the site is hello. 

Thank you for your help!

14 minutes ago, oliviasusan said:

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

Hi, looking to add a line break to my site title to make it read:

"the art of

Susan Boser"

The password for the site is hello. 

Thank you for your help!

You can add an image as logo so the text can be modified as required

21 minutes ago, bangank36 said:

You can add an image as logo so the text can be modified as required

14 minutes ago, oliviasusan said:

Hi, thanks for your response. Is there really no way to do this more simply within Squarespace if I don't have or want a logo? 

 

Alright, you can use custom code injection

1. Change the title to Susan Boser

2. Add this to Design->Custom CSS

.header-title-text a {
  display: block;
}
.header-title-text a:before {
  content: 'the art of';
  display: block;
}

39 minutes ago, bangank36 said:

Alright, you can use custom code injection

1. Change the title to Susan Boser

2. Add this to Design->Custom CSS

.header-title-text a {
  display: block;
}
.header-title-text a:before {
  content: 'the art of';
  display: block;
}

This is great. Thank you so much!!

On 2/20/2021 at 7:32 PM, bangank36 said:

Alright, you can use custom code injection

1. Change the title to Susan Boser

2. Add this to Design->Custom CSS

.header-title-text a {
  display: block;
}
.header-title-text a:before {
  content: 'the art of';
  display: block;
}

Hi Bangank36,

Unfortunately this changes the website title to the second line, "Susan Boser" in this case... so the Site Title, Site Name, indexed name on Google and social sharing name all lose the first line... any ideas how to fix that? Thanks!

Can you share some screenshots of your issues?

I have a similar question - but looking for a thrid line break. Can anyone help me with the custom CSS required for that? I can't figure out how to use two different calls for :before...

Ideally my finished result would display on three lines as:

Canadian
Typography
Archive
 

Here's what I have (edited site title to read Archive, but am missing the third line solution).

.header-title-text a {
  display: block1;
}
.header-title-text a:before {
  content: 'Canadian Typography';
  display: block;
}
 

Note: I was able to get the look I wanted by adding <br> between the three lines in the editor, and it displayed correctly until I hit save - and then added the <br> in the text directly (no longer hidden). So weird that it displayed correctly before hitting save...

Temporary solution found : 

(with name of site title as Typography - the middle word...)

.header-title-text a {
  display: block;
}
.header-title-text a:before {
  content: 'Canadian';
  display: block;
}
.header-title-text a:after {
  content: 'Archive';
  display: block;
}

On 11/24/2022 at 6:01 AM, bobbeck said:

I have a similar question - but looking for a thrid line break. Can anyone help me with the custom CSS required for that? I can't figure out how to use two different calls for :before...

Ideally my finished result would display on three lines as:

Canadian
Typography
Archive
 

Here's what I have (edited site title to read Archive, but am missing the third line solution).

.header-title-text a {
  display: block1;
}
.header-title-text a:before {
  content: 'Canadian Typography';
  display: block;
}
 

Note: I was able to get the look I wanted by adding <br> between the three lines in the editor, and it displayed correctly until I hit save - and then added the <br> in the text directly (no longer hidden). So weird that it displayed correctly before hitting save...

You can add <br> tag then share site url, we can give script code to make br work

However, the br will appear on Google Search Result & some other pages