How to Add Netflix, Anime, and IPTV Links to LPB Piso WiFi 2.0 Using a Floating Button
LPB Piso WiFi 2.0 allows operators to customize their customer portal to create a more useful and engaging experience. One customization option is a floating shortcut button that directs users to a selected website, such as a streaming service, anime platform, IPTV service, or tutorial explaining how to use the Piso WiFi vending system.
Instead of placing several links across the portal, you can use a floating button to keep a shortcut visible and easy to find. In this guide, we explain the basic process of adding a floating button through the LPB 2.0 Portal Design editor using custom HTML and CSS.
LPB Piso WiFi 2.0 lets an operator add a floating shortcut button in Portal Design using custom HTML and CSS. The button stays visible on the portal and opens a chosen site, such as a streaming service, tutorial, or help page. Keep a backup, test it on phone and computer, and link only to sites you are authorized to promote.
What Is a Floating Button in LPB Piso WiFi 2.0?
A floating button is a clickable element that appears above the main portal interface, often near the bottom or side of the screen. When a customer taps it, the button opens a designated website.
For example, a Piso WiFi operator might use floating buttons to provide:
- A link to Netflix or another authorized streaming service.
- An anime website or legal anime streaming platform.
- An IPTV service website.
- A tutorial video showing customers how to connect to the Piso WiFi portal.
- A help page containing connection instructions and frequently asked questions.
These are examples of possible destinations. The actual links and appearance depend on the HTML and CSS you add and the compatibility of your LPB portal version.
Requirements Before You Begin
Before editing your portal, prepare the following:
- Access to your LPB Piso WiFi 2.0 administrator panel.
- Permission to modify the portal’s design.
- The complete HTML and CSS code for the floating button.
- The destination URL you want the button to open.
- A backup of your existing portal design or a saved template, if supported.
The original tutorial refers to code linked in the video description. Because that actual code is not included in the transcription, the following steps explain where it is placed rather than supplying unverified code.
Step 1: Log In to the LPB Admin Panel
Open your LPB Piso WiFi administrator interface and sign in using your authorized administrator credentials.
Before making changes, save your current design or create a backup. This precaution is useful because an incorrectly placed HTML or CSS block may affect the portal’s appearance.
Step 2: Open Portal Design
After logging in, navigate to the Portal Design section. This is where you can edit the appearance and layout of your customer-facing portal.
Locate the HTML and CSS editor. The exact labels and layout may differ depending on your LPB 2.0 version.
Step 3: Find Modal for Wi-Fi Rates
In the HTML editor, press Ctrl + F on your keyboard and search for: Modal for Wi-Fi Rates
This shortcut helps you locate the relevant section without manually scanning the entire editor.
According to the tutorial, this is the area where the floating-button HTML code should be inserted. Copy the complete HTML code provided with the original tutorial and place it in the appropriate location.
Be careful not to delete surrounding code or insert the new block inside another element unintentionally.
Step 4: Add the CSS Styling
Next, locate the CSS section. Press Ctrl + F and search for: chat style
The tutorial identifies this as the location for the additional CSS code that styles the floating button.
Copy the corresponding CSS from the original source and add it to the design editor as instructed. The HTML defines the button’s structure and destination, while the CSS controls its appearance, positioning, size, and other visual properties.
Once both sections have been added, save your changes.
Step 5: Save and Test Your Floating Button
If your LPB version supports saving a design as a template, save a copy for future use. This makes it easier to restore or reuse the design later.
Then test the portal on a phone and a computer. Check that the button appears in the intended position, remains easy to tap, and opens the correct destination.
For example, if you configure a button to open an authorized anime streaming website, test that exact link rather than assuming every destination will work automatically.
Step 6: Change the Button’s Destination Link
If you want to change the destination later, return to the floating-button HTML block and locate the relevant link.
Replace the existing URL with your new destination, taking care to preserve the surrounding HTML syntax. Save the changes and test the updated link.
Do not replace every URL in the editor indiscriminately. Some links may belong to other portal functions.
Important Tips for Piso WiFi Operators
Keep the portal simple. Too many floating buttons can cover important controls, especially on smaller mobile screens. One or two useful shortcuts may provide a better experience than a crowded collection of links.
Check compatibility. Custom code that works on one LPB version or portal theme may behave differently on another. Test your changes before deploying them to customers.
Use legitimate destinations. Link only to websites you are authorized to promote. A floating button does not grant permission to distribute copyrighted movies, anime, IPTV streams, or subscription content.
Protect essential portal functions. Make sure customers can still access their session information, pause or resume their time where supported, and complete normal connection steps.
Conclusion
Adding a floating shortcut button to LPB Piso WiFi 2.0 can make your customer portal more convenient by providing quick access to useful websites and tutorials. The process described in the tutorial involves opening Portal Design, finding the designated HTML section, adding the corresponding CSS, saving the design, and testing the destination link.
Always keep a backup, verify that your code matches your LPB version, and test the finished portal on mobile devices before making it available to customers.