Integration instructions are available at jsHarmonyCMS.com.

Editor Launcher for Remote Page Templates

<script type="text/javascript" class="removeOnPublish" src="path/to/jsHarmonyCmsClient.min.js"></script>
<script type="text/javascript" class="removeOnPublish">
jsHarmonyCmsClient({"access_keys":%%%ACCESS_KEYS%%%});
</script>

📋 Copy Code

* Be sure to include the "removeOnPublish" class to the Launcher script tags, so that the Editor Launcher will not be added to published pages.

Integration instructions are available at jsHarmonyCMS.com.

Router Sample Code

<script type="text/javascript" src="path/to/jsHarmonyCmsClient.min.js"></script>
<script type="text/javascript">
var cmsClient = new jsHarmonyCmsClient(%%%INTEGRATION_PARAMS_ACCESS_KEYS%%%);
cmsClient.Router();
</script>

📋 Copy Code

Integration instructions are available at jsHarmonyCMS.com.

Standalone Page Sample Code

<script type="text/javascript" src="path/to/jsHarmonyCmsClient.min.js"></script>
<script type="text/javascript">
var cmsClient = new jsHarmonyCmsClient(%%%INTEGRATION_PARAMS_ACCESS_KEYS%%%);
cmsClient.Standalone('/path/to/cms_content_page.html');
</script>

📋 Copy Code

Integration instructions are available at jsHarmonyCMS.com.

Router Sample Code

const express = require('express');
const jsHarmonyCmsRouter = require('jsharmony-cms-sdk-express').Router;
const cmsRouter = new jsHarmonyCmsRouter(%%%INTEGRATION_PARAMS_CMS_SERVER_URLS%%%);

var app = express();
app.use(cmsRouter.getRouter({ generate404OnNotFound: true }));

var server = app.listen(8080);

📋 Copy Code

Editor Launcher for Remote Page Templates

<script type="text/javascript" class="removeOnPublish" src="/.jsHarmonyCms/jsHarmonyCmsEditor.js"></script>
<script type="text/javascript" class="removeOnPublish">
jsHarmonyCmsEditor({"access_keys":%%%ACCESS_KEYS%%%});
</script>

📋 Copy Code

* Be sure to include the "removeOnPublish" class to the Launcher script tags, so that the Editor Launcher will not be added to published pages.

Integration instructions are available at jsHarmonyCMS.com.

Standalone Sample Code

// Initialize the jsHarmonyCmsRouter
const jsHarmonyCmsRouter = require('jsharmony-cms-sdk-express').Router;
const cmsRouter = new jsHarmonyCmsRouter(%%%INTEGRATION_PARAMS_CMS_SERVER_URLS%%%);

// Example - existing page route (be sure to use the async keyword)
app.get('/standalone_page', async function(req, res, next){
  // In your existing page route, load the page content and pass it as a parameter
  // * If your standalone page URL does not match the CMS page path, pass the CMS page path as a parameter
  var page = await cmsRouter.getStandalone(req); // or (req, '/cms_page_path');
  res.render('standalone_page.ejs', { page: page });
});

📋 Copy Code

Integration instructions are available at jsHarmonyCMS.com.

React Sample Code

import { JshCms } from "jsharmony-cms-sdk-react";
import React from "react";
import { createRoot } from "react-dom/client";

// CMS Config
const jshCmsConfig = %%%INTEGRATION_PARAMS_ACCESS_KEYS%%%;

const root = createRoot(document.getElementById("root")!);

root.render(
    <JshCms {...jshCmsConfig} >
        <App />
    </JshCms>
);

📋 Copy Code

Editor Launcher for Remote Page Templates

<script type="text/javascript" class="removeOnPublish" src="/.jsHarmonyCms/jsHarmonyCmsEditor.js"></script>
<script type="text/javascript" class="removeOnPublish">
jsHarmonyCmsEditor({"access_keys":%%%ACCESS_KEYS%%%});
</script>

