Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » редакторы BB кода или WYSIWYG

Модерирует : Cheery

 Версия для печати • ПодписатьсяДобавить в закладки

Открыть новую тему     Написать ответ в эту тему

rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
а подскажите есть какой-то расширенный BB редатор или визуальный, НО чтобы там были тэги CODE и QUOTE ? с инструкцией?
так как на этом форуме?
(чтобы велосипед не изобретать)
 
я посмотрел исходники форума одного, но что-то не разобрался там не было инструкции




Когда научимся писать без ошибок? /Cheery/

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 07:23 21-09-2009 | Исправлено: Cheery, 02:55 22-09-2009
Delta RuBoard



Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору

Код:
    <style>
            input.ed_buttons
            {
                background: #000000;
                width: 22px;  
                border: 0px;
                height: 22px;  
                cursor: hand;
                border: 1px dotted b0b0b0;  
                margin-bottom: 3px;
                font-face: Verdana;
                font-size: 17px;
                font-weight: bold;
                color: red;
            }
    </style>
            
    <script>
    // Load Quicktags JavaScript
        var edButtons = new Array();
        var edSmiles = new Array();
        var edOpenTags = new Array();
    
        function edButton(id, display, tagStart, tagEnd, access, open, image) {
            this.id = id;                // used to name the toolbar button
            this.display = display;        // label on button
            this.tagStart = tagStart;     // open tag
            this.tagEnd = tagEnd;        // close tag
            this.access = access;        // access key
            this.open = open;            // set to -1 if tag does not need to be closed
            this.image = image;            // set to -1 if tag does not need to be closed
        }
        function edSmile(id, title) {
            this.id = id;                // used to name the toolbar button
            this.title = title;                // used to name the toolbar button
        }
    
        // Start code
        function edShowButton(button, i) {
            if (button.id == 'ed_img') {
                document.write('<input type="button" style="background: url(templates/default/img/buttons/' + button.image + '.gif);" id="' + button.id + '" accesskey="' + button.access + '" class="ed_buttons" onclick="edInsertImage(edCanvas);"> ');
                document.write(' <span style="font-size: 20px; color: e0e0e0;">|</span> ');
            }
            else if (button.id == 'ed_link') {
                document.write('<input type="button" style="background: url(templates/default/img/buttons/' + button.image + '.gif);" id="' + button.id + '" accesskey="' + button.access + '" class="ed_buttons" onclick="edInsertLink(edCanvas, ' + i + ');"> ');
            }
            else {
                document.write('<input type="button" style="background: url(templates/default/img/buttons/' + button.image + '.gif);" id="' + button.id + '" accesskey="' + button.access + '" class="ed_buttons" onclick="edInsertTag(edCanvas, ' + i + ');" > ');
                if (button.id == 'u' || button.id == 'right' || button.id == 'quote')
                    document.write(' <span style="font-size: 20px; color: e0e0e0;">|</span> ');
            }
        }
    
        function edShowSmile(smile, i) {
            document.write('<td width=40 style="border: 1px dotted #c0c0c0;" nowrap align="center" valign="center" onclick="edInsertContent(edCanvas, \'' + smile.title + '\');"><img src="templates/default/img/smiles/' + smile.id + '.gif" title="' + smile.title + '"  id="' + smile.title + '"></td>');
            if ((i+1)%4 == 0 && (i+1) != 36)
            document.write('</tr><tr height=40>');
        }
        
        function edAddTag(button) {
            if (edButtons[button].tagEnd != '') {
                edOpenTags[edOpenTags.length] = button;
                document.getElementById(edButtons[button].id).value = 'X' + document.getElementById(edButtons[button].id).value;
            }
        }
    
        function edRemoveTag(button) {
            for (i = 0; i < edOpenTags.length; i++) {
                if (edOpenTags == button) {
                    edOpenTags.splice(i, 1);
                    document.getElementById(edButtons[button].id).value = document.getElementById(edButtons[button].id).value.replace('X', '');
                }
            }
        }
    
        function edCheckOpenTags(button) {
            var tag = 0;
            for (i = 0; i < edOpenTags.length; i++) {
                if (edOpenTags[i] == button) {
                    tag++;
                }
            }
            if (tag > 0) {
                return true; // tag found
            }
            else {
                return false; // tag not found
            }
        }    
    
        function edCloseAllTags() {
            var count = edOpenTags.length;
            for (o = 0; o < count; o++) {
                edInsertTag(edCanvas, edOpenTags[edOpenTags.length - 1]);
            }
        }
    
        function edToolbar() {
            document.write('<span id="ed_comment_toolbar">');
            for (i = 0; i < edButtons.length; i++) {
                edShowButton(edButtons[i], i);
            }
            document.write('<input type="button" id="ed_close" style="background: url(templates/default/img/buttons/close.gif);" class="ed_buttons" onclick="edCloseAllTags();" title="Close all open tags" >');
            document.write('</span>');
        }
        
        function edSmilesbar() {
            document.write('<span id="ed_Smiles_toolbar">');
            for (i = 0; i < edSmiles.length; i++) {
                edShowSmile(edSmiles[i], i);
            }
            document.write('</span>');
        }
        // insertion code
    
        function edInsertTag(myField, i) {
            //IE support
            if (document.selection) {
                myField.focus();
                sel = document.selection.createRange();
                if (sel.text.length > 0) {
                    sel.text = edButtons[i].tagStart + sel.text + edButtons[i].tagEnd;
                }
                else {
                    if (!edCheckOpenTags(i) || edButtons[i].tagEnd == '') {
                        sel.text = edButtons[i].tagStart;
                        edAddTag(i);
                    }
                    else {
                        sel.text = edButtons[i].tagEnd;
                        edRemoveTag(i);
                    }
                }
                myField.focus();
            }
            //MOZILLA/NETSCAPE support
            else if (myField.selectionStart || myField.selectionStart == '0') {
                var startPos = myField.selectionStart;
                var endPos = myField.selectionEnd;
                var cursorPos = endPos;
                var scrollTop = myField.scrollTop;
    
                if (startPos != endPos) {
                    myField.value = myField.value.substring(0, startPos)
                                  + edButtons[i].tagStart
                                  + myField.value.substring(startPos, endPos)  
                                  + edButtons[i].tagEnd
                                  + myField.value.substring(endPos, myField.value.length);
                    cursorPos += edButtons[i].tagStart.length + edButtons[i].tagEnd.length;
                }
                else {
                    if (!edCheckOpenTags(i) || edButtons[i].tagEnd == '') {
                        myField.value = myField.value.substring(0, startPos)  
                                      + edButtons[i].tagStart
                                      + myField.value.substring(endPos, myField.value.length);
                        edAddTag(i);
                        cursorPos = startPos + edButtons[i].tagStart.length;
                    }
                    else {
                        myField.value = myField.value.substring(0, startPos)  
                                      + edButtons[i].tagEnd
                                      + myField.value.substring(endPos, myField.value.length);
                        edRemoveTag(i);
                        cursorPos = startPos + edButtons[i].tagEnd.length;
                    }
                }
                myField.focus();
                myField.selectionStart = cursorPos;
                myField.selectionEnd = cursorPos;
                myField.scrollTop = scrollTop;
            }
            else {
                if (!edCheckOpenTags(i) || edButtons[i].tagEnd == '') {
                    myField.value += edButtons[i].tagStart;
                    edAddTag(i);
                }
                else {
                    myField.value += edButtons[i].tagEnd;
                    edRemoveTag(i);
                }
                myField.focus();
            }
        }
    
        function edInsertContent(myField, myValue) {
            //IE support
            if (document.selection) {
                myField.focus();
                sel = document.selection.createRange();
                sel.text = myValue;
                myField.focus();
            }
            //MOZILLA/NETSCAPE support
            else if (myField.selectionStart || myField.selectionStart == '0') {
                var startPos = myField.selectionStart;
                var endPos = myField.selectionEnd;
                myField.value = myField.value.substring(0, startPos)
                              + myValue  
                              + myField.value.substring(endPos, myField.value.length);
                myField.focus();
                myField.selectionStart = startPos + myValue.length;
                myField.selectionEnd = startPos + myValue.length;
            } else {
                myField.value += myValue;
                myField.focus();
            }
        }
    
        function edInsertLink(myField, i, defaultValue) {
            if (!defaultValue) {
                defaultValue = 'http://';
            }
            if (!edCheckOpenTags(i)) {
                var URL = prompt('Введите ссылку:' ,defaultValue);
                if (URL) {
                    
                    var URL_NAME = prompt('Введите название ссылки' ,'');
                    if (!URL_NAME) {
                        URL_NAME = 'URL';
                    }
                    edButtons[i].tagStart = '[url name=' + URL_NAME + ']' + URL + '[/url]';
                    edInsertTag(myField, i);
                }
            }
            else {
                edInsertTag(myField, i);
            }
        }
    
        function edInsertImage(myField) {
            var myValue = prompt('Enter the URL of the image', 'http://');
            if (myValue) {
                myValue = ' ';
                edInsertContent(myField, myValue);
            }
        }
    </script>
    
    <form  action="?go=add_replay&t=<? echo $topic_id;?>" method="post" name="post" id="commentform">
            <!-- BEGIN - LMB^Box Comment Quicktags Version 2.4 - Display //-->
            <span id="comment_quicktags">
                <script type="text/javascript" language="javascript">
                <!--
                    edButtons[edButtons.length] = new edButton('b','B','','','b','','bold');
                    edButtons[edButtons.length] = new edButton('i','I','[i]','
','i','','italic');
                    edButtons[edButtons.length] = new edButton('u','U','','','u','','underline');
                    
                    edButtons[edButtons.length] = new edButton('left','LEFT','[left]','[/left]','left','','justifyleft');
                    edButtons[edButtons.length] = new edButton('center','center','
','
','center','','justifycenter');
                    edButtons[edButtons.length] = new edButton('right','right','[right]','[/right]','right','','justifyright');
                    
                    edButtons[edButtons.length] = new edButton('ed_link','Link','','','a','','createlink');
                    edButtons[edButtons.length] = new edButton('ed_img','Image','','','','','insertimage');
                    
                    edButtons[edButtons.length] = new edButton('code','Code','
Код:
','
','c','','code');
                    edButtons[edButtons.length] = new edButton('quote','B-Quote','
Цитата:
','
','q','','quote');
                    
                    edToolbar();
                //-->
                </script>
            </span>
            <!-- END - LMB^Box Comment Quicktags Version 2.4 - Display //-->
            <table border="0" cellpadding="0" cellspacing="0" width="100%">
                <tr>
                    <td valign="top">
                        <textarea name="message" id="comment" cols="100%" style="width: 500px; height: 360px;"></textarea>
                    </td>
                    <td width="100%" valign="top" align="center">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%">
                            <tr height=40>
                        <script>
                            edSmiles[edSmiles.length] = new edSmile('ab', '');
                            edSmiles[edSmiles.length] = new edSmile('ac', '');
                            edSmiles[edSmiles.length] = new edSmile('ad', ';)');
                            edSmiles[edSmiles.length] = new edSmile('ae', ':P');
                            
                            edSmiles[edSmiles.length] = new edSmile('af', '8)');
                            edSmiles[edSmiles.length] = new edSmile('ag', ':D');
                            edSmiles[edSmiles.length] = new edSmile('ah', ':[');
                            edSmiles[edSmiles.length] = new edSmile('ai', ':O');
                            
                            edSmiles[edSmiles.length] = new edSmile('aj', ':*');
                            edSmiles[edSmiles.length] = new edSmile('ak', ':X');
                            edSmiles[edSmiles.length] = new edSmile('am', '>:o');
                            edSmiles[edSmiles.length] = new edSmile('an', ':|');                    
                            
                            edSmiles[edSmiles.length] = new edSmile('ao', '=/');
                            edSmiles[edSmiles.length] = new edSmile('ap', ':jokingly:');
                            edSmiles[edSmiles.length] = new edSmile('aq', ']:->');
                            edSmiles[edSmiles.length] = new edSmile('ar', '[:');
                            
                            edSmiles[edSmiles.length] = new edSmile('as', ':kissed:');
                            edSmiles[edSmiles.length] = new edSmile('at', ':!');
                            edSmiles[edSmiles.length] = new edSmile('au', '');
                            edSmiles[edSmiles.length] = new edSmile('av', '');
                            
                            edSmiles[edSmiles.length] = new edSmile('ay', '');
                            edSmiles[edSmiles.length] = new edSmile('az', '');
                            edSmiles[edSmiles.length] = new edSmile('bc', '');
                            edSmiles[edSmiles.length] = new edSmile('be', '%)');
                            
                            edSmiles[edSmiles.length] = new edSmile('bf', ':ok:');
                            edSmiles[edSmiles.length] = new edSmile('bh', ':sorry:');
                            edSmiles[edSmiles.length] = new edSmile('bj', ':rofl:');
                            edSmiles[edSmiles.length] = new edSmile('bk', ':pardon:');
                            
                            edSmiles[edSmiles.length] = new edSmile('bl', '');
                            edSmiles[edSmiles.length] = new edSmile('bm', ':crazy:');
                            edSmiles[edSmiles.length] = new edSmile('bn', ':hz:');
                            edSmiles[edSmiles.length] = new edSmile('bo', '');
                            
                            edSmiles[edSmiles.length] = new edSmile('bp', ':yahoo:');
                            edSmiles[edSmiles.length] = new edSmile('bs', '');
                            edSmiles[edSmiles.length] = new edSmile('bu', ':wall:');
                            edSmiles[edSmiles.length] = new edSmile('bv', ':write:');
                            
                            edSmilesbar();
                        </script>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
    <br>
    <input name="submit" type="submit" id="submit" tabindex="5" value="Отправить комментарий" />
        <!-- BEGIN - LMB^Box Comment Quicktags Version 2.4 //-->
        <script type="text/javascript" language="javascript">edCanvas = document.getElementById('comment');</script>
        <!-- END - LMB^Box Comment Quicktags Version 2.4 //-->
                <script type="text/javascript">
                <!--
                edCanvas = document.getElementById('comment');
                //-->
                </script>
    </form>    

 
Добавлено:
ну, в общем через редактирование код скопируй, потому что оно [соde] внутри [соde] заменило на блоки с кодами

----------
мой маленький блог
Создание on-line игр

Всего записей: 382 | Зарегистр. 21-06-2005 | Отправлено: 09:51 21-09-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
ну тэг code мне нужно показать другим цветом на странице, правильно?
 
в php надо code заменить на тэг HTML чтобы серым цветом фон сделать?

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 17:54 21-09-2009
Delta RuBoard



Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
ты еврей?
 
Добавлено:
aa, допер что ты хочешь, вроде как
http://sau.su/8d52f2d3668af86399cb8c1bde5da8e4/bb.zip
это ложиш в корневую папку. там в папочке BB есть демо и описание

----------
мой маленький блог
Создание on-line игр





п. 2.12. главы VIII Соглашения по использованию /Cheery/

Всего записей: 382 | Зарегистр. 21-06-2005 | Отправлено: 18:46 21-09-2009 | Исправлено: Cheery, 02:54 22-09-2009
andead



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
http://markitup.jaysalvat.com/examples/bbcode/

Всего записей: 1821 | Зарегистр. 22-09-2005 | Отправлено: 01:12 22-09-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Все таки мне приспичело остановиться на визуальном редакторе TinyMCE
 
НО напимер есть у меня статьи с BB кодом
 
можно ли совмещать BB и TinyMCE?
 
 
 
например я введу ВВ код в TinyMCE отправлю его в скрипт, скрипт перед вставкой MySQL преобразует из BB в HTML правильно (HTML оставляет)? а если нужно откорректирвоать сообщение, то он преобразует обратно из HTML и BB? или это не получиться?
 
еще я не где не нашел и никто не знает как вставить ['code'] тэг и "квоту"
 
чтобы тэг код  преобразовывлся в таблицу
 
в скрипте выполнить и обратно при редактировании этого скрипта
['code'] -> <table bla-bla-bla >
['/code'] -> </table>
 
и если мне нужно разукрашивать код ЯП еще автоматически....
 
 
правильно? или я путаюсь? как это работает? обясните
 
 
===
 
кстате, нужно ли вырезать плогие и опасные тэги или их можно экранировать?
 

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 04:32 08-11-2009 | Исправлено: rtyug, 04:36 08-11-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
а подскажите как сделать чтобы код был в таблице HTML с рамочкой какого-то цвета?
 
['code'] -> <table bla-bla-bla >
['/code'] -> </table>  
 
нужно перевести в скрипте с BB в HTML , а при редактировани обратно перевести c HTML в BB в редактор?
 
это правильно
 
Добавлено:
если внутри в ['code'] будут таблицы еще какие-то ? то тогда как?

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 14:55 08-11-2009 | Исправлено: rtyug, 15:04 08-11-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

 
подскажите пожалуйста, например хотел:  
 
написаН текст в визуальном редакторе, нужно нажать на кнопку CODE и чтобы этот текст был в тэгах /code и чтобы было видно сами тэги в визуальном редакторе...
 
правильно? такая схема сделанная в vBulletin®
 
как эти кнопки поставить?
 
я кажется понял, просто найти сейчас и понять не могу....
если не сложно, то подскажите....

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 21:13 18-11-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
http://markitup.jaysalvat.com/examples/bbcode/

andead
 
подскажите, пожалуйста есть ли еще?
 
я не могу найти, в этот просто реклама ставиться...
 
 
Добавлено:
нету  
http://www.google.com.ua/#hl=uk&q=bb+%D1%80%D0%B5%D0%B4%D0%B0%D0%BA%D1%82%D0%BE%D1%80&start=10&sa=N&fp=bf5056a779b927eb
 
Добавлено:
вот нашел еще, но они слабые:
и в некотрых документаций нету
 
http://source.virtser.net/
http://pastebin.com/d7ab5ac8a
http://habrahabr.ru/blogs/jquery/70174/#habracut
http://www.recoilme.ru/ninja/editor
 
http://plugins.jquery.com/project/osimo-bbcode-editor
http://plugins.jquery.com/project/bbcode-editor
 
 
 
или ладно, я остановлюсь на markItUp

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 12:29 20-11-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
andead
 
вот я поставил
 

Код:
 
      <tr>
      <td colspan="3">
<textarea id="markItUp" rows="50" cols="120" name="content_text"><TMPL_VAR NAME="text_co_current"></textarea>
      </td>    
      </tr>
 

 
редактор работает хорошо, но как только я отправляю, то нету параметра content_text
 
как только выключу редатор этот параметр с textarea приходит!
 
 
как исправить?  
есть ли рабочий вариант? а то на ихнем сайте сайте нету, данный вариант из примера в архиве
 
 
вот полностью: http://x0.org.ua/perl/hello.html.txt
 
коротко:
Подробнее...
 
пробовал:
 

Код:
 
<script type="text/javascript" >
   $(document).ready(function() {
      $("#markItUp").markItUp(mySettings);
   });
</script>
 

 

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 17:09 30-11-2009 | Исправлено: rtyug, 03:33 04-12-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
andead
 
в предыдущем после проблема все таки есть такая которую я там описал
 
 
я правильно все сделал? почему именно с редатора текст не передается?
 
посмотрите пожалуйста, у вас так было?
 

Цитата:
 dfdf  

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 13:24 01-12-2009 | Исправлено: rtyug, 15:25 02-12-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
http://www.phpcow.com/smartmarkup/documentation
 
с этим редатором такое же
 
параметр в textarea в которой текст не передается....
 
Подробнее...
 
 
 
использовал ли кто-то такие редаторы?
 
я хотел просто красивый редактор поставить....

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 17:40 01-12-2009 | Исправлено: rtyug, 03:34 04-12-2009
andead



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
rtyug
ссылку на живой пример, и в будущем заключайте ваши листинги в тег more

----------
мой блог

Всего записей: 1821 | Зарегистр. 22-09-2005 | Отправлено: 17:53 01-12-2009 | Исправлено: andead, 17:54 01-12-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

 
было из-за того что надо было закрыть таблицу и открыть внутри...
 

Код:
</table>
 
<form name="create_admin" id="create_admin" method="post" action="/profile/edit_pesonal_content2">
 
<table>

 
я это знал, но не удилял внимание

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 20:48 01-12-2009 | Исправлено: rtyug, 03:35 04-12-2009
rtyug



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
 ссылку на живой пример, и в будущем заключайте ваши листинги в тег more

 
andead
 
отредактировал

Всего записей: 490 | Зарегистр. 13-05-2009 | Отправлено: 03:36 04-12-2009
vs6262



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
нужен JavaScript WYSIWYG едитор для композирования емаил с inline-Image и выборкой шрифтов функциями.
 
может кто подскажет какой WYSIWYG едитор для этих целей подойдет ?
 
заранее спасибо

Всего записей: 2188 | Зарегистр. 25-02-2013 | Отправлено: 18:45 28-02-2016
vs6262



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
вопрос снят
 
решился к TinyMCE Editor  
https://www.tinymce.com/  
 
нужна только помощь как в TinyMCE Editor font-family и font-size в тулбаре ввязать ?
может кто поможет ?
 
заранее спасибо

Всего записей: 2188 | Зарегистр. 25-02-2013 | Отправлено: 16:06 04-03-2016
vs6262



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
проблема решилась

Всего записей: 2188 | Зарегистр. 25-02-2013 | Отправлено: 13:09 07-03-2016
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
vs6262
на будущее - TinyMCE

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 01:42 29-04-2016
Открыть новую тему     Написать ответ в эту тему

Компьютерный форум Ru.Board » Интернет » Web-программирование » редакторы BB кода или WYSIWYG


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru