Make a responsive single-post layout WordPress: Responsive Themes


show more Making a responsive single-post layout provides you with in-depth training on Web. Taught by Morten Rand-Hendriksen as part of the WordPress: Building Responsive Themes show less
please wait ...

Making a responsive single-post layout

Now that we have a responsive header, it's time to move on to creating responsive layouts for our content, and we'll start with the single post. If I go to a single post, you see that we have the layout that's based on the small screens. We have the title and meta information on top and then we have the content underneath. But on this large screen, that doesn't look very good, because we have way too much space for these lines of text. And when you get text that is above a certain number of words per line, it becomes very hard to read.

That's the reason why, in the original design, I created this layout with the header and meta content on the left and the main content on the right. So, what we are going to do now is use that same technique we used to create that responsive header to change the layout of this main content area to make it flow the way it's supposed to. So we'll use that same math formula I showed earlier to find the correct percentage...

Making a responsive single-post layout
Video duration: 6m 11s 2h 55m Intermediate

Viewers:

Making a responsive single-post layout provides you with in-depth training on Web. Taught by Morten Rand-Hendriksen as part of the WordPress: Building Responsive Themes

Subject:
Web
Software:
WordPress
Author:
please wait ...