Now we’re going to talk about how content is displayed in Thesis 2. This is the Lesson 12 site. And in fact, we’re going to switch out of Agility for a moment and switch into the Thesis Classic theme for the first part of this conversation.
We’ll come over to Thesis and the Select Skins. Then we’re going to come down and use the Thesis Classic in development mode for the moment. So preview in development mode and then come over to the Skin Editor.
The Post Box Configures the Display of Main Content
Thesis has one primary tool for configuring the display of your main content. Now by main content I mean the content that you create when you open up the post or page editor and start typing your information in there. There’s other kinds of content on your web page too like your sidebars and your footer widgets and that kind of stuff.
So your main content is configured in Thesis using the Thesis 2 post box. I’m going to start off with this by creating a brand new post box. Right down here under add boxes, post box and we’re just going to call it demo. Add the box and then I’m going drag it up here so I can more easily look at it.
The Post Box and WP Loop
This post box always has to sit inside of the wp loop. The post box can’t ever be located outside of wp loop. Now elements that are generally inside the post box can be but the post box itself has to go inside of wp loop or it doesn’t have the information it needs.
Post Box Areas
The post box has a couple of different types of areas. You have the active area and you have the tray. You noticed I clicked show tray to show the rest of the stuff and hide tray to hide it. And this is the active area and below this divider is the tray.
Inside the active area are the parts of the post box that will actually display in the template that’s using it. So in this case, you’ve got headline, author, edit and content as the parts of the active area of the post box. These are the parts that are going to show up.
All of these other parts down here are not going to show up. They’re available to us and we can drag them up or move them into the active area. But as long as they’re in the tray, they’re not active. They’re not going to show up.
And these little green boxes are called dependent boxes. That is, they are the dependents of the post box itself.
Now you can move these dependent boxes from the tray into the active area simply by clicking on them. So if you click on it, now you can see the date was added to the active area and is removed from the tray.
We can do the same thing with categories. Click on that and now, categories has been added to the active area and removed from the tray.
Removing from the Tray
You can also take things out of the tray but you don’t do it by clicking. In this case, if you want to say drag the edit link out, this is not a shift drag action. This is just a straight drag and you drag it. Once you start dragging it, you notice down here, this thing that says drop green boxes here to hide them in the tray. You just have to hover over that thing and let go and it’s gets dropped there.
So same thing for this, let’s just take categories and do it again. As soon as you start to drag this, that drop green boxes here, hide them in the tray shows up.
Now if you come over here like this, it’s not going to work. If you hold it over here, it’s not going to work. If you’re down here, it’s not going to work. You actually have to hold it directly over that thing and when it lights up bright yellow, that’s when you know you can drop it.
Moving in the Tray
You can also move these things around and this also is not a shift drag operation. You’re inside of the tray so you can just drag things around inside the tray. And if you just drag, it’s not going to ever leave the tray either. You can reposition them but it won’t leave. It’s not going to leave the tray until you shift drag. And at which point, you could drag it out and drop it someplace else. So that’s how the tray works.
Roles of the Dependent Boxes
Now of these dependent boxes, each does a specific task, right? Each displays a specific thing.
So the headline displays the post headline, whatever title you gave the post itself or the page, for that matter, whatever title you gave it. So if we just come over here and look at one of our pages and we look at our finished projects page. This is the headline. And so this is what shows up in this section that says headline.
You can click on it to see what its options are and its options gave you the choice of choosing what its tag is. You can give it a class and in some cases, you want to link that headline to the article page itself. This is especially the case in an archive style page. That’s the headline then you have the author.
And the author really is just the author’s name. Let’s go to Lesson 4…go over to our articles page here. And so here’s the author name. This was the title, this is the author and it displays what’s called a nice name.
So if you’re over in your user settings and you go to your profile you can see the options. You’ve got nickname, nice name, first name, last name. And in the absence of anything, it’s going to show the log in name. So if you want to show something better than that you type in your name. And now, your nickname can be anything and your display publicly name or your nice name is what you have here. So this is the name that will show up in that author name.
You have this choice here in your options. You can put a little bit of introductory text…so posted by. You could give it a class and you can link it to the author archive page which means that if they click on the name, it’ll take them to an archive page that displays all of the posts written by that author.
Next up is this edit link. The edit link I think is useless really. I always take out. It’s a link that shows up when the admin is logged in that allows you to click on it and say ‘edit this post’. The thing is that WordPress automatically has that up in the admin toolbar above now. And so I generally want to see what the post looks like without that link. And since nobody else sees it except the administrator or author who is logged in, I don’t think it’s useful really because that function already exists. So I always drag it out of there but you could use it if you want.
The next thing is content. We’re going to talk about content in a little bit more length in a few minutes. But content is generally just the content that you’ve typed in your page. So content means all this. That’s the content.
Let’s see, next is date and again, the date is the date in which it was published. You can have a little intro text or you can wrap it in a class. You can do a couple of other things.
Next up is author avatar. For example, since I’m the author here… let’s see, where do we go? Well, it hasn’t connected my avatar yet because it automatically connects avatars with gravatar.com. So it hasn’t connected me yet with the gravatar but it would be whatever avatar shows up here. Actually, I have avatars turned off on this website so I guess you won’t see it. But you’ll be familiar with it because this little avatar’s going to show up there for author avatar.
Author description is the description that you would put in here in your profile. That is this right here, biographical information. That’s the author description. So you could put a little bit of information in here and it will show up there. You can’t put any HTML in here so if you try to put headings or something like that, it’s not going to work. It’ll only take plain text.
Next up is the excerpt and the excerpt is a shortened version of the content. Again, we’re going to talk about that in length in just a moment.
Number of Comments
Number of comments is, in fact, just the number of people who have commented. Thesis has this opportunity for you to define whether or not you want to put in a singular version of the term or the plural version of the term. It automatically uses comment and comments. But if you’re using comments for product reviews, you could easily change this to review and reviews because that’s a perfectly reasonable application for comments in the context of a store.
Next up is categories and categories those that the post has been categorized with. And so it will show the categories for that post and you can again give it an HTML tag. You can give it some intro text and if you’ve applied more than one category per post, which I don’t recommend, then you can put a separator in there.
Next up is tags which is essentially the same thing as categories.
Then we have 3 different image choices. We have the Thesis post image, the Thesis thumbnail and or the WP featured image. We’ll all talk about this again in a few minutes but we did talk about this a couple of weeks ago when we were talking about featured images in WordPress.
A person would only use the Thesis post image or the Thesis thumbnail in the case of upgrading an existing Thesis site that uses post image and thumbnail. But if you’re starting the site from scratch, you would simply not use these at all. The Thesis post image is an image that could be set down here and the Thesis thumbnail is an image that could be set down here. And then the WP featured image is an image that would be set using this featured image function.
Now there are no options for you for post image, thumbnail or wp featured image. But you can use any one of these although I do not recommend you use any of them actually. I recommend you use the tool I’ve supplied you with which I’ll talk about in just a moment.
When Full Content is Displayed vs Excerpts
But that does bring us to this conversation about content versus excerpt. We have two different ways of displaying our content. We have this content and we have the excerpt. Now content on pages and on single posts will always display all of the content, the entire full content. Anything that you put in this text editor here is going to show up if you use the content in the post box. And that’s on pages and on single posts.
The More Tag
However, on your home page and on archive pages if you use content, what will happen is it will display the full content or it will display the full content down to the more tag. I’m going to show when we’re creating posts what a more tag looks like. But essentially, you can come along here and you can shorten what gets displayed on the home page and on your archive pages.
You can do that after a paragraph or some place near the beginning and you click on this insert more tag. And it inserts a link saying read more or whatever. And it displays only this part on the home page or in the archive page.
And so Thesis gives you the ability to edit that a little bit here. You can choose your own read more text. It’ll automatically say click to continue but you could say read the rest of this article or anything you want here for the read more text and it will substitute click to continue or your text for its default which is this click to continue thing.
When the Except is Displayed
Okay, that’s the content. Now the excerpt is something different and the excerpt is deliberately shorter.
There is a manual excerpt and the manual excerpt can be entered by scrolling down to the bottom where you can find the excerpt meta box.
Turning on the Except Meta Box
The excerpt meta box is, by default, hidden in the page editor. And so what you have to do is come over here to Screen Options and then over here and look for the excerpt. Where did that go? Okay actually, excerpt doesn’t exist for… I’m sorry, the excerpt doesn’t exist for pages. So you have to go down to posts for this. Leave that page. We only have one post currently and that’s the Hello World post that was automatically created.
But let’s just drop down here first to see if there’s an excerpt. There is not. So under Screen Options, here’s the excerpt. So if you click on that, it’ll show up.
Where to Add Excerpt Text
Now, you can scroll down here and anything you type here will show up in the excerpt except for HTML. HTML will not show up in the excerpt. So it’s going to be plain text but it will be as much plain text as you want to put in there will show up there.
On the other hand, there is an automatic excerpt. So if you don’t put anything in here, the automatic excerpt is the first 55 words in a given page. And in that case as well, it strips out all the HTML.
So if you had an image inside that 55 words, it would not display the image. If you had a video in that 55 words, it would not display the video. If you had a heading, it won’t display it as a heading. It will just show it as a line of text. The excerpt automatically strips all of the HTML out of it and only shows the first 55 words.
And if we look at the excerpt, there aren’t any options beyond simply giving it a class. Those are the only options you have.
Recap of Display Choices for Content and Excerpts
And so really, if you’re going to show your content, you have one of those two choices. You’re either going to show content or excerpt. And with your content, you have again, one of two choices. You’re either going to show all of the content or you’re going to show content down to a more tag.
And with excerpts, you’re either going to have a manual excerpt where you craft what you want to show up in the excerpt or you’re going to leave it alone and let it just grab the first 55 words. That’s how that works.