Optionally provide private feedback to help us improve this article...

Thank you for your feedback!


Editing JavaScript by hand within InstantForum

This article describes how to modify the JavaScript within InstantForum.

By default all JavaScript used by InstantForum is minified and bundled into two files called "core.js". This JavaScript file can be found within the "JS" directory within the root of your InstantForum installation. As this file is minified it can be hard to modify by hand. If you wish to modify our unminified & unbundled JS files and rebuild the optimized "core.js" please follow the steps in this article.

NOTE: This article applies to InstantForum 2013 or above. Earlier versions of InstantForum use dynamic run-time script bundling and minification. We moved to compile time script bundling and minification in newer version to ensure lower overhead at run-time.

What is core.js

core.js is the main minified and bundled JavaScript file loaded into all InstantForum pages. This file contains all the client side JavaScript required by InstantForum.

By default the following JavaScript files also within the JS folder will be minified and bundled into core.js in the order shown below...

  • 1-debug-json.js
  • 2-debug-jquery-1.8.2.js
  • 3-debug-common.js
  • 4-debug-jPlugIns.js
  • 5-debug-forum.js
  • 6-debug-richtextbox.js

How minification and bundling works

To create core.js we take all the separate JavaScript files found within your InstantForum JS folder that are formatted like {number}-debug-{name}.js

The {number} is important as this will determine the order in which the file is bundled into core.css. If you add custom JavaScript any dependencies for your JavaScript file should be included before the file you wish to use. You can number your JavaScript files to ensure they are included in the correct order.

How is core.js generated?

The "core.js" file will only be automatically generated from the various debug files if core.js does not already exists within the InstantForum "js" folder and the "InstantASP_DebugMode" application setting within the web.config is set to true...

<add key="InstantASP_DebugMode" value="true"/>
To re-create core.js you will first need to delete core.js from within the "js" folder. Once you've removed core.js you will need to ensure the InstantASP_DebugMode application setting within the web.config is set to "true". Then simply visit your InstantForum installation in a web browser and InstantForum will automatically generate the core.js file from the various -debug files.

NOTE
The minification & bundling occurs within the Application_OnStart event. If you don't see core.js being automatically generated you may need to recycle the web application within IIS or make a small change to the web.config file to force the application to recycle which will cause the "Application_OnStart" even to fire.

The core.js file does not appear?

Once you loaded any InstantForum page after deleting core.js and setting InstantASP_DebugMode to true you should see InstantForum will automatically generate the core.js file from your various debug files.

If InstantForum can't generate the core.js file due to insufficient file permissions you will receive an exception at run-time indicating which user does not have access to create the core.js file. In this instance simply give this user write and modify access to your InstantForum "Skins/Styles" folder.

Ensuring core.js is loaded

NOTE
To actually use the rebuilt core.js within your InstantForum pages after you've made changes to the debug JS and rebuilt the core.js file you will need to set the InstantASP_DebugMode application setting within the web.config to "false".

If you leave InstantASP_DebugMode set to "true" only the un-minified JavaScript files will be loaded into InstantForum pages.

If you wanted to include your own JS to be bundled and minified into core.js simply ensure your JS file follows the same naming convention as the existing JavaScript files within the InstantForum JS folder.

For example...

7-debug-myscript.js

This will then be added to the very end of core.js when it's generated. Again the number at the start of the JavaScript file indicates the order in which the scripts are bundled. This is important to ensure your JavaScript loads after any other dependencies.

That's It!

I hope this article helps you work with the JavaScript files provided within InstantForum. IF we can assist fuerther with any questions of course please don't hesitate to contact us or open a support ticket.