How to create and use a custom theme on your mobile Website?

Like you can see with Webelement create a mobile Website is very easy. With our mobile Website builder software, you don't need to be a super Webmaster to create a professional mobile Website that will look good by default :-).

Our Mobile Website builder software provide a default template with differents colors. You can use one of the default presset or custom the default theme colors to match your logo or organization easily.

On the following get started help we will show you how to customize the default theme with the theme editor.

What we want to accomplish?
We want to change the blue theme for a custom green theme.

Webelement Mobile Website preview

Mobile Website builder Software

1) Click on "Edit Website Settings".

2-click-on-edit-custom-theme

2) Click on "Edit Custom Theme".

Note* You will be redirect to http://jquerymobile.com/themeroller/ . Our Mobile website builder software is based on Jquerymobile framework for maximun compatibility. So if you already know Jquerymobile, you can use your knowledge to add more advanced features to your Website that may need some coding.

Jquerymobile theme roller

3) Click on Get Rolling

Custom Webelement theme

4) Because the set theme in our project is the letter B, We have to customize the letter B on themeroller editor. To apply a color, you just need choose a color square and drag it on the panel.

NOTE* If you not apply the same colors to the same letter as set in Webelement, your custom theme will not be applied.

5-download-the-theme

5) Click on Download to transfer the theme to your computer.

6-give-a-name

6) Give a name to the custom theme.
7) Click on "Download Zip" to transfer the file.
8) Choose a folder to save the file and click the Save button

8-save-the-zip-file

8-save

9-extract-the-theme

9) Go to the folder where you saved the zip file. Select the zip file and right click on it and extract the file.
You need a software like Winrar to uncompress the zipped file.

10-open-folder

10) Clck on the jquery theme folder (Note* This folder wil lget the name of the zip file)

11-step

11) Clck on "Themes" folder

12-check-custom-theme

10) Go back to Webelement and check the box "Enable custom theme".

12b

13-click-to-get-file

13) Click on the button on the field to choose the custom theme file.

14-choose-theme

14) Find the folder where the theme is saved and choose your theme.

Noe* There are 2 files, one is minimized (for fast loading) and the other one is not. If you want to some advanced changes, that can be done with the file without the ".min,css".

15-save-changes