Skip to main content
CESDK/Web/Configuration
Language:

Configuring the Page Appearance in CESDK

In this example, we will show you how to configure the CreativeEditor SDK.

Explore a full code sample of the integration on CodeSandbox or view the code on GitHub.

Page Configuration#

The CE.SDK comes with a set of page-specific configuration parameters that lets you influence the page appearance.

  • title.show: boolean defines whether page titles shall be shown by the editor.
  • title.font: string defines the font to be used to render the page titles. If not available, a bundled default font will be used as a fallback.
  • dimOutOfPageAreas: boolean defines whether the opacity of the region outside of all pages should be reduced.
File:
import 'https://cdn.img.ly/packages/imgly/cesdk-js/1.7.0/cesdk.umd.js';
const config = {
baseURL: 'https://cdn.img.ly/packages/imgly/cesdk-js/1.7.0/assets',
page: {
title: {
show: true,
// Relative path is resolved relative to `baseURL`.
fontFileUri: '/extensions/ly.img.cesdk.fonts/fonts/Permanent_Marker/PermanentMarker-Regular.ttf',
},
dimOutOfPageAreas: true
}
};
CreativeEditorSDK.init('#cesdk_container', config).then((instance) => {
/** do something with the instance of CreativeEditor SDK **/
});