12% off of LTD using this coupon: TWELVEPERCENTOFF. Promo ends on 2 Dec midnight UTC.
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 $599 one-time).

Already a member? Log in below or here.

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