Skip to theme editor

Jann WiFi5 Theme Editor WiFi5 client theme builder

Theme settings

Customize Theme

Choose Theme

Choose a theme to start customizing.

Show or hide components

These switches change presentation only. WiFi5 runtime behavior remains available.

Vendo Selection Remaining Time Text Countdown MAC Address Points Pause Voucher Insert Coin Rates Chat

Quick-action buttons

The More Actions section hides automatically when every action is turned off.

Client Info Credit Code Buy Load Redeem Movie GCASH/MAYA CASH-IN Buy Duration Logs

Portal FeaturesCustomize your portal's features and appearance

Countdown StyleChoose your countdown design

Advanced LayoutInteraction, font, colors, spacing, and sizes

Interaction

Vendo selection mode Choose a vendo in a popup after tapping Insert Coin. The Vendo selector will be hidden from the portal. Enable Vendo Selection above to use this mode.

Appearance

Font Style Card Border Outline Text Muted Text Connected Secondary Insert Coin

Layout & Size

Page Margin Card Radius Button Size Mobile Spacing Countdown Size Insert Coin Size Button Radius Component Margin

Download

Generate your theme

Generate your customized, complete WiFi5 theme file.

WiFi5 Serial

Enter your WiFi5 Serial first.A valid Serial is required to activate and download.

Safe preview

Live theme preview

Visual preview only. It never connects to WiFi5 or starts customer transactions.

Developer: Jann WiFi5 Oliveros Clan

Account

Login

Login or create an account to download script.js.

Username PasswordMinimum 4 characters Confirm Password Redeem Voucher Code (optional)Have a voucher? Redeem it when your account is created.

Remember me Show password

No account?

Account Credits

Redeem Voucher

Enter your 6-character voucher code.

Voucher Code

Background

Customize the background behind your WiFi portal.

Background Type

Photo FilenameUpload your photo to WiFi5 Admin → Settings → Files, then enter its filename here.WiFi5 Image Path /html/background.jpg Background Position Dark Overlay35%

Preview uses a sample photo. Your actual background will load from WiFi5 Files.

Background Color

Announcement Popup

Create and customize your portal announcement.

Enable Announcement PopupShow announcements based on display rules.OFF

MessageCustomize what customers will see.

Header Details

Main Message

Additional Message Optional

Closing Details

Display RulesChoose when customers see the announcement.

When the portal opens

FrequencyApplies to this browser, not a WiFi5 account or other devices. Edited announcements can appear again.

Repeat automatically

Repeat everyMinutes

1–1,440 minutes. Repeats start after dismissal and pause while this tab is hidden.

When internet time endsShow after WiFi5 confirms that the customer's time expired. When internet reconnectsShow when an existing connection becomes active again.

All triggers share a one-minute cooldown. Expiration requires time observed in this visit; initial zero time and Pause/Resume do not count.

AppearanceCustomize the announcement's colors and typography.

Font Notice Type

Colors

Highlight Color Accent / Button Color

Dark highlights fall back to readable gold. Button text adjusts for contrast.

Generate and install an updated script.js to change your router announcement. Installed scripts do not update automatically.

Custom Buttons

Manage custom shortcuts shown in your portal.

No custom buttons yet.

Component Labels

Customize the names of buttons and components shown in your WiFi portal.

Notifications

Telegram Notifications

Enable Telegram NotificationsInclude the optional notification module in this device's download. Bot Token✓ Configured

Chat ID✓ Connected destination

Send /start to your bot in Telegram.Paste a Bot Token to detect your Chat ID automatically.

✓

Device Label (optional)

Notify me when Coin inserted Voucher redeemed Redeem successful Credit converted Free Time claimed

Customize how your Telegram notifications appear.

Select Notification

Customize Message

Edit the title and text. Plain text and emojis; no links or markup.

Available Values

Insert a value at the cursor. Lines with missing event values are omitted; an empty Device Label removes its separator. Messages are limited to 320 characters after substitution.

Message Preview Saved as credit

Example preview — sample data only

Account Credits

Voucher Redeemed

+0 Credits

Added successfully

Your balance is now 0 Credits.

Account Credits

Contact Admin

Current Balance: 0 Credits

Need more Credits?

Contact Admin to add Credits to your account.

Contact Admin

Device activation

Activate this device?

Serial
Cost

Device activation is permanent.

Installation

How to Install

Enable Custom Theme

Open Admin → Themes → Custom Theme, then enter the code and password below.

Custom Theme Code
U2FsdGVkX19iD8acOMeKH9hwn++4BhzWkEW8ncIt3+z2GhJFF5gyJV4mKc7bQQR/NjjLQvFIMtGZmDELrtkcQc8XBo+6AFU7Y1gssehmKut6xAF5Vu/bft46UcKLrFsP8Fm/9JnbT4jSq0vhzV4dlR+oxdQ6vunCRBq6xUT9QXs=

Password
@WiFi5Dev96632

Status should be: Allowed

If Status shows "Not Allowed", purchase the Custom Theme feature first. Get Custom Theme — ₱60
Download script.js

After Custom Theme shows Allowed, download script.js from this editor.
Upload script.js

Open Admin → Settings → Files and upload script.js.

After script.js is uploaded, the theme activates automatically.

Add Custom Button

Button Text Button URLUse http:// or https:// for external websites. Root-relative local paths are also supported. Button Color#82B8F4