MyBB Community Forums

Full Version: How can you add more rows to the message editor?
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hi! =D My name's Valentina and me and my buddies were wondering how to add a 3rd (possibly 4th) row to the message editor! =)

You know, the thing with the B I U buttons on them? ^.^
My friend wanted to post this question in here, but apparently forgot what his password was, so he'll let me do that for him. =) He did give me lots of screenshots for you guys to see, so you understand what he's trying to do. =) So... let's get started! =D

This is what the editor looks like before trying to add a 3rd row:
[Image: 2%20row%20editor.png]

He thinks he has to edit the ./codes/jscripts/editor.js file and add a uh... "ToolbarContainer".
So far, after this part
this.createToolbar('formatting', {
			container: 'bottom',
			items: [
				{type: 'button', name: 'b', sprite: 'bold', insert: 'b', title: this.options.lang.title_bold},
				{type: 'button', name: 'i', sprite: 'italic', insert: 'i', title: this.options.lang.title_italic},
				{type: 'button', name: 'u', sprite: 'underline', insert: 'u', title: this.options.lang.title_underline},
				{type: 'button', name: 's', sprite: 's', insert: 's', title: 'Insert striked out text'},
				{type: 'button', name: 'o', sprite: 'o', insert: 'o', title: 'Insert overlined text'},
				{type: 'button', name: 'h', sprite: 'h', insert: 'h', title: 'Insert a text with a tooltip/title'},
				{type: 'separator'},
				{type: 'button', name: 'align_left', sprite: 'align_left', insert: 'align', extra: 'left', title: this.options.lang.title_left},
				{type: 'button', name: 'align_center', sprite: 'align_center', insert: 'align', extra: 'center', title: this.options.lang.title_center},
				{type: 'button', name: 'align_right', sprite: 'align_right', insert: 'align', extra: 'right', title: this.options.lang.title_right},
				{type: 'button', name: 'align_justify', sprite: 'align_justify', insert: 'align', extra: 'justify', title: this.options.lang.title_justify}
			]
		});

He tried to add this:
		this.createToolbarContainer('verybottom');
		
		this.createToolbar('formatting', {
		container: 'verybottom',
			items: [
				{type: 'button', name: 'w', sprite: 'w', insert: 'w', title: 'Adds more width to, or changes the width of the text within'},
				{type: 'button', name: 'h', sprite: 'h', insert: 'h', title: 'Insert a text with a tooltip/title'}
			]
		});

But when that failed, he simply deleted the B I U buttons on the second row and tried to move them down to that third row instead:
		this.createToolbarContainer('verybottom');
		
		this.createToolbar('formatting', {
		container: 'verybottom',
			items: [
				{type: 'button', name: 'b', sprite: 'bold', insert: 'b', title: this.options.lang.title_bold},
				{type: 'button', name: 'i', sprite: 'italic', insert: 'i', title: this.options.lang.title_italic},
				{type: 'button', name: 'u', sprite: 'underline', insert: 'u', title: this.options.lang.title_underline}
			]
		});

Here is what both attempts result in (well, except the B I U wouldn't be there when moving them down ^^; ):
[Image: 3%20row%20editor%20problem.png]

And here is what you see when using Inspect Mode to view what's inside:
[Image: 3%20row%20editor%20inspect.png]

So, apparently he manages to add a container to a 3rd row, but no matter how much he stuffs into it, it stays empty. =O He tried it in Firefox and Google Chrome, but both of them display an empty 3rd row. =/ Is he doing something wrong? Or is there something else he needs to do to make the stuff inside the 3rd row appear? =O

And yes, he could make this message editor wider, but it's already set to 90 cols wide (whatever cols stands for). ^.^; I'd really appreciate any help you could give us! =D

*hugs and kisses*
Valentina
Have you checked this thread: http://community.mybb.com/thread-12693.html