2022 Internet-In-A-Box Server: Adding HTML5 Modules

Date:



shutterstock 2656836861

Utilizing PuTTY And FileZilla Software program For eLearning

Selling instructing and studying in fragile environments has been the imaginative and prescient of many training applied sciences corporations, nongovernmental organizations, and governments throughout the globe. A method of realizing this has been via content material distribution methods that would function in offline and off-grid environments. A number of {hardware} and software program options have been developed by completely different entities. I’ve interacted with a number of and at the moment I’m customizing the internet-in-a-box (IIAB) platform hosted in a Linux Mint 20.3 Xfce Version mini PC. Many of the studying content material that I’ve developed, collated, and curated is in HTML5 format that wants some work to show within the IIAB platform. By means of analysis and plenty of trials, I’ve streamlined the method of doing this in eight straightforward steps. It could be somewhat technical for non-Linux customers, however when you get the cling of it, will probably be very straightforward from then onward.

Perquisites

Earlier than following via the steps under, you need to:

  1. Have an acceptable {hardware} gadget. This may very well be Raspberry Pi 4, Intel NUC, different mini PC opponents, ARM mini PCs, or an ordinary laptop computer/desktop pc with Intel Wi-Fi adapters.
  2. Set up a suitable working system. These embrace 32-bit Raspberry Pi OS, Ubuntu 21.04 (Hirsute Hippo; warning: not LTS!), Ubuntu 20.04 LTS (safety updates till April 2025, end-of-life ~2030), Debian 11 “Bullseye” (safety updates till June 2026?; experimental pre-releases!), or Linux Mint 20 (safety updates till April 2025).
  3. Web-in-a-box put in.
  4. PuTTY SSH shopper and FileZilla FTP shopper put in in a separate pc.

8 Straightforward Steps For Including HTML5 Modules To Web-In-A-Field Servers

Step 1: Put together Your Module

Get your module recordsdata prepared in your pc (for instance: en-wL_iLearnabout). A file named index.html is required within the root listing. If this isn’t accessible, duplicate the php file liable for loading the homepage and rename it to index.html and take away all php code from it.

Step 2: Replace Listing Permissions

Make sure the IIAB server is on and you’ll entry it by way of a browser. Login into the IIAB server utilizing the PuTTY SSH shopper, utilizing an admin account. Replace the listing permission to 777 for full entry (learn, write, and execute) by everybody as per the instructions under:

  • sudo chmod 777 /library/www/html/modules/
  • sudo chmod 777 /library/www/html/house/
  • sudo chmod 777 /library/www/html/js-menu/menu-files/menu-defs/
  • sudo chmod 777 /library/www/html/js-menu/menu-files/photographs/

Step 3: Add Module

Login into the IIAB server utilizing the FileZilla FTP shopper, utilizing an admin account. These are the credentials of the IIAB server. Add the module into the modules listing.

Step 4: Create A Menu Entry

Create a backup of the menu.json file (in /library/www/html/house/). Earlier than making adjustments by duplicating and renaming it, create a menu entry of the module in menu.json. To do that, download menu.json into your pc, and enter the menu entry (e.g., en-wL_iLearnabout) following json format. Delete menu.json within the IIAB server, after which re-upload the edited copy.

Step 5: Add Module-Title.json File

Navigate into /library/www/html/js-menu/menu-files/menu-defs/ and add a json file named as your module (e.g., en-wL_iLearnabout). The module-name.json file follows these guidelines:

  • “menu_item_name” : // Non-obligatory, and can be utilized to doc the file, however is now not required.
  • “moddir” : “”, // For html modules that is the listing beneath /module.
  • “start_url” : // That is the optionally available suffix to base href with out main slash.
  • “zim_name”: “”, // That is the generic zim identify with out YYYY-MM model suffix.
  • “title”: “”, // Localized title for hyperlink.
  • “description”:””, // Expanded textual content for hyperlink.
  • “extra_html”:”<menu_item_name>.html”, // Non-obligatory free type html for submenu or different use.
  • “apk_file”:”<apk file with out full path>” // Non-obligatory.
  • Watch out of embedded quotes, brackets, or different characters that can break json.

Tip:
Duplicate one other json file, rename it, and replace its contents accordingly.

Step 6: Add Module Picture

Navigate into /library/www/html/js-menu/menu-files/photographs/. Add the module picture named as per the entry within the json file (i.e., en-wL_iLearnabout.png).

Step 7: Load The Module In The Browser

Refresh your IIAB homepage to see the brand new module.

Tip:
If it doesn’t present, clear the browser cache. Press the keys [Ctrl], [Shift] and [Del].

Step 8: Replace Listing Permissions

Change again the listing permissions by way of SSH to forestall unauthorized server modification as per the instructions under:

  • sudo chmod 755 /library/www/html/modules/
  • sudo chmod 755 /library/www/html/house/
  • sudo chmod 755 /library/www/html/js-menu/menu-files/menu-defs/
  • sudo chmod 755 /library/www/html/js-menu/menu-files/photographs/

Please get in contact with me in case you will have points implementing these steps, or should you want some steerage.

References:

  • https://github.com/iiab/iiab/wiki/IIAB-Menuing
  • https://wiki.laptop computer.org/go/IIAB/FAQHow_do_I_customize_my_Internet-in-a-Box_home_page.3F

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Share post:

Subscribe

spot_imgspot_img

Popular

More like this
Related