Visokio website     Downloads     Video tutorials     KnowledgeBase  
Branding: "branding.internal" folder and how to customize html file - Visokio Forums
Branding: "branding.internal" folder and how to customize html file
  • junrong August 16, 2016 10:55AM
    I am using Omniscope server 2.9 and trying to customize html files relating to the Mobile Web Server, such as adding header and footer to index.html, adding company logo, changing color and so on. Based on the support document, there should be a "branding.internal" folder existing under main "Mobile sharing folder" on the server side, however I cannot find this folder.
    The way we work is: we installed the Omniscope server and it has the mobile sharing folder where we put all *.iok files in.
    We can view all sub-folder and IOK applications from browser by typing the link of this server.

    Where is the branding folder? Can we modify the branding html/css files to customize the look of web page?
  •     mustafa August 16, 2016 5:04PM

    The branding.internal folder is not created by default you have to create it yourself. and then inside put in your customisation.

    More detail information about the branding can be found here which even includes a sample branding.internal folder which you can drop in the folder as a starting point.

    I hope this helps.
  • junrong August 17, 2016 11:13AM
    Hi mustafa,
    Thank you very much for your answer. I still haves some confusion.

    On Omniscope server, under the "Omniscope Web Server" section, there is a "Sharing folder" link and we drop IOK files here so that we can view our IOK applications from HTML5 browser. From the browser side, we can see the html source code by using browser developer tools. I can see that the html header includes references to external css/js style sheet and the directory is "branding.internal/mobile/share/*".

    So if the branding.internal folder is not created by default, how does the html file include the reference to "branding.internal/mobile/share/*"? How the page is displayed as CSS designed? I guess the branding.internal folder must be existing somewhere, otherwise the html page cannot include reference to it which is even not existing, right?

    In addition, I followed the link your provided to download the example branding.internal folder and put it under "Mobile Sharing folder". The page did not show difference after changing some index.html source code. Where should I put the branding.internal folder in?

  •     mustafa August 17, 2016 3:09PM

    By default the branding.internal that is documented on the page doesn't do any splash screen changes etc, so try replacing the app-splash.png with your own one and you should see it appear when you open the file. What kind of changes are you trying to do? When you say changes to the index page which index page are you trying to change - the page that shows list of files, or the page that shows a loading indicator before showing the file?

    Regarding your other question about where is the branding.internal which it uses. By default there is always an implicit branding.internal bundled with the application itself (which you can't see, as it is inside the Omniscope installer libraries) which it uses if it can't find it on your system locally.
  • junrong August 17, 2016 6:13PM
    Thank you for your quick response...
    I am able to modify the index file inside of branding.internal/mobile/server/ (the example downloaded from the link ) and I customized the look of the page successfully.

    I want to change the style of the page that shows list of files and alse change the page that shows loading logo to be replaced by our company log.

    For the page that shows list of files, can I change the file name to be non-clickable? To do this, what's the JS file should I work on? I want to create our own menu tab to navigate to a new html file we created. I will embed IOK app as a Iframe into my html file.

    What function should I invoke to get the current folder name dynamically?

  •     steve August 18, 2016 9:14AM

    I think you may be able to achieve this using pointer-events: none. Alternatively, try customising the JS, e.g. this is the URL for our own demo server:


It looks like you're new here. If you want to get involved, click one of these buttons!

Sign In Apply for Membership