{"id":138232,"date":"2023-10-06T15:42:13","date_gmt":"2023-10-06T19:42:13","guid":{"rendered":"https:\/\/optinmonster.com\/?post_type=optinmonster_docs&#038;p=138232"},"modified":"2025-08-28T13:09:36","modified_gmt":"2025-08-28T17:09:36","slug":"using-the-optinmonster-api-with-single-page-applications","status":"publish","type":"optinmonster_docs","link":"https:\/\/optinmonster.com\/docs\/using-the-optinmonster-api-with-single-page-applications\/","title":{"rendered":"Using the OptinMonster API with Single Page Applications and Headless WordPress Websites"},"content":{"rendered":"\n<p>OptinMonster works on almost any website, including Single Page Applications and Headless WordPress websites.<\/p>\n\n\n\n<p><span class=\" author-d-16z86ztz122z98z81zz82zz85zunv3z82zpqfnl8z65zz84zgz85zlz81z5tz77zahyqejwjxz88zz87zvz85zz74zsssi\">In this article, we&#8217;ll provide some examples for using the Events API <code>.reset()<\/code> method to work with the OptinMonster API to deeply integrate with your Single Page Application or Headless WordPress website.<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Before You Start<\/h2>\n\n\n\n<p>Here are some things to know before you begin:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Due to the advanced nature of this guide, at this time we do not provide technical support for implementing <code>.reset()<\/code> in Single Page Applications.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Examples<\/h2>\n\n\n\n<p>You would update any of the following examples&#8217; method to use your own unique OptinMonster account ID and user ID.<\/p>\n\n\n\n<p>The method is formatted based on your account and user id: <code>om{accountId}_{userId}<\/code> so if your user ID is 1234 and your account ID is 5678 the object would be <code>window.om5678_1234<\/code>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Vue Router<\/h3>\n\n\n\n<script src=\"https:\/\/library.wpcode.com\/embedjs\/joerzqq5.js\/\"><\/script>\n\n\n\n<h3 class=\"wp-block-heading\">React Router V4<\/h3>\n\n\n\n<script src=\"https:\/\/library.wpcode.com\/embedjs\/rovx9w32.js\/\"><\/script>\n\n\n\n<h3 class=\"wp-block-heading\">React Router V3<\/h3>\n\n\n\n<script src=\"https:\/\/library.wpcode.com\/embedjs\/g5gme765.js\/\"><\/script>\n\n\n\n<h3 class=\"wp-block-heading\">EmberJS<\/h3>\n\n\n\n<script src=\"https:\/\/library.wpcode.com\/embedjs\/qo9xemzo.js\/\"><\/script>\n\n\n\n<h3 class=\"wp-block-heading\">AngularJS<\/h3>\n\n\n\n<script src=\"https:\/\/library.wpcode.com\/embedjs\/rod9jgy2.js\/\"><\/script>\n\n\n\n<h3 class=\"wp-block-heading\">NextJS<\/h3>\n\n\n\n<script src=\"https:\/\/library.wpcode.com\/embedjs\/j57gzxz5.js\/\"><\/script>\n\n\n\n<h3 class=\"wp-block-heading\">NextJS 14<\/h3>\n\n\n\n<script src=\"https:\/\/library.wpcode.com\/embedjs\/e50x0vr5.js\/\"><\/script>\n\n\n\n<p>You&#8217;ll also need to embed the OptinMonster embed code. This is a sample main layout.tsx file:<\/p>\n\n\n\n<script src=\"https:\/\/library.wpcode.com\/embedjs\/y266j462.js\/\"><\/script>\n\n\n\n<h2 class=\"wp-block-heading\">FAQs<\/h2>\n\n\n\n<h5 class=\"wp-block-heading\">Where do I find my account ID and user ID?<\/h5>\n\n\n\n<p>To find your&nbsp;<strong>Account ID<\/strong> and&nbsp;<strong>User ID:<\/strong><\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Log into your OptinMonster account and navigate to the <a href=\"https:\/\/app.optinmonster.com\/account\/\" target=\"_blank\" rel=\"noopener\" title=\"\"><strong>Account<\/strong><\/a> screen.<\/li>\n\n\n\n<li>Locate the&nbsp;<strong>Account-Wide Embed Code<\/strong> field. In the embed code, the numbers below will indicate your Account ID and <strong>User ID<\/strong>.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image aligncenter is-resized\"><img decoding=\"async\" width=\"1024\" height=\"530\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/om-user-id-account-id-1-1024x530.png\" alt=\"om user id, account id\" class=\"wp-image-177961\" style=\"width:1200px;height:auto\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/om-user-id-account-id-1-1024x530.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/om-user-id-account-id-1-300x155.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/om-user-id-account-id-1-768x397.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/om-user-id-account-id-1.png 1282w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n","protected":false},"excerpt":{"rendered":"<p>OptinMonster works on almost any website, including Single Page Applications and Headless WordPress websites. In this article, we&#8217;ll provide some examples for using the Events API .reset() method to work with the OptinMonster API to deeply integrate with your Single Page Application or Headless WordPress website. Before You Start Here are some things to know&nbsp;&hellip;<\/p>\n","protected":false},"author":4657,"comment_status":"open","ping_status":"closed","template":"","documentation\/categories":[96],"documentation\/tags":[31396,31487,31430,31856,31411,31418],"class_list":["post-138232","optinmonster_docs","type-optinmonster_docs","status-publish","hentry","categories-extending"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/138232","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation"}],"about":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/types\/optinmonster_docs"}],"author":[{"embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/users\/4657"}],"replies":[{"embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/comments?post=138232"}],"version-history":[{"count":20,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/138232\/revisions"}],"predecessor-version":[{"id":198939,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/138232\/revisions\/198939"}],"wp:attachment":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/media?parent=138232"}],"wp:term":[{"taxonomy":"categories","embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/categories?post=138232"},{"taxonomy":"internal_tags","embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/tags?post=138232"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}