We Keep Coding

How do I add an external javascript file into discourse?

I have a javascript file that I would to add to discourse, but I am not sure how. Am I required to create a plugin to include a js file or can I include the file in the source code? Either way, I am not sure how to accomplish this.

If what you need is to embed, in every Discourse page, a tag linking to an external resource, you need to do the following:
Create a theme component and include it to all your themes
In your theme component, click "Edit CSS/HTML"
In the </head> section, enter your <script src="..."></script> code and click "Save"
In Discourse setting content_security_policy_script_src, add the full url of the script
The full doc is here.

I was able to achieve this by adding the following code <script async src="url-here" data-url="url-here"></script> Into the </head> section of /admin/customize/themes

Try using this :
<script src="**URL**"></script> under the head section.
The URL of the external script file.
Possible values:
An absolute URL - points to another web site (like src="http://www.example.com/example.js")
A relative URL - points to a file within a web site (like src="/scripts/example.js")

How do I link JS file from other folder to a page?

I downloaded some realtime css editor and I have a hard time figuring out how to link it to my other pages.
I have a file called cssit.js (that's a css editor) and if I put it in a same folder as my page, it works fine. However, if I wish to link to that script from pages that are in other folders, I don't know how to.
Example: My page is in images/index.php, but that script is in scripts/javascript/cssit.js
How would I link to index.php that script?

// images/index.php
<script src="../scripts/javascript/cssit.js">
// another/dir/index.php
<script src="../../scripts/javascript/cssit.js">
Or, maybe an easier way is to use absolute paths. Assuming scripts/javascript is at the root of your website:
// images/index.php
<script src="/scripts/javascript/cssit.js">
// another/dir/index.php
<script src="/scripts/javascript/cssit.js">

Image Slider is not loading correctly

On my webpage there is supposed to be an image slider (carousel). My one problem is, it's not loading correctly. As you can see on my site there are 4 bullet points and 4 images next to them. Could you see if i am missing anything in terms of my files being incorrect? I will also add a link to the site where you can find my image slider, and i also added a link to my site to help on your end.
-Thanks!
My site: http://rootforsite.azurewebsites.net/
ImageSlider: http://bxslider.com/

Your javascript to init the bxSlider isn't working, it looks like you may have an errant "style" tag or something (it's trying to close a style block, the body, and the html all within your script), also make sure to include type="text/javascript" in your tag, and finally it's usually safest to do you jQuery onLoad functions like so:
jQuery(function($){
$(...).blahblah();
});
Then "$" will be scoped a bit better.

first of all you are using
<script src="myscripts.js"></script>
before loading jquery.
Please always use jquery scripts after loading jquery.min.js
also try to load the
<script src="js/jquery.bxslider.min.js"></script>
after bootstrap.js

Cannot add js file using script tag

This seems like a rather dumb question to ask but I would like to resolve this quickly and start working.I have a folder in which my html resides and I have the javascript files in a seperate folder called js.I have tried to add the script like this:
<script type="text/javascript" src="js/gmaps.js">
and I have also tried like this:
<script type="text/javascript" src="./js/gmaps.js">
I have even tried like this:
<script type="text/javascript" src="/js/gmaps.js">
As far as I understand either of the first two should work:
/ root folder
./ current folder
../one folder up
The paths of the files are
/home/anr/Desktop/maps/server/client/js/gmaps.js
/home/anr/Desktop/maps/server/client/google_maps.html
UPDATE:
The js file has window.onload and it also creates another script tag programmatically and adds it to the dom,after moving to the external script file I find that the map does not load

Looks like you just need to close your script tag with a on the first example, which should work.

Be sure that you are closing your tag as well. Once you have the correct relative path, your syntax should be:
<script type="text/javascript" src="relative_path_here"></script>
The following link could be helpful for setting the relative path in HTML:
Basic HTML - how to set relative path to current folder?

Try this,
<script type="text/javascript" src="js/gmaps.js"></script>
The script tag should be closed

<script type="text/javascript" src="js/gmaps.js"></script> Tag should be closed

I also had a similar problem but not with the path. My problem is the encoding of the html file in my demo, change encoding to ASNI to fix problem.

Working with RequireJS multipage and page template

i'm starting with requireJS and need some help to proceed with its implementation.
My site is built following the defaults:
header.html (always the same, containing the requiredjs script tag)
$pageMain (always variable - $pageAbout, $pageContact...)
footer.html (always the same)
I need to load specific js file in different pages from my site, but i have only one header which contains the tag to set my required files.
<script data-main="js/main" src="js/lib/require.js"></script>
When my page is $pageAbout i need to load $pageAbout.js instead $pageMain.js
I'm still not able to do this.
Checking the https://github.com/requirejs/example-multipage# i understood how it works, but in my case, i coudn't do it because i specify the script tag only once in the header.html
Any suggestion ?
I don't know if i was clear in my question. Please let me know to better explain.

There are various solutions here, depending on what you can easily edit.
You could change the script tag in the header, based on the current page. I am assuming from your description that this is not possible.
If you have to always load the same js/main script, you could use that as a switch between different page-specific modules:
// js/main.js
define(function() {
var pageId = getPageId();
require('js/' + pageId);
});
This depends on being able to get the page id when the header loads - either through a JS variable you can set before the header is loaded, or by parsing the URL, or through some other means.
You can simply drop the script tag from the header and include it in the variable body of your page. Script tags can appear anywhere in the document.
You could drop the data-main attribute from the header script tag (so that the header just loads the RequireJS library), then have a script tag in your page body to load the page-specific module:
<script> require('js/pageAbout'); </script>
Any of these should work - the last two are probably simplest. The RequireJS docs are very prescriptive, but there are many paths to a working implementation - you don't have to do it the recommended way.