Published on Oct 9, 2018

Backlinko-inspired blog layout in Oxygen

Sridhar Katakam
This members-only tutorial provides the steps to set up a Posts page template in Oxygen inspired by https://backlinko.com/blog.

Step 1

Install and activate WooSidebars plugin. Go to Appearance > Widget Areas and add a widget area named say, "Primary Sidebar". Go to Appearance > Widgets and add in your desired widgets in the newly created widget area.

Step 2

Install and activate Code Snippets plugin. Add a new Snippet titled say, "Add custom image size for Posts page" having
add_image_size( 'posts-page-thumb', 626, 256, true );
Regenerate thumbnails (not needed if none of the posts have featured images set yet).

Step 3

Oxygen > Templates > Add New Template. Enter a title of say, "Posts page". Set the Template to inherit from your Main Template having the Header and Footer. Apply it to Other > Blog Posts Index. Edit with Oxygen.

Step 4

Add a Section and inside that, a Heading element. Set the text to something like, "Our Blog". In this example, the primary color is #8ebf51 (green) which is what I've set the background color as. Add another Section and inside that, a Columns element having two columns. In my test site, I set the Widths of Left and Right Divs to 69% and 31% respectively. a) Left Div: I have set padding as 0, 15px, 0 and 0 (top, right, bottom, left). Add an Easy Posts element inside this Div. Template PHP:

This is a premium members-only content.

To view the rest of the content, please sign up for membership ($47/month or $499 one-time).

Already a member? Log in below or here.

tagschevron-leftchevron-rightchainangle-rightangle-upangle-downfolder-omagnifiercrossmenuchevron-downarrow-right