vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 4 Articles (https://vborg.vbsupport.ru/forumdisplay.php?f=242)
-   -   [HOW TO] Add WYSIWYG Editor to Your Modifications (https://vborg.vbsupport.ru/showthread.php?t=228693)

Mythotical 11-22-2009 10:00 PM

[HOW TO] Add WYSIWYG Editor to Your Modifications
 
1 Attachment(s)
I do this as a free service, I am a student however and all donations are welcome. You can click on the Paypal icon to make a donation: https://www.paypalobjects.com/en_US/..._donate_LG.gif

I will add instructions for pulling data when editing a file.


This article was done for vB 3.5 and later, I now bring you the article for vB 4.0 in regards to the editor in modifications.

Working Versions: Currently 4.1.10
Testing Versions: NONE

This tutorial will provide you the proper method for including the WYSIWYG editor in your modifications. I have tested this and it works so following this tutorial will provide a working editor. You are welcome to tweak it to your liking so that you get different output's or vice versa.

Lets begin.

Step 1. Make sure you have already added the row to your database table. The new row to add is:
PHP Code:

`messagevarchar(255

You can alter that to be messagearea, message, description, etc and it will work just the same.

Step 2. Open your template containing your form.
Step 3. Install the provided plugin xml file.
Step 3. Add the following lines of code.

Now add this in place of your opening form tag (Remember to change your action to your correct file):
HTML Code:

<form class="vbform block" action="file.php" method="post" name="vbform" onsubmit="return vB_Editor['{vb:raw editorid}'].prepare_submit(0, 0)">


    <div class="blockbody formcontrols">
        <div class="section">
       

            {vb:raw messagearea}


        </div>
    </div>

    <div class="blockfoot actionbuttons">
        <div class="group">
                <input type="hidden" name="s" value="{vb:raw session.sessionhash}" />
                <input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" />
                <input type="hidden" name="do" value="postsomething" />
                <input type="submit" class="button" name="sbutton" id="{vb:raw editorid}_save" value="{vb:rawphrase submit}" accesskey="s" tabindex="1" />
                <input type="submit" class="button" name="preview" value="{vb:rawphrase preview_post}" accesskey="r" tabindex="1" />
        </div>
    </div>


</form>

Step 4. Add the following to your php file.

Open the file you wish to add your editor to (Make sure you have this code in the area where your template containing the editor is to be called):
PHP Code:

require_once(DIR '/includes/functions_editor.php');
require_once(
DIR '/includes/functions_bigthree.php');

$editorid construct_edit_toolbar('',1,'signature',1,1,($vbulletin->userinfo['userid'])); 

Then edit your template register and add the following:
PHP Code:

$templater->register('editorid'$editorid);
$templater->register('messagearea'$messagearea); 

Add this line to your php file after you define special templates, global templates, etc:
PHP Code:

define('GET_EDIT_TEMPLATES'true); 

Add these to your specialtemplates:
PHP Code:

$specialtemplates = array('smiliecache','bbcodecache'); 

Step 5. Save and close your file, upload and test. Make sure you saved your template as well.

This is a short article/tutorial and I hope many find it useful. Even though I did not come up with the code or discover the code, I am happy to help others out as I was helped out.

Preview provided at attachments.

RS_Jelle 11-25-2009 06:56 AM

Instead of adding all these templates to globaltemplates, you could add this:

PHP Code:

define('GET_EDIT_TEMPLATES'true); 

Even better, use action templates:
PHP Code:

define('GET_EDIT_TEMPLATES''action1,action2'); 


zbahadir 11-25-2009 08:14 AM

Thanks. :)

Mythotical 11-25-2009 03:27 PM

Quote:

Originally Posted by RS_Jelle (Post 1920594)
Instead of adding all these templates to globaltemplates, you could add this:

PHP Code:

define('GET_EDIT_TEMPLATES'true); 

Even better, use action templates:
PHP Code:

define('GET_EDIT_TEMPLATES''action1,action2'); 


Thanks, I'll update the article to reflect your suggestion.

I should ask what that does since I have never seen that code before. I'm sure others will question as well.

RS_Jelle 11-25-2009 07:35 PM

Quote:

Originally Posted by Steve M (Post 1920764)
Thanks, I'll update the article to reflect your suggestion.

I should ask what that does since I have never seen that code before. I'm sure others will question as well.

It just caches the editor templates, in an easier way :)

From /includes/class_bootstrap.php:
PHP Code:

        // if we are in a message editing page then get the editor templates
        
$show['editor_css'] = false;
        if (
defined('GET_EDIT_TEMPLATES'))
        {
            
$_get_edit_templates explode(','GET_EDIT_TEMPLATES);
            if (
GET_EDIT_TEMPLATES === true OR in_array($_REQUEST['do'], $_get_edit_templates))
            {
                
$cache array_merge($cache, array(
                    
// message stuff 3.5
                    
'editor_toolbar_on',
                    
'editor_smilie',
                    
// message area for wysiwyg / non wysiwyg
                    
'editor_clientscript',
                    
'editor_toolbar_off',
                    
'editor_smilie_category',
                    
'editor_smilie_row',
                    
'editor_toolbar_fontname',
                    
'editor_toolbar_fontsize',
                    
'editor_toolbar_colors',
                    
// javascript menu builders
                    
'editor_jsoptions_font',
                    
'editor_jsoptions_size',
                    
// smiliebox templates
                    
'editor_smiliebox',
                    
// needed for thread preview
                    
'bbcode_code',
                    
'bbcode_html',
                    
'bbcode_php',
                    
'bbcode_quote',
                    
// misc often used
                    
'newpost_threadmanage',
                    
'newpost_disablesmiliesoption',
                    
'newpost_preview',
                    
'newpost_quote',
                    
'posticonbit',
                    
'posticons',
                    
'newpost_usernamecode',
                    
'newpost_errormessage',
                    
'forumrules'
                
));

                
$show['editor_css'] = true;
            }
        } 

+ If you don't do it this way, this mod won't work (if it gets ported to vB4).

Mythotical 11-25-2009 08:28 PM

Quote:

Originally Posted by RS_Jelle (Post 1920856)
It just caches the editor templates, in an easier way :)

From /includes/class_bootstrap.php:
PHP Code:

        // if we are in a message editing page then get the editor templates
        
$show['editor_css'] = false;
        if (
defined('GET_EDIT_TEMPLATES'))
        {
            
$_get_edit_templates explode(','GET_EDIT_TEMPLATES);
            if (
GET_EDIT_TEMPLATES === true OR in_array($_REQUEST['do'], $_get_edit_templates))
            {
                
$cache array_merge($cache, array(
                    
// message stuff 3.5
                    
'editor_toolbar_on',
                    
'editor_smilie',
                    
// message area for wysiwyg / non wysiwyg
                    
'editor_clientscript',
                    
'editor_toolbar_off',
                    
'editor_smilie_category',
                    
'editor_smilie_row',
                    
'editor_toolbar_fontname',
                    
'editor_toolbar_fontsize',
                    
'editor_toolbar_colors',
                    
// javascript menu builders
                    
'editor_jsoptions_font',
                    
'editor_jsoptions_size',
                    
// smiliebox templates
                    
'editor_smiliebox',
                    
// needed for thread preview
                    
'bbcode_code',
                    
'bbcode_html',
                    
'bbcode_php',
                    
'bbcode_quote',
                    
// misc often used
                    
'newpost_threadmanage',
                    
'newpost_disablesmiliesoption',
                    
'newpost_preview',
                    
'newpost_quote',
                    
'posticonbit',
                    
'posticons',
                    
'newpost_usernamecode',
                    
'newpost_errormessage',
                    
'forumrules'
                
));

                
$show['editor_css'] = true;
            }
        } 

+ If you don't do it this way, this mod won't work (if it gets ported to vB4).

Ah great info, thank you for clarifying, I have included it in the article as well. I plan to go change my ported mods to include that as well.

MaryTheG(r)eek 12-13-2009 02:06 PM

I've followed the instruction, editors works as it must works, but in all pages there is that dammit yellow triangle at browser's status bar with error:
vB_XHTML_Ready has not been definied
URI: http://www.microhellas.com/main/clie...tor.js?v=400b5


Maria

Mythotical 12-13-2009 04:02 PM

Maria, can you show me the page that you get the yellow triangle? I don't get the triangle so I'm a bit concerned right now, oh yeah, what browser you viewing the page in?

MaryTheG(r)eek 12-13-2009 04:18 PM

Quote:

Originally Posted by Steve M (Post 1929987)
Maria, can you show me the page that you get the yellow triangle? I don't get the triangle so I'm a bit concerned right now, oh yeah, what browser you viewing the page in?

Sure. http://www.microhellas.com/main/support.php

Thank you so much. By the way. IE8

Maria

Mythotical 12-13-2009 04:21 PM

Hmmmm, I opened it in IE8 but I get no error report. Let me check a few things and I'll post back.

Your welcome.


All times are GMT. The time now is 02:27 PM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01596 seconds
  • Memory Usage 1,807KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)bbcode_html_printable
  • (11)bbcode_php_printable
  • (4)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 

Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete