Current time: 10-31-2024, 07:31 PM Hello There, Guest! (LoginRegister)


Announcement
We have the biggest collection of MyBB Plugins here on the Net. We have currently 175+ MyBB Exclusive Plugins, 80+ MyBB Compatible MyCodes and 16+ MyBB 1.4.x Themes (Some are still under construction...) Thus, we provide you the largest MyBB Stuff on the net including tutorials. Stay with us, you will find out some more to come.
Now you can easily create your own buttons set for MyBB! Click here to have a look...
*** You cannot do your registration behind any Proxies anymore! ***
Welcome Guest[3.144.98.153], connected from
Post Reply 
 
Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
[Tut] How to Add your MyCodes to the Editor Bar?
07-14-2010, 05:33 AM
Post: #1
[Tut] How to Add your MyCodes to the Editor Bar?
How to Add your MyCodes to the Editor Bar

Hi guys, this is the easiest way to add your mycodes (like hide tab, youtub tab etc) to the message toolbar, let's go:

We will need to edit these files:

- /jscripts/editor.js
- /jscripts/editor_themes/Office_2007/stylesheet.css


Step #1

Open the editor.js in notepad and search for:
Quote:[Highlight]this.options.lang.title_php}

and add a colon [,] after that. You will get like this:
Quote:[Highlight]this.options.lang.title_php},

Next, add this template line below the entire line:
Quote:[Highlight]{type: 'button', name: 'name', sprite: 'sprite', insert: 'code', title: 'alt text or tittle'}

And fill it with the following:

- name = the name of your personal code (isn't neccesary to be equal as your mybb name in the list)
- sprite = the sprite code (used to modify the css sheet)
- code = the code that will wrap the text. ([i'm talking about this] [/i'm talking about this])
- title = the alt text that will apear if you put the mouse over the picture

for example, to put a Hide code:
Quote:[Highlight]{type: 'button', name: 'hide', sprite: 'hide', insert: 'hide', title: 'Hide the Download Links'}

Save and upload the file.

Step #2

Open the stylesheet.css in Notepad and in the end of the text add these:
Quote:[Highlight].messageEditor .toolbar_button .toolbar_sprite_spritename {
background: url(images/sprite+ext) no-repeat;
}

and replace:

spritename = the sprite name that we defined in the editor code, remember? ( sprite: 'spoiler')
sprite+ext = your sprite plus extension.

And, for the hide for example:
Quote:[Highlight].messageEditor .toolbar_button .toolbar_sprite_hide {
background: url(images/hide.gif) no-repeat;
}

Save and upload.

Step #3

Well, finally, get your icon and upload into the folder: /jscripts/editor_themes/Office_2007/images/
____

Well, with this method, we can get a nicely custom text toolbar, this is my result:
[Image: 14103k2.jpg]


Additional Notes:
To activate the office 2007 editor, Go to
Templates & Style > Select your theme name > Edit Theme Properties > Select the Editor Style
[Image: 2w3ud8y.jpg]

shinekwt's signature
Visit this user's website Find all posts by this user
Quote this message in a reply
07-19-2010, 01:12 PM
Post: #2
RE: [Tut] How to Add your MyCodes to the Editor Bar?
Thanks a lot for this Smile
Is possible make this with the default editor?
Find all posts by this user
Quote this message in a reply
07-22-2010, 05:42 AM
Post: #3
RE: [Tut] How to Add your MyCodes to the Editor Bar?
For these there are so many tutorials are available for the advance facility. Then you have to do the setting then it might be work good these all information is really good to share with us.
Visit this user's website Find all posts by this user
Quote this message in a reply
09-15-2010, 09:50 AM
Post: #4
RE: [Tut] How to Add your MyCodes to the Editor Bar?
thanks for the tip, i'll be looking into this on my dev forum

Richard.R's signature
Visit this user's website Find all posts by this user
Quote this message in a reply
09-20-2010, 06:04 AM
Post: #5
RE: [Tut] How to Add your MyCodes to the Editor Bar?
Thanks for the tutorial bro !

Ansar Bajwa's signature
Visit this user's website Find all posts by this user
Quote this message in a reply
10-16-2010, 01:01 PM
Post: #6
RE: [Tut] How to Add your MyCodes to the Editor Bar?
Thanks

Cr4sh's signature
Visit this user's website Find all posts by this user
Quote this message in a reply
08-08-2011, 09:09 AM
Post: #7
RE: [Tut] How to Add your MyCodes to the Editor Bar?
hm.. Thanks Men...

_Un!corn's signature
Visit this user's website Find all posts by this user
Quote this message in a reply
0 member(s) viewed this thread in the last 365 days :
Post Reply 


Was This Thread Useful ?
Please Link To Us
URL
BBCode
HTML

Possibly Related Threads...
Thread: Author Replies: Views: Last Post
Heart Comprehensive Guide On Developing MyCodes ghazal 1 2,017 09-20-2010 06:07 AM
Last Post: Ansar Bajwa

Forum Jump:

 
New To Site ?
Some Useful Links
  • Help

  • You Might Need To Register

  • Forum Statistics

  • Mark All Forums Read

  • Forum Staff

  • Log Out
  • Contact Us

  • Mybbcodes

  • Return to Top

  • Return to Content

  • Lite (Archive) Mode

  • RSS Syndication
  • Powered By MyBB, © 2002-2024 MyBB Group.
    Golden Crown - Designed and Published by ghazal & exdiogene of MyBBCodes.
    Hosting provided by WWWHostingServer.com