Solved

how to get tinymce to load resources via base protocol (http OR https)?

Posted on 2011-02-24
2
715 Views
Last Modified: 2012-05-11
how do i get tinymce 3.3.9.3 to load resources via base protocol (http OR https, depending on what the calling page is using)?

at the moment, as soon as the tinymce editor from moxiecode finishes loading - it gives the following alert in firefox 3.6.13:

You have requested an encrypted page that contains some unencrypted information. Information that you see or enter on this page could easily be read by a third party.
[ x] Alert me whenever I'm about to view an encrypted page that contains some unencrypted information.


currently i leave this option checked, because it is bad practise to use unencrypted resources in an encrypted page and i need to be aware of whenever this happens.

unfortunately i have not been able to locate a related solution to my problem via google, therefore i need to ask the following:

suggested changes (replace strings "http" with "https" in tiny_mce.js) did not work.  the screencast demonstrates the loading of the page, therafter the tinymce 3.3.9.3 plugin - then the alert from firefox 3.6.15.

what would i have to change within the latest stable version of tinymce (v 3.3.9.3) so it's resources are loaded via the base protocol of the page (wether http OR https)?
<!-- included in a "configuration manager" page as follows: -->
<script language="javascript" src="public/tinymce/jscripts/tiny_mce/tiny_mce.js" defer="defer"></script>
<script language="javascript" src="scripts/ajax_config.js" defer="defer"></script></head>

<!-- and in a "prospecting manager" page as follows: -->
<script language="javascript" src="public/tinymce/jscripts/tiny_mce/tiny_mce.js" defer="defer"></script>
<script language="javascript" src="scripts/ajax_prospects.js" defer="defer"></script>

<!-- both pages are intended to be served via ssl over https. -->

// the following loads the tinymce plugin in both pages' javascripts:

// TinyMCE
tinyMCE.init({
	// General options
	mode : "exact",
	elements : "textarea_fulltext",
	theme : "advanced",
	plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist",

	// Theme options
	theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,cut,copy,paste,pastetext,pasteword,|,charmap,emotions,iespell",
	theme_advanced_buttons2 : "styleselect,formatselect,fontselect,fontsizeselect|,insertdate,inserttime,preview",
	theme_advanced_buttons3 : "search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image",
	theme_advanced_buttons4 : "tablecontrols,|,hr,removeformat,visualaid",
	theme_advanced_buttons5 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,restoredraft",
	theme_advanced_buttons6 : "sub,sup,|,forecolor,backcolor,|,media,advhr,|,code,print,|,ltr,rtl,|,fullscreen,|,cleanup,help",
	theme_advanced_toolbar_location : "top",
	theme_advanced_toolbar_align : "left",
	theme_advanced_statusbar_location : "bottom",
	theme_advanced_resizing : true,

	// Forced options
	force_br_newlines : true,
	force_p_newlines : false,
       forced_root_block : 'p',

	// Example content CSS (should be your site CSS)
	content_css : "styles/mailers.css?" + new Date().getTime(),

	// Style formats
	style_formats : [
		{title : 'Float Left', inline : 'div', classes : 'colleft'},
		{title : 'Float Right', inline : 'div', classes : 'colright'},
		{title : 'Clear Black', inline : 'div,p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'cleart'},
		{title : 'Clear Grey', inline : 'div,p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'clearb'}
	],

	formats : {
		alignleft : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'left'},
		aligncenter : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'center'},
		alignright : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'right'},
		alignfull : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'full'},
		bold : {inline : 'span', 'classes' : 'bold'},
		italic : {inline : 'span', 'classes' : 'italic'},
		underline : {inline : 'span', 'classes' : 'underline', exact : true},
		strikethrough : {inline : 'del'}
	},

	// Replace values for the template plugin
	template_replace_values : {
		username : "Some User",
		staffid : "991234"
	}
});
// TinyMCE

Open in new window

intellisource-413092.flv
0
Comment
Question by:intellisource
  • 2
2 Comments
 

Accepted Solution

by:
intellisource earned 0 total points
ID: 34968615
ohhh!!!
the css file to style the tinymce window contents (attached), was loading the background image via http!
DOH! :P
fixed by setting it to load from an absolute path, without the domain name and working without the security alert now :D
mailers.css
0
 

Author Closing Comment

by:intellisource
ID: 34968638
remember to look at all urls referencing resources OUTSIDE of tinymce! 3.3.9.3 works wonderfully :D
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article you will learn how to create a free basic website on Bitbucket, a git service provider. Polymer creates dynamic HTML components, which allow more flexibility than static HTML. This tutorial uses Ubuntu Linux but can also be done on W…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The purpose of this video is to demonstrate how to set up the WordPress backend so that each page automatically generates a Mailchimp signup form in the sidebar. This will be demonstrated using a Windows 8 PC. Tools Used are Photoshop, Awesome…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

773 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question