How to insert custom Javascripts in Sitecore backend - sitecore

Pretty simple, I need to insert a script in Sitecores (v. 6.4) backend - how do I do it?
It doesn't matter if the script is placed inside <head> or <body>, nor does it matter if I can only specify the src of a <script> tag or if I can insert an actual Javascript snippet (the latter is preferable though).
The script needs to be inserted in the HTML when a Content Editor window is opened.
It is not an installation of my own, nor do I develop anything for Sitecore (I do have admin access, however), so something along the lines of installing a plugin would be the best solution I reckon.
I've previously inserted the script in Sitecore 5.4, but not in a pretty way (editing XML files) and if a better solution could be found here too, that'd be pretty great.
Update using Jens Mikkelsens answer in Sitecore Xpress 6:
I tried placing the following in web.config:
<clientscripts>
<everypage>
<script src="/test.js" language="javascript" />
</everypage>
<htmleditor>
<script src="/test.js" language="javascript" />
</htmleditor>
</clientscripts>
Being a little bit overzealous (and wanting to make sure the test.js file can be found) I put a js.test in the following locations:
inetpub\wwwroot\SitecoreWebsite\WebSite\sitecore\shell\Applications\Content Manager\
inetpub\wwwroot\SitecoreWebsite\WebSite\sitecore\shell\Applications\
inetpub\wwwroot\SitecoreWebsite\WebSite\sitecore\shell\
inetpub\wwwroot\SitecoreWebsite\WebSite\sitecore\
inetpub\wwwroot\SitecoreWebsite\WebSite\
Content of the test.js:
alert("Test [PATH TOKEN]");
Where the path token is just the parent folder name, so I know which test.js was loaded, e.g. inetpub\wwwroot\SitecoreWebsite\WebSite\sitecore\shell\Applications\Content Manager\test.js holds:
alert("Test Content Manager");
When I try to log in using the default Xpress admin user one of three things happens (in all three cases the frontend loads without errors, but no script present. I have NOT been able to determine when the errors happen, the only thing I can say for sure is that no errors occur when the test.js has not been included in web.config):
Case 1:
The content editor loads as expected, but no script is loaded. This happens most of the time when the clientscript have been included.
Case 2 - Server Error:
Server Error in '/' Application.
Exception Details: System.ArgumentException: Empty strings are not allowed.
Parameter name: value
Stack Trace:
[ArgumentException: Empty strings are not allowed.
Parameter name: value]
Sitecore.Diagnostics.Assert.ArgumentNotNullOrEmpty(String argument, String argumentName) +241
Sitecore.Web.UI.HtmlControls.PageScriptManager.GetEveryPageScripts() +410
Sitecore.Web.UI.HtmlControls.PageScriptManager.GetScripts() +702
Sitecore.Web.UI.HtmlControls.Page.OnInit(EventArgs e) +62
System.Web.UI.Control.InitRecursive(Control namingContainer) +143
System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1477
Case 3 - Sitecore error:
A required license is missing
Most likely causes:
The resource you are trying to access requires the following license: Runtime.
I'm not sure whether or not Xpress simply doesn't support clientscripts, but even if it doesn't it is weird that some times the content editor loads.
Update after testing in Sitecore 5.4 full version:
It does indeed work to put a script tag inside the <clientscripts> section in web.config as Jens Mikkelsen answered. It is, however, neccessary to put it inside the subsection <everypage> to get it to appear on every single page in the backend, whereas <htmleditor> only works for the Telerik RadEditor popup window in Sitecore 5.4.
Update after testing in Sitecore 6 full version:
The same method as described for Sitecore 5.4 works for Sitecore 6 with the addition of little thing: <script> embedded in <clienscripts> now require a key attribute:
<clientscripts>
<everypage>
<script src="/test.js" language="javascript" key="test script" />
</everypage>
</clientscripts>

