Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
Post formats are a relatively new addition to the WordPress ecosystem and they're not fully defined yet which is why I am only touching on them briefly in this course. The idea of post formats is that the author should be able to define what type of content a specific post contains, regular, image, gallery, video, audio, quote, etc. And the theme should change its display to accommodate this type of content. However, the actual definition of how this content should be displayed is currently vague and hard to nail down.
If you go to the Post Formats page on the WordPress codex and you read about the supported formats, you'll see here we have a list of formats but when you read the description of each of the formats, they're very unclear and it's not easy to understand exactly how those formats are supposed to be displayed. The result of this is that the implementation of post formats is wildly different from theme to theme and it's extremely inconsistent for people who are using the different themes. So, if you're a site owner and you use one theme with post formats it may display your content in a certain way you like and then when you switch to a different theme, the post formats are displayed in a completely different way, and you have to go back and edit your content.
For this reason, I'm really reluctant to use post formats for anything other than the original post format that was created, and that's the aside. So the aside is typically styled without a title and just displays as a status, much like a Facebook status. And the aside was actually the reason why post formats were created. Because the founder of WordPress, Matt Mullenweg, liked to add asides to his blog, so they made an aside post format and then they just started adding additional ones.
So in my theme, I only have support for the asides post format. You'll remember in functions.php, towards the very top we have the definition add_theme_support for post-formats and in the array, I've only set it to aside. Now I'm going to change one of my posts to an aside so that we can see what currently happens. So I'll go and edit this Hello world post and on the right hand side here in the editor, I'm going to change the format from Standard to Aside and update the post. And then I'll jump back to the front page.
So now when you scroll down you'll see that my post no longer displays its title, but if we inspect the code, you'll see the entry title is still there, it's just that inside the style sheet, there's a rule that targets, specifically, the asides and hides the entry title. But I want to do something a bit more advanced. I want to create a custom template just for the asides. And in that template, I want to display first, the post content itself, and then the meta content and the edit book. No continue reading link and no hidden title.
If you go and look at index.php again, and you scroll down and look inside the loop, you will remember that index.php calls for content and then get post format. So that means, if I create a new content template, that's called content aside, that template will automatically be used for the asides. So I'm going to go and grab content.php. And re-save it as content-aside.php. And then I can make my changes in here. So here I'm going to go inside index box and I'll remove the post thumbnail because we don't need that.
Then I'll leave the sticky, in case you want to stick the post format. I'm going to remove the title because we don't need that. And I'm going to take all this entry meta content and cut it out, and place it in the footer instead. And in the footer I'm also going to remove the read more link. Finally, I'm going to display the full contents. Here I'll just say the content instead. And I'll save this template file. And now, when I reload my front page again, you'll see that the post, with the post format aside, is displaying with a new template.
Now all I have to do is change the styles for this particular post, ever so slightly, so that we bump the content a little further down and bump the meta content a little further down too so that we align this properly with the white box. In the code snippets, you'll find the style for that. It's really simple. It's just one selector here. So, I can go to my style sheet and go to the table of contents and here you see 10.2 is asides. So I go to 10.2, and here I'm going to remove the existing one and then just apply my new rule which just says format-aside entry-content and then it sets the margin-top to 1em.
Save style.css, reload my template. And now the aside has a completely custom template that's styled differently from the rest. The same exact techniques you saw here, can be used to change the display of any of the post formats. Now, the idea here is that you're only going to display them differently in the index pages. But you can choose to also display them differently in individual single post pages. Just remember that for post formats you only have the predefined formats to work with. Aside, gallery, link, image, quote, status, video, audio and chat.
And if you're going to apply post formats you need to go to the codex page and read these descriptions and try to figure out exactly how you're going to display them so that the user gets a consistent experience if she chooses to switch from your theme to another theme.
Get unlimited access to all courses for just $25/month.Become a member
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.