HTML Settings

General

 

Title Title of the website.
Note If you use Multi-Language (see PHP Settings), use Multi-Language Property Editor, see Tools for details.
Charset Charset of the website.
Notes
  1. Always use utf-8 whenever possible.
  2. If you use Multi-Language (see PHP Settings), this setting must be utf-8.
Font Default font. If not specified, Bootstrap $font-family-sans-serif will be used, see Native font stack.
Size (rem) Default font size (rem). Unit must be in rem for working with Bootstrap. Default is .875rem.
Site icon Icon of the site. For browsers to show your URL with an icon. Should be an .ico or .png file.
Brand logo/text Logo image or text in the header.
Note This setting is enabled in registered version only.
Brand href URL of the brand logo image or text in the header.
Note This setting is enabled in registered version only.
Footer text Footer text (e.g. copyright statement)
Notes
  1. If you use Multi-Language (see PHP Settings), use Multi-Language Property Editor, see Tools for details.
  2. This setting is enabled in registered version only.

 

Theme

Provides many themes for you to setup the look and feel of your project quickly.

Themes are integrated with Bootstrap and AdminLTE, you can customize Bootstrap and AdminLTE properties directly in the Theme tab, scroll down to find the Bootstrap or AdminLTE variables starting with "$".

You can change the various properties of the selected theme to suit your style. The property name are self-explanatory. Read Bootstrap documentation for more information, there is a Sass section in each article.

To use built-in themes, just select a theme from the Theme setting.

To export custom theme settings, click the Export theme button to export the theme to an external xml file. To import custom theme settings from earlier saved xml files, click the Import theme button.

There are a lot of theme settings, you can use the Search box to quickly filter the settings by name.

Notes
  1. Normally when you open an old project from previous versions, PHPMaker will convert the theme settings for the new version. If the theme settings are not converted completely, you may see Sass compilation error, you can fix it by re-selecting a theme to update the theme settings.
  2. Changing a setting in the user interface does not change the corresponding setting in the theme definitions, it only changes the setting for the project. The theme definition files (in XML format) are installed in the subfolder "themes" under the installation folder. You can easily add your own themes by duplicating one of the theme definition file (e.g. plain.xml), rename it and modify the settings in the file, just make sure you give your theme a unique theme name.
  3. AdminLTE builts on top of Bootstrap, some AdminLTE settings change the default value of the corresponding Bootstrap variables.
  4. After changing theme properties, make sure you re-generate all *.css files.

 

Styles

The CSS styles under the System tab are styles generated for the project. The CSS styles under the User tab are your own CSS styles. You can enter your styles directly in the editor.

Compile styles Complie user styles.

User styles Supports Sass, you can use Bootstrap and AdminLTE variables (starting with "$") in your code. After entering your styles, press this button to test, PHPMaker will try to compile your styles and show it in the System tab between /*BEGIN_USER_STYLES*/ and /*BEGIN_USER_STYLES*/.

Notes
  1. If you want to override the system styles, you can copy the styles to the User Styles Section, or you can use a separate user stylesheet.
  2. If you want to change the system stylesheet template, modify the ew.scss in the "themes" subfolder under the installed directory. Only modify the ew.scss if you have the necessary knowledges in Sass.
User Stylesheet Specify an external user stylesheet (will be copied across during generation)

You can see the effect of new settings immediately in the preview window at the bottom of the HTML tab.

 

Notes
  1. The preview window requires Webview2 Runtime to work.
  2. If you do not need HTML preview, you can disable it by the advanced setting HTML preview and make the UI performs faster in this page.
  3. The preview window shows the layout and table colors only, it cannot show changes in all variables. If you want to preview more, you can customize the file <AppData Folder>\themes\preview\ew.html, e.g. C:\Users\<user>\AppData\Roaming\PHPMaker<version>\themes\preview\ew.html.

 

 

 ©2002-2023 e.World Technology Ltd. All rights reserved.