Adding Tools to format html text to a simple cms

Posted on 2010-01-09
Medium Priority
Last Modified: 2013-12-12
i have a simple cms

1text box + 1 submit btn
info from that form is saved through php to a sql database

is it possible to add tools above the html text box so that the user of the cms can format the text (bold, italic...)
without having to write html code?
Question by:zahimezher
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions

Expert Comment

ID: 26272439
you can add a wysiwyg editor (usually javascript) to your form.
there are a few around... while i haven't used it yet, i found one at http://www.openwebware.com/ that ought to do what you want to.
LVL 14

Expert Comment

ID: 26272518
Please download the following


unzip the folder and add to your root repository of your site....

add the following attached code as JS

apply the id to the textarea of your html

<textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 80%">      

Hope this will help...



<script type="text/javascript" src="../jscripts/tiny_mce/tiny_mce.js"></script>

<script type="text/javascript">
		// General options
		mode : "textareas",
		theme : "advanced",
		plugins : "safari,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",

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

		// Example content CSS (should be your site CSS)
		content_css : "css/content.css",

		// Drop lists for link/image/media/template dialogs
		template_external_list_url : "lists/template_list.js",
		external_link_list_url : "lists/link_list.js",
		external_image_list_url : "lists/image_list.js",
		media_external_list_url : "lists/media_list.js",

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

Open in new window

LVL 111

Expert Comment

by:Ray Paseur
ID: 26273568
I've used TinyMCE and it works very well.  However (and this is a BIG however) you want to look out for two things.

Thing 1: The client computer has to run a lot of JS.  If the client machine is not a modern PC (Last couple of years, I'd guess) it may be too slow to give decent response time.  

Thing 2: Your user community must not cut / paste from a Microsoft Word document, of you may get a horrible mess of invalid HTML in your data base.  My only solution to this, so far, has been to tell the clients that they must use a plain-text editor as an intermediate step.   I have not come up with a programmatic answer to the issue.

Best of luck with it, ~Ray
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!


Author Comment

ID: 26283458
so after installing any of the above the text is saved to sql with the html formating tags? and then flash reads the html text and displays it as html?

Author Comment

ID: 26290950

i installed teh editor and it seems to save the tewxt to the sql database with teh html tags just fine but when i open the swf that reads from the db it reads it as plain text and with out the css rendering although i set the dynamic textbox as html text box

any idea why ?

:( thanx in advance

Author Comment

ID: 26290957
this is the script that reads the sql db for the swf


var lv:LoadVars = new LoadVars();

lv.onLoad = function(success:Boolean) {
  if (success) {
     sites_txt.htmlText = this["title"];
  } else {
    sites_txt.text = "FAILED";

lv.load(" reads mysql/sites.php");

php file

mysql_pconnect ("localhost", "zahi", "zahi");

mysql_select_db ("fla");
$qResult = mysql_query ("SELECT title FROM sites LIMIT 1");  
$row = mysql_fetch_array($qResult);
$stringToFlash = '&title='.$row['title'];
echo $stringToFlash;

LVL 14

Accepted Solution

Kalpan earned 2000 total points
ID: 26291031

You need to use the object embed tag to display/render the swf on your page...use the following...

$code = '<object type="application/x-shockwave-flash" style="width:425px; height:350px;"
                        data="http://www.youtube.com/v/7_6B6vwE83U"><param name="movie" value="http://www.youtube.com/v/7_6B6vwE83U" /></object>';

it should

$swfurl = $url_from_db;;

$code = '<object type="application/x-shockwave-flash" style="width:425px; height:350px;"
                        data="http://www.youtube.com/v/7_6B6vwE83U"><param name="movie" value="'.$swfurl.'" /></object>';

Please add the swfobject.js with your tinyMCE installation....

try using the CMS modx http://modxcms.com/download/

Hope that will work for you...



<script src="[(base_url)]assets/js/swfobject.js" type="text/javascript"></script>

Open in new window


Author Closing Comment

ID: 31675973
thanx a million but i didnt understand a thing from that last comment ;)

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
These days socially coordinated efforts have turned into a critical requirement for enterprises.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses

764 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