I don't think you will be able to add the script with out modifying a file. However you can take a look at the <clientscripts> section in the web.config. There you can add scripts to be loaded. However I don't know if it will only load in the content editor.
I have experimented with this before, and I ended up using the above setting, but as I remember it also loaded on the Page Editor and the Desktop.

Perhaps you can use this example code to add controls to the <head> on the front-end but instead alter it to use the <renderContentEditor> pipeline to somehow inject a new <script> tag into the editor.

here is a good example of it Injecting javascript and css to Sitecore Content Editor Page

Related

javascript file loading problem in a web browser, relating to mime types, context Django debug_toolbar concerning Django/debug_toolbar versions >=3.X

I have noticed, at some point last year, that the debug_toolbar is not present anymore. Now I have found the problem, but do not actually completely understand what is happening and why. [Update: I have found an answer - see the last few paragraphs ]
The initial information is that I tried a lot of different version combinations for Django/delug_toolbar and there were no problems as the version number of both started by 2.
However, the toolbar is not showing itself if a version number starts by 3. The toolbar 2.2 should work with Django version 3 or larger also.
Now I have located the problem to be that toolbar.js is not loaded. There is a message in the developer tool's console:
:8001/static/debug_toolbar/js/toolbar.js:1 Failed to load module script: The server responded with a non-JavaScript MIME type of "text/plain". Strict MIME type checking is enforced for module scripts per HTML spec.
So I found the location of the toolbar.js under the static files folder of the debug_toolbar.
The file is loaded in a template base.html (in folder env\Lib\site-packages\debug_toolbar\templates\debug_toolbar)
There is a line:
<script type="module" src="{% static 'debug_toolbar/js/toolbar.js' %}" async></script>
But I do not understand why type="module" is preventing the browser to load and use the toolbar.js?
There was a section in the (https://readthedocs.org/projects/django-debug-toolbar/downloads/pdf/stable/) Django Debug Toolbar manual that said in case of the problem with mimetypes the user should edit Windows registry.
"1.6 Troubleshooting
On some platforms, the Django runserver command may use incorrect content types for static assets. To guess content types, Django relies on the mimetypes module from the Python standard library, which itself relies on the underlying platform’s map files. If you find improper content types for certain files, it is most likely that the platform’s map files are incorrect or need to be updated. This can be achieved, for example, by installing or updating the mailcap package on a Red Hat distribution, mime-support on a Debian distribution, or by editing the keys under HKEY_CLASSES_ROOT in the Windows registry"
Could someone please give me an explanation for what is going on here? I tried to find if there was any discussion about this problem with these new Django/Django Debug Tool versions but there was nothing to be found. The other discussion was concerning about the earlier versions.
Do I have a security setting of a browser (etc) that is causing the problem as there is no question about the people that have made the Debug toolbar would have implemented their code/settings not to work at all? I have tried Firefox/Edge/Chrome and the issue is in all of them.
I found a tip from another question.
By adding
if DEBUG:
import mimetypes
mimetypes.add_type("application/javascript", ".js", True)
to settings.py causes that the toolbar.js is loaded.
That addition solved the whole problem. There is no need to do anything for the Windows registry.
The discussion can be found here:
Failed to load module script: The server responded with a non-JavaScript MIME type of "text/plain". Strict MIME type checking i
So my question was in fact a duplicate.

Foundation 6 Responsive Toggle nav not working

I am doing my first project in Foundation 6 and am having trouble getting the responsive navigation to work. I started with the basic page template that comes with Foundation (installed F6 using CodeKit) then I pasted in the responsive menu code exactly as it appears here http://foundation.zurb.com/sites/docs/responsive-navigation.html#responsive-toggle but when viewed at small screen sizes, the word "menu" appears, but clicking it does nothing.
The Drilldown responsive menu also does not work -- pasted in the drilldown menu code (second example down, on the page referenced above) and what appears is a long long list of links, nothing is collapsed and nothing slides in. There must be a script missing but I have triple-checked and app.js, foundation.js and jquery scripts are loaded. What else am I missing?
First of all sorry for my bad English, did you initialize foundation's javascript?
That can be done with the following code in youre custom javascript file:
$(document).foundation();
I do it with jQuery like this:
$(document).ready(function() {
$(document).foundation();
});
for more information see: Foundation-6 documentation - initializing
and please check if you have the proper file structure for the foundation files, please see the following documentation: Foundation-6 documentation - File Structure
tl;dr: Faulty purifycss configuartion in the gulp.babel.js file.
I also had this problem. My setup:
generator-webapp
webapp's jade recipe
I can get the responsive dropdown menu to work by using the tab and enter key. This means that the relevant js files are being loaded correctly. The navigation 'burger' also does not appear.
Upon using the chrome dev tools to inspect the responsive dropdown menu example from the foundation website, I noticed that style of <button class="menu-icon" type="button" data-toggle=""></button> is being effected by the .menu-icon CSS rule from the scss partial, _menu-icon.scss. Mine wasn't. When I looked, the foundation.scss file from the app/ has the exact same style rule. The converted foundation.css was being served from the .tmp/ folder, but did not have the .menu-icon CSS rule. Then I suspected purifycss again (which I had commented out of the gulp file before and forgot to reset the gulp serve, saw no fix and thus falsely excluded the purifycss rule from the list of suspects).
I set my gulp styles task up like this:
gulp.task('styles', () => {
return gulp.src('app/styles/*.scss')
.pipe($.plumber())
.pipe($.sourcemaps.init())
.pipe($.sass.sync({
outputStyle: 'expanded',
precision: 10,
includePaths: ['.']
}).on('error', $.sass.logError))
.pipe($.autoprefixer({browsers: ['> 1%', 'last 2 versions', 'Firefox ESR']}))
/*Stupidly assumed that purifycss supported jade files as src files*/
.pipe($.purifycss(['app/**/*.js', 'app/*.jade']))
.pipe($.sourcemaps.write())
.pipe(gulp.dest('.tmp/styles'))
.pipe(reload({stream: true}));
});
Which meant that the necessary styles were being deleted (including .menu-icon). I think I will use stylperjade or rearrange the tasks so that I can do this: .pipe($.purifycss(['app/**/*.js', '.tmp/*.jade']))\
Let me know if this was your solution as well

wrong result from cfmodule with firefox

In coldfusion 8, I used bellow code to view "UserDesc"field data from database table that is working on well IE and chrome but not on Firefox. On firefox it does not display on fckeditor,but shows on textarea. please suggest any change in code.
<cfmodule
template="fckeditor/fckeditor.cfm"
basePath="../views/fckeditor/"
instanceName="Question"
value='#UrlDecode(UserDesc)#'
width="530"
height="260">
There are a few newer ways to use the ckeditor in Coldfusion. You can just use the following (this may be cf9+ only, i'm not sure):
<cftextarea name="Question" id="Question"
richtext="yes"
value="#UrlDecode(UserDesc)#">
</cftextarea>
Or you could just use the javascript one as demo'd here (this should work for any version of coldfusion): http://ckeditor.com/demo You would just have to put your value in between the opening and closing text area tags.

Change ticket display in Trac

With default template, trac ticket is available for viewing only, I must click modify to expand properties tab to modify, change state of a ticket.
Now I want to expand that tab automatically? How can I change it quickly without changing the template itself?
Is it possible to change it with trac.ini file?
I cannot find where's location of default template to change, so I cannot change myself.
Thanks!
I think the best way to enable the behavior you're looking for is to add a custom JS file (which can be injected much like a custom CSS, read TracInterfaceCustomization).
In that file do this:
$(document).ready(function() {
window.setTimeout(function() {
$("#modify").parent().removeClass('collapsed')
}, 0);
});
This code is untested but it should give you the idea. Basically we need to wait until the DOM is ready ($(document).ready) but as there are multiple JS functions called during that event, the setTimeOut sets a slight delay to make sure that the collapse command went through before.
HTH from a professional Trac developer :-)
I'm using trac 0.12 and had the same issue.
...without changing the template itself
I couldn't find a option to configure it but I did notice if you click the "modify" quick link at the top right of the ticket then the "Modify Ticket" foldable area is automatically uncollapsed for you.
I know you didn't ask for it, but just in case, you want a horrible template hack...
Open the template file in editor, e.g. for me in CentOS 5.5:
sudo emacs /usr/lib/python2.4/site-packages/Trac-0.12-py2.4.egg/trac/ticket/templates/ticket.html
Comment out the jQuery line that triggers the modify section to collapse on page ready:
//$("#modify").parent().toggleClass("collapsed");
I found the edit didn't take effect straight away - perhaps the template is cached or something? It worked after a few minutes of shift-refreshing and restarting apache.
Lets hope someone else answers with a better solution...
This is basically Schwarz's answer but in a simpler form
To get ticket contols expanded on load do following. Put following code
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:py="http://genshi.edgewall.org/"
py:strip="">
<!--! Add site-specific style sheet -->
<head py:match="head" py:attrs="select('#*')">
${select('*|comment()|text()')}
<script type="text/JavaScript">
<!--
// EXPAND TICKET CONROLS ON LOAD.
jQuery(document).ready(function() {
window.setTimeout(function() {
$("#modify").parent().removeClass('collapsed')
}, 1);
});
//-->
</script>
</head>
<body py:match="body" py:attrs="select('#*')">
${select('*|text()')}
</body>
</html>
in /path/to/your/trac/project/templates directory in file site.html.

Cannot find CFML template for custom tag

I am not a ColdFusion coder. Doing a favor for a friend who ported his CF site from a Windows server to Unix on GoDaddy.
Site is displaying error:
Cannot find CFML template for custom tag jstk. ColdFusion
attempted looking in the tree of installed custom tags but did not
find a custom tag with this name.
The site as I found it has at document root /CustomTags with the jstk.cfm file and a set of files in cf_jstk
My Googling located this:
You must store custom tag pages in any one of the following:
The same directory as the calling page;
The cfusion\CustomTags directory;
A subdirectory of the cfusion\CustomTags directory;
A directory that you specify in the ColdFusion Administrator
So I have:
Tried creating placing /CustomTags in /cfusion/CustomTags
Tried copying /cfusion/CustomTags to above document root
Tried copying jstk.cfm and subfolders into same directory as calling file(index.cfm)
Update: Per GoDaddy support I have also tried adding the following to no effect: <cfmodule template="CustomTags/jstk.cfm">
Can any one give me some tips on this or should I just tell my guy to look for a CF coder?
Thanks!
I don't know how GoDaddy is setup, so as a quick test, please do the following:
Create file test.cfm in the webroot with contents:
<cf_testtag/>
<cfoutput>test</cfoutput><cfabort/>
Create file testtag.cfm in the webroot with contents:
<cfdump var=#ThisTag# />
Then in a browser visit the test.cfm page.
You should get two debug dumps, followed by the 'test'; this will confirm that custom tags in general are working.
If that works move the testtag.cfm to the CustomTags directory, and see if you get the same behaviour or an error.
If this produces an error, for CF8 and above, you can add <cfset This.CustomTagPaths = "/CustomTags" /> inside the Application.cfc file (assuming there is a App cfc and not an Application.cfm) to ensure that directory is checked for tags.
It is possible to convert Application.cfm to Application.cfc - how easy this is depends on how complex the code is in there - might be something you could figure out, or might need an experienced CF dev, it depends.
Depending on the outcome of this, we can attempt to debug why the jstk tag isn't working (unless one of the above solves it).
In an effort to check the simple things before worrying about complex things:
Remember that filenames on *nix systems are case sensitive, but on windows are not.
For example, a windows server will pick up "application.cfm" but a linux server won't. It requires "Application.cfm".
Check to make sure all filenames/paths are the correct case.
Normally, CFML check every custom tags in current directory first, if not found, second is in CFMX8/customtags/.