📋 Copy Code

* Be sure to include the "removeOnPublish" class to the Launcher script tags, so that the Editor Launcher will not be added to published pages.

Integration instructions are available at jsHarmonyCMS.com.

Router Sample Code

import type { GetServerSideProps } from 'next';
import { JshCms, JshCmsRouter, JshCmsPage, JshCmsContentArea } from 'jsharmony-cms-sdk-next'

const jshCmsConfig = %%%INTEGRATION_PARAMS_CMS_SERVER_URLS%%%;

const jshCmsRouter = new JshCmsRouter(jshCmsConfig);

export const getServerSideProps: GetServerSideProps = async(context) => {
  return await jshCmsRouter.serve(context.query.path, context.query);
};

export default function Page({ jshCmsPage }: { jshCmsPage: JshCmsPage }) {
  return (
    <JshCms jshCmsPage={jshCmsPage} jshCmsConfig={jshCmsConfig}>
      <h1 cms-title="true">{jshCmsPage?.title||'Title'}</h1>
      <JshCmsContentArea cms-content="body">Page Content</JshCmsContentArea>
    </JshCms>
  );
};

📋 Copy Code

Integration instructions are available at jsHarmonyCMS.com.

Standalone Sample Code

import type { GetServerSideProps } from 'next';
import { JshCms, JshCmsRouter, JshCmsPage, JshCmsContentArea } from 'jsharmony-cms-sdk-next'

const jshCmsConfig = %%%INTEGRATION_PARAMS_CMS_SERVER_URLS%%%;

const jshCmsRouter = new JshCmsRouter(jshCmsConfig);

export const getServerSideProps: GetServerSideProps = async(context) => {
  const jshCmsPage = await jshCmsRouter.getStandalonePage(context.resolvedUrl, context.query); // or ('/cms_page_path', context.query);
  return { props: { jshCmsPage } };
};

export default function Page({ jshCmsPage }: { jshCmsPage: JshCmsPage }) {
  return (
    <JshCms jshCmsPage={jshCmsPage} jshCmsConfig={jshCmsConfig}>
      <h1 cms-title="true">{jshCmsPage?.title||'Title'}</h1>
      <JshCmsContentArea cms-content="body">Page Content</JshCmsContentArea>
    </JshCms>
  );
};

📋 Copy Code

Integration instructions are available at jsHarmonyCMS.com.

Router Sample Code

// If not already included in your application, auto-load Composer
require_once __DIR__.'/vendor/autoload.php';

// Initialize the jsHarmony CMS Router
use apHarmony\jsHarmonyCms\CmsRouter;
$cmsRouter = new CmsRouter(%%%INTEGRATION_PARAMS_CMS_SERVER_URLS%%%);

// Serve CMS content for the current URL
if(!$cmsRouter->serve()){
    $cmsRouter->generate404();
}

📋 Copy Code

Editor Launcher for Remote Page Templates

<script type="text/javascript" class="removeOnPublish" src="/.jsHarmonyCms/jsHarmonyCmsEditor.js"></script>
<script type="text/javascript" class="removeOnPublish">
jsHarmonyCmsEditor({"access_keys":%%%ACCESS_KEYS%%%});
</script>

📋 Copy Code

* Be sure to include the "removeOnPublish" class to the Launcher script tags, so that the Editor Launcher will not be added to published pages.

Integration instructions are available at jsHarmonyCMS.com.

Standalone Sample Code

// If not already included in your application, auto-load Composer
require_once __DIR__.'/vendor/autoload.php';

// Initialize the jsHarmony CMS Router
use apHarmony\jsHarmonyCms\CmsRouter;
$cmsRouter = new CmsRouter(%%%INTEGRATION_PARAMS_CMS_SERVER_URLS%%%);

// Get the CMS content for this page
$page = $cmsRouter->getStandalone();

📋 Copy Code