Add an additional line to tagline in the site header

upsilonmuzeta · Member · Jul 31, 2017 at 4:36 pm
Copy link

Add topic to favorites
I need to add an additional line to to the tagline in the site header. Please advise?

The blog I need help with is: (visible only to logged in users)
blazevivan · Member · Jul 31, 2017 at 5:22 pm
Copy link
Hi inezshaw50,

Could you please clarify if you want to add additional text in the site title “Upsilon Mu Zeta Chapter”, or it is the site description below it?

If this is a case, the solution will be to customize your website by adding custom CSS that adjusts the width of the title. It will move to the next line, but then that forces to line all by itself.

For CSS customization you need to have Premium or Business plan.

Let me know.
upsilonmuzeta · Member · Jul 31, 2017 at 6:59 pm
Copy link
The site description is what I need.
blazevivan · Member · Jul 31, 2017 at 8:09 pm
Copy link
Please try to add following code in the custom CSS field:
```
.wf-active .site-description {
    max-width: 750px;
    margin: auto;
}
```
Then try adding the line you wanted and see if that works for you.
upsilonmuzeta · Member · Jul 31, 2017 at 11:29 pm
Copy link
Sorry, it did not add an additional line for a separate message. Also, would like to change the second line’s font to French Script MS.
thesacredpath · Member · Aug 1, 2017 at 1:21 am
Copy link
@inezshaw50, do you need to add text in addition to the content you now have for the site description/tagline?
upsilonmuzeta · Member · Aug 1, 2017 at 2:13 am
Copy link
I have added the line and that worked fine, but now I need add a blank line between the the two lines and change the font for the additional line. Please advise.

Thanks,
thesacredpath · Member · Aug 1, 2017 at 4:14 am
Copy link
I’m seeing a single string of text entered into your tagline field at Customize > Site Identity, but see you have added a bunch of spaces. The way you have done this, we can increase the spacing between the lines, but we cannot style part of that single string of text separately from the rest. This would be the CSS to increase the spacing between the lines.
```
.site-description {
  line-height: 2.1;
}
```
If you wish to style the second line differently than the first, then what I would suggest would be to add the second line of text from within the CSS using the :after pseudo selector. Go to Customize > Site Identity and remove the second line of text and the preceding spaces and then add the following custom CSS and you can edit the color and font size as desired.
```
.site-description:after {
  content: ' "Building on the Principles of Zeta While Blazing New Paths" ';
  display: block;
  width: 100%;
  transform: rotate(0);
  position: initial;
  border: none;
  font-size: 90%;
  margin-top: 10px;
  color: #cc0000;
}
```
upsilonmuzeta · Member · Aug 1, 2017 at 7:25 am
Copy link
That worked great.

Thanks,
thesacredpath · Member · Aug 1, 2017 at 8:52 am
Copy link
You are welcome.

No items found.