Documentation for how to create a simple plugin to easily add a Live Center live blog in a centralized CMS
Introduction
This documentation outlines how to create a simple plugin for Live Center that allows a user to easily search for, select, and embed a channel (live blog) created in Live Center, to the user’s main Content Management System.
Prerequisites and additional documentation
For an introduction to Live Center, please see our public documentation here: https://support.livecenter.com
Admin access
A Live Center Administrator is required to set up the Latest Channels API. Please ensure you have Admin rights, or that you have access to an admin who can assist.
Set up Latest Channels API
Please see https://support.livecenter.com/integrations for the steps required to set up this API. The main value relevant for the Plugin is the CHANNEL_ID, but other values in the API can be used as-needed
Adding Live Center
Depending on your needs and requirements, there are different ways a Live Center live blog can be added to your site. If you are unsure about which method you are, or would like to use, please visit https://support.livecenter.com/adding-live-center
Parameters
There are three variables in-scope for the plugin:
TENANT_KEY - the key for the account from which you would like to retrieve channels
CHANNEL_ID - the id for the channel
THEME_NAME - specifying one of the default themes available in Live Center. Values include: ['darkmode', 'default', 'materialdesign', 'materialalternate', 'centered', 'white', 'sports']
Fetch CHANNEL_ID
Using the LatestChannel API, fetch the CHANNEL_ID of the channels created in your account.
Embed code
The default Iframe script can be seen below.
The there required parameters are highlighted below
<div class="live-center-embed" data-src="https://livecenter.norkon.net/frame/TENANT_KEY/CHANNEL_ID/THEME_NAME"><script type="text/javascript">(function(n){function c(t,i){n[e](h,function(n){var r,u;if(n&&(r=n[n.message?"message":"data"]+"",r&&r.substr&&r.substr(0,3)==="nc:")&&(u=r.split(":"),u[1]===i))switch(u[2]){case"h":t.style.height=u[3]+"px";return;case"scrolltotop":t.scrollIntoView();return}},!1)}for(var t,u,f,i,s,e=n.addEventListener?"addEventListener":"attachEvent",h=e==="attachEvent"?"onmessage":"message",o=n.document.querySelectorAll(".live-center-embed"),r=0;r<o.length;r++)(t=o[r],t.getAttribute("data-rendered"))||(u=t.getAttribute("data-src"),u&&(t.setAttribute("data-rendered","true"),f=n.ncVizCounter||1e3,n.ncVizCounter=f+1,i=f+"",s="nc-frame-c-"+i,t.innerHTML='<div style="position: relative; height: 300px; border: none;" id="'+s+'"><iframe src="'+u+"?"+i+'" style="position: absolute; left: 0; top: 0; width: 100%; height: 100%;" frameborder="0" allowtransparency="true" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true" allow="autoplay; fullscreen"></iframe></div>',c(t.firstChild,i)))})(window);</script></div>
JavaScript and API implementation options
For documentation on how to render a Live Center yourself using our APIs, or if you would like to use our JS libraries directly on your site, please visit https://support.livecenter.com/adding-live-center.
If you need any help or assistance, please contact us at support@norkon.net.