Text Logo subtitle/slogan

[Alpha1]

I would like to have a byline / subtitle below my logo to denote what the site is all about.

I have added a few words with smaller font size to the text logo, but that displays to the right of it and is not quite what I need. </br> doesnt work as a new line will not be displayed. Adding text to the logo block template doesnt seem to work either.
Do you have any suggestions for this?

 

[Russ]

Add your slogan in a span tag:

XenBase<span>Slogan can go here</span>

Then add to your extra.less:

.p-header-logo--textlogo span {
    display: block;
    font-size: 16px;
    color: #CCC;
}

 

[Alpha1]

A span already exists within the logo text. (you added this to lower the second part of the site name)

 

[Russ]

Sorry Alfa, helps to pay attention to 1.x or 2.x
This would be a pure css version of it:

.XenBase #logo {
    height: auto;
    line-height: 1;
    padding: 10px 0;
}
#logo a:after {
    content: "Slogan goes here";
    display: block;
    font-size: 14px;
    margin-top: 5px;
    color: #CCC;
}

 

[Alpha1]

I really like the result!!

I needed to make a few changes :

.XenBase #logo {
    height: auto;
    line-height: 1;
    padding: 10px 0;
}
#logo a:after {
    content: "Slogan Here";
    display: block;
    font-size: 12px;
    margin-top: 10px;
    margin-left: 9px;
}

 

[Alpha1]

Add your slogan in a span tag:

XenBase<span>Slogan can go here</span>

Then add to your extra.less:

.p-header-logo--textlogo span {
    display: block;
    font-size: 16px;
    color: #CCC;
}

I used this for my XF2.1 dev site and it worked great. However after the latest upgrade of Nova the slogan is no longer under the logo, nor in small 16px font size. What has changed?

 

[Russ]

Change the class to:

.p-header-logo--image span

We reverted back to stock XF code in various areas to reduce the number of edits done.

 

[Alpha1]

Thanks!