Skip to content Skip to main navigation Skip to footer

How to customize the pages of a campaign with skin editor?

The skin editor allows you to customize the pages of your campaign to suit your own needs.

You can access the game editor by following: 

  1. Go to Dashboard and create a new campaign, or tap any campaign to open it.
  2. In the Page Settings, select any page items and then select the “Edit this screen” button.

1. INTERFACE

1. Elements

Elements shows all the elements of the selected page.

Each element has different components that can be customized, such as:

  • Component Type.
  • Image component.
  • Text component.
  • Color component.
  • Alignment component.
  • And some other components.

2. Canvas

Canvas shows a visual look of the page that you have selected.

When you customize any component, the change will be shown in canvas in real time.

3. Canvas Device View 

Show the buttons which allow to change the view of the canvas.

You can check how the page looks in PC, Tablet and Mobile view.

4. Close Button

Select it to close the skin editor tool.

2. STEPS TO CUSTOMIZE THE GAME

You can customize the game in Pro mode by following the steps below:

Step 1. Select the component

After opening the skin editor of a page, check and select any page’s element.

Once selected, all components of that element will be shown. 

Step 2. Customize the component

There are many types of components, each of them may have different things that can be customized.

When you customize any component:

  • The page visual in the canvas area will automatically be updated to let you preview how the page looks in real time.
  • The change that you have made will be saved automatically too.

Customize component type

One component may support different types, you can change a component type by simply selecting the type buttons next to it.

Note: some dependent components of that component may be changed once the type has changed to others.

Customize image component

In an image component, you can download it as an image file, or upload a new image to replace it.

Customize text component

You can customize the text component by directly inputting new content in the textbox.

Customize paragraph component

You can customize the paragraph component by selecting it and inputting new content in the text editor popup.

Customize color component

You can customize the color component by selecting it and select a new color in the color picker popup.

Customize other components

There are also some other less common components but you can easily find out how to customize them via the control buttons in the skin editor.

Step 3. Preview the page and quit skin editor

After customizing the necessary components in the page and view the changes in canvas, if the end result satisfies your needs, you can close the skin editor by selecting the “Close” button on the top right of the screen.

If not, please go back to step 1 and continue customizing until it meets your needs.

OTHER FEATURES

1. RESTORE AN ELEMENT TO ORIGINAL SETTINGS

You can restore the customized elements back to the original settings by simply clicking the “Restore Default” button at the bottom of components list:

2. REMOVE A COMPONENT FROM PAGE

Some elements can be completely removed by turning its switch to off in theElement Panel:

2. CHANGE CANVAS DEVICE VIEW

You can check how the screen looks in different screen sizes by simply choosing the Live Preview’s screen size in the top right of the screen:

There are three available screen sizes: PC, Tablet, and Mobile Phone.

Submit a query

Leave us a message