Oxygen Builder Awesome Blog Post Template Video Tutorial


Written by
Fabrizio Van Marciano
Last updated on
May 9, 2022

Welcome to another Oxygen Builder video tutorial. If you're not yet subscribed to my YouTube channel, you can do so here, as well as get notifications of new videos when I upload them.

Oxygen Builder is a powerful and complete website development tool made for WordPress. Since it's release, the team over at Oxygen has added so many new features and improvements to the plugin.

Oxygen Builder is now my tool-of-choice when it comes to building custom websites for myself and for my clients.

OK, so in this tutorial, you'll learn how to create a simple but beautiful blog post template using the Oxygen Builder plugin, complete with a sidebar using the Content-Aware Sidebar plugin, social sharing buttons using the Social Snap plugin, and blog comments form.

Click on the video below to start watching! The video is almost an hour-long, just to pre-warn you.

Intro HTML Code And CSS

Around 12:17 in the video, you'll notice that I added some CSS to the stylesheet to style the intro class. To work correctly, each time you create a new blog post, make sure you edit the HTML of the first paragraph to add the class, as shown below in the image.

When you're done adding the class, you need to go back and Edit Visually, hit save, and then work on the front end.

For your convenience, here is the CSS snippet that you can copy for the intro class. Paste this inside your Oxygen Builder stylesheet. You only need to do this once.

/* CUSTOM STYLE FOR INTRO */

.intro {
	color: #606060;
	font-size: 22px;
	font-style: italic;
}

p. intro:after {
	border-bottom: 2px solid #494949;
	content: “”;
	display: block;
	margin-bottom: 40px;
	padding-bottom: 40px;
	width: 15%;
}

Plugins Used To Create The Blog Post Template

  1. Oxygen Builder.
  2. Content-Aware Sidebar (Find it here)
  3. Social Snap Social Sharing Plugin (Find it here) (To embed the following short-code)

More Oxygen Builder Tutorials

If you missed any of these other tutorials, you can check them out below. Don't forget to subscribe to my email newsletter to get updates.

  1. Oxygen Builder: How To Create A Custom Blog Archives Template
  2. Oxygen Builder: How To Build A Custom Homepage From Scratch
  3. View All Tutorials

Do You Need Help With Your Oxygen Website?

If you are trying to build your own website using Oxygen Builder and need assistance, please check out my website design service here.

Oxygen Builder Web Design Course


Learn how to build an awesome website for your business with my complete, Ultimate WordPress + Oxygen Builder Web Design Video Course

Website designed by Fabrizio

Shop


Web Design CourseCode Shop

Contact

Copy link