How to make a simple text editor with jQuery, PHP and Bbcode?

Asked

Viewed 8,997 times

1

How can I format text in a textarea with Bbcode?
Like, create a mini text editor with shortcuts to paragraph, bold, center, these basic options, nothing too custom.

  • 1

    This question in the way it is is very broad, and will probably be closed as such. Try to be more specific: is your issue client-side editing, or server integration? What types of text are you dealing with, common text with formatting, code, something else? have you ever tried to use a tool, but failed and/or found it unsatisfactory (for reasons X and Y)? The more context you can provide, the better.

  • http://www.linhadecodigo.com.br/artigo/1080/javascript-construindo-editor-de-texto.aspx has a lot of information on the above link website.

1 answer

6


I suggest looking for an editor already ready, because it is a common feature is easier than reinventing the wheel. A quick search led me to Sceditor, which seems to have everything you need. Open the site and in the demo click on the last button ("View source"): this will switch between the mode WYSIWYG and the BB code mode.

This editor is free software (MIT license), so you can integrate it into your system without hindrance. To use it, simply include the necessary scripts and style sheets (choose the mode with BB code support):

<script type="text/javascript" src="jquery.min.js"></script>
<link rel="stylesheet" href="minified/themes/default.min.css" type="text/css" media="all" />
<script type="text/javascript" src="minified/jquery.sceditor.bbcode.min.js"></script>
<script src="languages/pt-BR.js"></script>

And call the plugin in its element (textarea), passing the options desired:

$("#meu_textarea").sceditor({
    plugins: "bbcode",
    style: "minified/jquery.sceditor.default.min.css",
    locale: "pt-BR"
});

Here is the API. To get the value the user typed, one can simply use val in the textarea or a specific method which may turn BB code into HTML for you or vice versa (caution: may or may not have security implications).

  • Thanks, but I thought I could learn to create a basic good by myself so as not to have to depend on third party programs :s. Obg in the same.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.