Difference between revisions of "XPicoWiFi/CustomizeWebPages"

From Lantronix Wiki!
Jump to navigation Jump to search
Line 13: Line 13:
  
 
[[File:WebManagerDefault.jpg|300px]]
 
[[File:WebManagerDefault.jpg|300px]]
 +
 +
=== Overriding files ===
 +
 +
The HTML, Javascript, and CSS that makes the default Lantronix web pages is built into the Lantronix firmware. These are called Overridable files, in that you can create your own to be served instead of the default ones. The list of overridable files is in the "Branding the xPico Wi-Fi Unit" chapter of the xPico Wi-Fi User Guide. The overridable files are:
 +
 +
* index.html – Main file controlling text and graphics
 +
* style.css – Style sheet
 +
* img/bg.gif – Main background
 +
* img/company_logo.gif – Company logo in header container
 +
* img/product_logo.gif – Product logo in header container
 +
* img/favicon.ico – Shortcut icon
 +
* img/header_bg.gif – Head container background
 +
 +
If you would like to override a file, place it in the following directory in the filesystem: /main/http/web_manager
 +
 +
You can create the override file from scratch, or you can save as source the Lantronix one and modify it. If you would like to see the source of the Lantronix default page, you can find it in the following directory: /embedded/main/http/web_manager
 +
 +
 +
The following picture shows the effect of the different overridable files:
 +
 +
[[File:OverridableFiles.jpg]]

Revision as of 17:58, 25 August 2015

Introduction

A very common use case for the xPico Wi-Fi is to customize the web pages that are served by the web server that is integrated into the xPico Wi-Fi. There are multiple ways to achieve this, so you need to think about how you want it to look.

You can use the existing Lantronix pages and remove certain items while also adding your own items, or you can create your own completely custom pages that don't use the Lantronix HTML/Javascript content at all.

This document shows how to get started with doing both.

Using the Lantronix pages

Default Web Manager

This is what by default the Lantronix Web Manager looks like:

WebManagerDefault.jpg

Overriding files

The HTML, Javascript, and CSS that makes the default Lantronix web pages is built into the Lantronix firmware. These are called Overridable files, in that you can create your own to be served instead of the default ones. The list of overridable files is in the "Branding the xPico Wi-Fi Unit" chapter of the xPico Wi-Fi User Guide. The overridable files are:

  • index.html – Main file controlling text and graphics
  • style.css – Style sheet
  • img/bg.gif – Main background
  • img/company_logo.gif – Company logo in header container
  • img/product_logo.gif – Product logo in header container
  • img/favicon.ico – Shortcut icon
  • img/header_bg.gif – Head container background

If you would like to override a file, place it in the following directory in the filesystem: /main/http/web_manager

You can create the override file from scratch, or you can save as source the Lantronix one and modify it. If you would like to see the source of the Lantronix default page, you can find it in the following directory: /embedded/main/http/web_manager


The following picture shows the effect of the different overridable files:

OverridableFiles.jpg