how to embed insurance calculator in gutenberg wordpress

Embed Insurance Calculator in Gutenberg WordPress

Gutenberg is the new WordPress editor, which was released in the latest WordPress 5.0 version. Most bloggers use Gutenberg to post their blogs. But if you are a blogger who writes posts about insurance and want to give your client an instant quote, when they land on your blog, then please read on.

The insurance calculator is nothing but a bunch of HTML codes which you can embed on your WordPress blog. It is much better and reliable than using a plugin which might break your wordpress website. To get the insurance calculator codes you can visit this website called “Ninja Quoter“.  After signing up with one of their package, they will provide you the calculator codes which you can directly embed on your website. All the functionalities and calculations will take place in their website.

Suppose you have singed up to their website and got the codes. Let me show you the steps of how you can embed the calculator codes in your WordPress blog made with Gutenberg.

STEP 1: Add an a block

In the Gutenberg editor, click on the plus icon to add a new block as shown in the screenshot below.

adding gutenberg block

STEP 2: Add an HTML Block

Then from the block search field type in “html”, the “Custom HTML” block would show up. Click on that to add it.

STEP 3: Paste in Insurance Calculator codes

Then simply paste in the insurance calculator codes in the HTML code field, and then click on “Preview”. 

pasting insurance calculator codes in gutenberg HTML block

Have fun with your Insurance Calculator

After you have pasted in the insurance calculator codes, the clicked on “preview”. Your insurance calculator should show up. Make sure you click “Save” and then test out the calculator in your live blog post.

India $1295