I'm having trouble trying to get JavaScript to show up on a Joomla! article using the TinyMCE editor. I've set all the settings I should based on Google searches and it's still not showing. The JavaScript code is commented out as shown in screenshots below.
Any help is greatly appreciated. TQ!
Though many WYSIWYG editors claim <script> support, I would suggest using the "None" editor when adding the JavaScript code to your posts. I use Switch Editor to quickly change editors. After installing and activating the package:
Switch to "None" editor
Open the article
Add the embed code
Save the article
Switch back to your favorite WYSIWYG editor to edit other articles
This will give you the least problems. Unfortunately, the package is only available for Joomla! 2.5+. However, there is an alternative here:
http://www.joomler.net/download/81-joomla15-plugin/959-editor-switcher-for-joomla15-released.html
On a side note, you should upgrade your site away from Joomla! 1.5 ASAP!
I am using ckeditor in a Rails4 project. I have tried both the ckeditor gem and the ckeditor_rails gem to provide the ckeditor libraries.
There are multiple posts here by people wanting to remove the ckeditor context menu so that the native browser context menu can be displayed.
This is usually to enable the browser spellchecker to be used rather than the ckeditor paid / advertised spellchecker.
how-to-remove-contextmenu-in-ckeditor-4-3
ckeditor-3-6-3-enable-browser-spellcheck-and-disable-context-menu
how-to-disable-ckeditor-context-menu/20229730#20229730
The third link has the most replies but none of them are universally accepted.
Generally the reply is to remove the contextmenu plugin by placing the following in the ckeditor config.js
config.removePlugins = 'contextmenu';
There is also the suggestion that contextmenu is a dependency on other plugins and different people add a multitude of other plugins to be removed as well.
One helpful post suggests running the following code in the console to establish the dependencies.
$.each(CKEDITOR.plugins, function(k, v){
v.requires && console.log("Plugin '" + k + "' requires: " + v.requires)
})
This seems to work well and suggests that tabletools and liststyle plugin is dependent on contextmenu. So we end up with
config.removePlugins = 'liststyle,tabletools,contextmenu';
Unfortunately this does not disable the context menu in the version of ckeditor that I am using (4.4.6 established by adding alert(CKEDITOR.version) in the config.js)
Finally there is a suggestion to use the following code in config.js
CKEDITOR.on('instanceReady', function(ev) {
ev.editor.editable().addClass('cke_enable_context_menu')
});
There is no suggestion as to how this is meant to disable the context menu but in any case it makes no difference for me.
For me this is a showstopper as the ckeditor context menu hides the browser spelling suggestions and the cut and paste options it contains do not actually work but just bring up the browser dialog.
Your browser security settings don't permit the editor to
automatically execute copying operations. Please use the keyboard for
that (Ctrl/Cmd+C).
In all other aspects ckeditor does seem to be the best functioning editor out there.
In my Drupal 7 environment, loading ckeditor from the CDN, current version is 4.11.4.
The only thing that worked for me after many failed alternatives:
config.removePlugins = 'liststyle,tableselection,tabletools,tableresize,contextmenu';
For convenience, I put this in the module configuration settings -> Advanced -> Custom JavaScript configuration, but in my experience the same result can be achieved in the ckeditor.config.js file in the module folder.
(It's just more likely to get accidentally overwritten there, when updating the module. ... you could also do it by checking the option to use the config.js file in your theme and then adding the line above to that file.)
As simple as that:
CKEDITOR.replace( 'textarea', {
removePlugins: 'contextmenu,tabletools'
} );
If it does not help you, you must include a valid sample to reproduce the issue because something exotic is going on in your setup.
If anyone is looking on how to disable the context menu and have access to the native browser spellchecker in CKEditor:
CKEDITOR.replace( 'editor1', {
removePlugins: 'contextmenu,liststyle,tabletools,tableselection',
disableNativeSpellChecker: false
} );
(tested on CKEditor 4.7.0, standard package)
When im using the tinymce in wordpress, I like to use the visual editor to add color and font styles and things, and then sometimes I like to get right in there and do a little html editing so the post turns out out I like it. But I notice now that wordpress updated to tinymce 4.0 that every time I switch between the visual editor and the html editior my br tags are removed. I know theres lots of tips on how to fix this out there but I think they are meant for earlier versions on tinymc since none of them seem to work for me, even the plugins out there don't seem to work ...
Any Thoughts ?
Install ckeditor plugin for wordpress and then you can use source mode provided by ckeditor.
I've been working on a custom page in Sitecore over the holidays, and I've noticed an issue where Sitecore removes JavaScript lines from the editor.
Here's an overview of my current scenario:
I add Javascript to the page.
I save, check in, and publish.
Changes are there, and everything is working.
I work on it later and those changes are no longer there.
I'm the only one who's edited this page, and it is publishing the current/correct version. It doesn't matter if I add the script through the "Show Editor" or "Edit HTML" features of the content editor. It only removes the JavaScript though; all of my other changes are intact.
Is there something that I'm missing about Sitecore's implementation of JavaScript? I'm not sure what else to do in order to diagnose it, so I was hoping someone here would have an explanation for this.
Removing the script-tags in the RTE in Sitecore is standard behavior when the item is saved.
However, in Sitecore 6.4.1 rev. 120113 and Sitecore 6.5 Update-4 there is a new property added in the web.config:
<setting name="HtmlEditor.RemoveScripts" value="true"/>
Setting this value to false should solve your problem.
If you are using an older version of Sitecore, take a look at this blogpost which shows a workaround for older versions.
Are you adding this javascript in a Rich Text Editor?
I've seen the rich text editor strip out javascript as it saves. We have typically added javascript blocks in as a separate sublayout pulling from a multi-line text field and having it render out directly, rather than editing javascript through the rich text editor.
I've created a page with CSS. Now I must change from my editor to my browser and refresh the full page, just to have a look at every little change. But I don't want to refresh the page, because I have some animations.
So is there anything which I can use that my site updates automatically after a CSS update?
Maybe with JavaScript, jQuery, Ajax or something?
Here you are: http://cssrefresh.frebsite.nl/
CSSrefresh is a small, unobstructive javascript file that monitors the CSS-files included in your webpage. As soon as you save a CSS-file, the changes are directly implemented, without having to refresh your browser.
Just insert the javascript file and it works!
But note: It only works when you have the files on a server!
Edit: LiveStyle
If you develop with Sublime Text and Google Chrome or Apple Safari, then you should use Emmet LiveStyle. This is a more powerful Live CSS-Reloader.
Now I use it instead of CSS Refresh.
If you want more information about this awesome plugin, please read the Post by Smashing Magazine
With jQuery you can create a function that reloads external stylesheets.
/**
* Forces a reload of all stylesheets by appending a unique query string
* to each stylesheet URL.
*/
function reloadStylesheets() {
var queryString = '?reload=' + new Date().getTime();
$('link[rel="stylesheet"]').each(function () {
this.href = this.href.replace(/\?.*|$/, queryString);
});
}
Have a look at http://livereload.com/.
It works as a browser plugin for OS X and windows. I like it because I do not have to embed additional javascript which I could accidentally commit in my versioning control.
I find browser plugins/extensions to be the easiest solution. They don't require any code changes to your individual sites. And they can be used for any site on the web — which is useful if I modify something in-memory real quick to hide a toolbar or fix a bug temporarily; once finished mucking with it, I can press a key and all the CSS is back to normal.
Once installed, (most) CSS reloaded plugins/extensions don't reload the CSS automatically. But usually work with something as simple as a toolbar button, a context menu item, and/or a simple key press to reload the CSS. I find this method is less error prone anyway, and is much less complicated then some of the automated solutions out there.
Some examples (feel free to suggest some others):
Chrome:
tin.cr (includes automatic reload, and can persist in-browser changes to source files)
CSS Refresh
Firefox:
CSS Reloaded
CSS Refresh
Here is my little Project. Please give it a try
CSS Auto reload on Github
Yes you can manipulate the CSS via jQuery:
$(".classToBeReplaced").switchClass( "classToBeReplaced", "newClass", 1000 );
You could also use the toggleClass method.
http://api.jquery.com/toggleClass/
http://jqueryui.com/demos/switchClass/
Firebug for FireFox.
It's a plugin in an attached/separate window. Changes to HTML/CSS appear instantly, elements are highlighted.
Advantage over JS hacks is that you can't copy this accidentally to your production instance.
You are looking for Live Reload:
It's available as a browser extension and easy to implement
http://livereload.com/
The new open-source code editor, brackets, has a Live Development feature where you can edit CSS in the editor and it will immediately be reflected in the chrome browser. It currently only works for CSS editing, but HTML editing is coming soon!
Firebug for Firefox is my prefered method:
https://addons.mozilla.org/de/firefox/addon/firebug/
You can edit HTML and CSS on the fly, quickly deactivate CSS rules (without deleting them), add or remove HTML and so on. If you wan't to tweak your design this is your choice. You can even save changes to a local copy, but I hardly ever use that feature.
If you are using Firefox then you can install Web Developer Toolbar 1.2.2 from Add-on of Firefox which has option of Reload Linked Stylesheets.
Try using CSS Brush, a chrome plugin for creating CSS live. You needn't have to write all CSS in a text editor, come back to browser and reload it, rather write the CSS live as if you were doing it in a text editor. You will have more features than a text editor here like context-sensitive-menu, use duplicate properties, select complete CSS path or a filtered path of a element directly from the page.
This might help -> chaicode
Its a live CSS, Javascript and HTML editor that is opensource and a wip.
github