How to Create a Blog on Teachable

Zoran Zoran
8 minute read

Blogging is one of the most powerful and, at the same time, economical ways to attract new visitors to your site and convert them into students. In this tutorial, we’ll guide you through the simple steps of creating a blog with Teachable. It’s a quick and easy process, so buckle up and enjoy the ride.

What Is Teachable and Can You Blog With It?

Online learning is slowly but surely transforming the modern-day education landscape. Teachable is one of the forces driving this revolution. It’s a popular platform that enables you to create, sell, and promote online courses and coaching services. Teachable is ideal for starting an education business and turning it into an education empire. 

Until recently, you could create a blog on Teachable, but that’s not the case anymore.

On one hand, it’s a shame that Teachable doesn’t include as crucial of a feature as a blog. On the other hand, built-in blogs are rarely up to par when it comes to blogging in the business context; well, most of them. 

But, Teachable not offering a blog anymore is not such a huge loss when you can add a top-notch specialized blogging tool like DropInBlog to your Teachable site.

Here, we’ll show you exactly how you can integrate DropInBlog with Teachable. To start your blogging journey it takes only a few minutes, a passion for learning cool new things, and the ability to copy and paste a couple of lines of code. Easy enough, right? Along the way, you’ll learn about embed codes and how they can extend the capacities of your site. So, let’s get started!

Prerequisites

You need two things to create a blog with Teachable: a DropInBlog account and (at the minimum) a Teachable Basic account. 

The Teachable Basic plan allows you to add custom HTML block snippets, which is how you can create a blog on Teachable. Don’t let the fancy terminology discourage you, this feature is simply what lets you copy those few lines of code from DropInBlog and paste them into your Teachable site.

Regarding your DropInBlog account, there aren’t any special requirements. You can enjoy the perks of blogging even with the 14-day free trial.

Create a New Teachable Page

Adding a new page to your site is the first step in creating a blog on Teachable. To do that, you need to click Site and then Pages in the admin sidebar on the left. This will show all your existing pages as well as the New Page button.

Teachable dashboard

Next, click New Page, and Teachable will immediately create and show your page. Clicking the Settings wheel icon at the top of the sidebar will show you something like this:

Teachable page settings

We highlighted the field where you’ll put your Page Title, you can see we’ve named our page Blog. However, you don’t need to use Blog as your page title, you can name yours whatever you see fit. We just thought Blog was the most appropriate considering the purpose of our newly created page. 🤓

Here, under Settings, you can make other changes as well, such as getting rid of the page’s header and footer, adding a page description, etc. 

Once you’ve set the page title, click Publish. On the popup, you can change the page URL to reflect your page title, then click Publish again.

Publish page change

To ensure that everything went as planned, you can check whether your newly created page is listed in the dashboard.

Blog page dashboard

Now that your new page is set up and ready to go, it’s time to move on to the next step.

Add the DropInBlog Embed Code

This is the fun part, ready? 

From your Teachable dashboard, open your blog page by clicking the Edit icon. In the left sidebar, you’ll see the option Add New Block. Click on it, select Custom HTML, and then click Add.

Add custom html

In a new browser tab or window, open DropInBlog. Log in to your account, and click Code & Layout in the navigation bar. This is where you’ll find the embed codes. There are two pieces of code you need to copy. The code snippet from Step 1, which looks something like this:

<script>
var dib_id = 'XXXXXXXXXXXXXXXXXXX';
</script>
<script src="https://io.dropinblog.com/js/embed.js"></script>

We say “something like this” because you won’t see all these Xs in your code. Instead, what you’ll see will be your own unique DropInBlog ID, which is a mixture of numbers and uppercase letters.

And this is the Step 2 code:

<div id="dib-posts"></div>

Copy the code from Step 1 and Step 2. Then head over to your Teachable blog page, and paste both snippets into the HTML Code sidebar on the left. It’ll look like this:

Paste embed code teachable

After you’ve pasted both DropInBlog code snippets, click Publish, and then Preview to see the changes you made.

Preview blog teachable

Pretty cool, right?

Set Your Blog URL in Your DropInBlog Account

You’re very close to being ready to blog with Teachable. However, there’s one more thing to do before writing your first post. You need to input your Teachable blog URL in your DropInBlog account. This is the final step that allows you to fully connect your DropInBlog account to your Teachable account.

On Teachable, open your Site Pages List. Find your blog page, click the Preview option to open your blog in a new tab, and copy the URL from the navigation bar.

Copy blog url

Now, go back to DropInBlog again and navigate to Settings. You’ll see a page with a ton of customization options; at this point, the only one you need to set up is the Blog URL. Click on this field and paste the blog page link you had copied before. Note, your unique blog URL will probably be quite different from what you see here. 

Now, click Save All Changes. That’s it, you’re done! 

Paste blog url

Congrats, you’ve successfully integrated DropInBlog with Teachable. You can create educational content, sell your goods to people, and tell them about your products and your brand through your blog.

Tips for Using DropInBlog With Teachable

Now that you have created a blog and learned how to add custom HTML blocks to your Teachable site, you can make the most out of it by experimenting with other available options on DropInBlog. You can add your own custom code blocks directly to your blog page and change the style however you want.

When you open the DropInBlog Code & Layout page, under Advanced, you’ll find the Custom CSS option. Here you can tweak the styling of your blog via your DropInBlog account. This can come in very handy if you’re unable to modify the CSS through your Teachable account.

How to Create a blog with Teachable

DropInBlog inherits the styles of the design templates you use for your site, but if you want to customize your blog, this is where you’ll do it. 

For instance, if your template page is full width and you want to add some margin to your blog, you can do that by adding the following CSS into DropInBlog: .dib-post-wrap { margin: 0 3em; }. Just remember to save your changes.

On the other hand, from within Teachable, you can change styles the same way you add the embed code from DropInBlog: add a new custom HTML block to your blog page, write your CSS code between <style>...</style> tags, publish, and that’s it.

In addition to this, you can also add recent posts as well as other widgets from DropInBlog. As you already guessed, you’ll find the code for those on the Code & Layout page, in the Widget Code section, right below Custom CSS. You can paste it wherever you want into your site and set the number of recent posts to any number you like, so people can see and access your recent blog posts from anywhere on your website.

In case you need some help or you have any questions, please reach out to us; we're standing by just waiting to help.

Get started embedding a blog into your website right now

Try It For Free