Zoho billing logo Help Docs
/

Embed Pricing Widgets Using Zoho Sites

A pricing widget displays a list of various plans and addons available for a specific product, detailing the key features and their prices. Zoho Billing helps you create and manage pricing widgets effortlessly. You can copy and insert the pricing widget in your webpage to display different plans and pricing options. Customers can easily compare the plans and sign up directly from your website.

Zoho Sites allows you to create and customize a website of your choice, enabling you to embed existing pricing widgets effortlessly.

Prerequisites:

To embed pricing widgets using Zoho Sites, ensure you have the following:

  • A pricing widget with all the details you want created in Zoho Billing.
  • A website created using Zoho Sites to embed the pricing widget.

Copy Pricing Widget Code From Zoho Billing

Here’s how to copy the code from an already created pricing widget:

  • Go to Pricing Widgets under Product Catalog.
  • Hover over the pricing widget that you want to embed on your website.
  • Click Copy Code.
Copy Code

If you have not created a pricing widget already, you can create one in Zoho Billing. Click here to learn how.

Insert Pricing Widget in Zoho Sites

Here’s how to insert a pricing widget in Zoho Sites:

  • Create a new website or select a website which you’ve already created in Zoho Sites.

  • Go to Pages on the left sidebar.

  • Click Add Page at the top to create a new page, or hover over the page on which you want to embed the widget and click Edit content.

  • Click + at the top and select Element.

    Add Element
  • Select Code Snippet under Others.

    Code Snippet
  • Click Add Snippet at the top.

  • Enter a name for the code snippet and click OK.

    Add Snippet
  • Paste the code of the pricing widget which you have copied from Zoho Billing.

  • Click OK.

    Paste Code

The pricing widget will be placed on your website. Drag the snippet to position the widget wherever you want it on the website. You can preview the changes by clicking the Preview icon at the top.

Preview

After preview, you can publish the site by clicking Publish at the top.

Publish
Note: When you edit the pricing widgets in Zoho Billing, the changes will be automatically reflected on your website without the need to edit the code snippet in Zoho Sites everytime.
Was this document helpful?
Yes
No

Thank you for your feedback!