Build Your Own Business Website header image

How to Make a 2 Line Site Title in Thesis 2

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects - ,

Applies to -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

In this session we show how to make a 2 line site title in Thesis by placing a line break tag and discuss the site title options to choose the kind of configuration we want and what we want in each column. We also demonstrate how to create a text box and customize the site title in custom site title options to make it a link.

Video Transcript

Member: You know I started to work on it I wanted to change it so it’s essentially 2 lines for the title; become centered up to each other or so it’s a thought here or thought there.

Rick: Yeah, now the thing is either the site title or the site tag line allow you to place html in the middle of them here; right.

Member: Ah.

Rick: If you’re doing it typically you might be able to put a line break tag there or you might be able to; yeah, you could put a line break tag or something like that in. So, to the extent that you want to do that I think you should use a text box instead. So for example, if I come over to my skin editor. I’ll just go to my front page and do that there. Now this is a little tough in your…

Member: You just did my other question.

Rick: Okay.

Member: Why when I click a plus it doesn’t open or go anywhere? It doesn’t show anything else.

Rick: Well, there’s nothing in it at the moment. So it’s the box options over here that shows you the options.

Member: Right.

Rick: So you have the content and the options and the options here give you choices of what configuration you want and what you want in each column.

Member: Right.

Rick: Now, one of your choices here right now I have it set up as Header image and Site title and tagline. But if you want to split this up what you would do is empty container. And now, with the empty container you can create a text box and drag it into the header; and let’s see before I get too far down the road on that let’s go look at that for a second. Inspect the element here so this one is <h1 id=”site_title”>, okay. So, I do the text box and I’m going to call this my Custom Site Title and I’m not going to wrap it in any wrapper; and while I’m at it I’m going to grab the standard tagline which is already part of the skin although it’s not used. And I’m going to drag it into the Typical Header also and drag it down below. Save my template and then come back over to Thesis Skin Content and now I have my…Am I on the right spot? thesis2demo, thesis2demo maybe I didn’t save the template. Okay, now I’ve saved the template. Okay, now I have my Custom Site Title and now what I would do is first disable automatic <p> tags. And then,
           <h1 id=”site_title”>

And then, “The Barking Chihuahua”

            <h1 id=”site_title”>The Barking Chihuahua

And then I’m going to do a line break,

Member: I love that name by the way.

Rick: Thank you. Then I do a line break,

           <h1 id=”site_title”>The Barking Chihuahua<br  />

And then say “Cafe”

           <h1 id=”site_title”>The Barking Chihuahua<br  />Cafe

And close out my </h1> tag,

           <h1 id=”site_title”>The Barking Chihuahua<br  />Cafe</h1>

And now I should have a two line Site Title here essentially you know using html.

Member: Right.

Rick: I use this id so that the style for the site_title would apply to it and otherwise I’d just recreate it. And it could be anything I wanted to be. It doesn’t have to be…

Member: Right.

Rick: But now you can see “The Barking Chihuahua Cafe”. Now, also note that I didn’t make this a link and it probably should be a link. So, I should say <a href=”http://www.thesis2demo.com”>,

           <h1 id=”site_title”><a href=”http://www.thesis2demo.com”>The Barking Chihuahua<br  />Cafe</h1>

And I also wanted to add a title to it title=”Return to Home Page”,

           <h1 id=”site_title”>
<a href=”http://www.thesis2demo.com” title=”Return to Home Page”>
The Barking Chihuahua<br  />
Cafe
</h1>

And then close out my </a>,

                     <h1 id=”site_title”>
<a href=”http://www.thesis2demo.com” title=”Return to Home Page”>
The Barking Chihuahua<br  />
Cafe
</a>
</h1>

And so now this is a link like it was before.

Member: Cool.

Rick: So, that’s how you do it.

Member: And it’s self centered?

Rick: Well, in Agility it is centered by definition unless you change it. In Agility in the Header if you choose site title and tagline then this column is centered.

Member: Okay, cool.

Rick: Actually, it doesn’t really matter if you choose it or not. If you choose the empty container then this is centered. Now, you can override that behaviour but that’s its typical behaviour.

Member: Okay, well that’s caught me started down the right direction I’m sure.

Rick: Excellent. Okay, well you have a great day then.

Member: You too.

Rick: Uhuh, bye, bye.

0 Comments… add one

Save $200 on Membership Now!

Start learning today for as little as
$0.82 PER DAY!
THIS IS A LIMITED TIME OFFER!
Subscription Options
0 comments… add one

Leave a Comment