The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

How do you add a custom button for staff only to the message editor?

4 posters

Go down

Solved How do you add a custom button for staff only to the message editor?

Post by ddoesmc March 5th 2014, 12:58 pm

How do you add a custom button for staff only to the message editor?


Last edited by ddoesmc on March 6th 2014, 9:39 pm; edited 1 time in total
ddoesmc
ddoesmc
Forumember

Male Posts : 283
Reputation : 11
Language : Mainly english
Location : New Jersey

View user profile http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Pizza Boi March 5th 2014, 1:51 pm

Pizza Boi
Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

View user profile

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur March 5th 2014, 9:00 pm

Hello ddoesmc,

You can try this :
It is a snippet from a project I was working on.

Administration Panel > Modules > Javascript codes management > Create a new script

Title : what you wish
Placement : In all the pages
Code:
$(window).load(function() {
    var settings = {
       img : 'backgroud img for button',
       title : 'title of button',
       message : 'moderation message'
    };
    if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
       $('.sceditor-group:last').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-message" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
       $('.sceditor-button-message').click(function() {
           $('#text_editor_textarea').sceditor('instance').insertText(settings["message"],'');
       });
    }
});

In the code are some settings you can modify :
Code:
   var settings = {
       img : 'backgroud img for button',
       title : 'title of button',
       message : 'moderation message'
    };

img : the url of the image that you want the button to show
title : the title displayed when hovering over the button
message : the message you want inserted into the editor on click
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc March 5th 2014, 11:22 pm

Hi how do I add more then one moderation message?
ddoesmc
ddoesmc
Forumember

Male Posts : 283
Reputation : 11
Language : Mainly english
Location : New Jersey

View user profile http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur March 6th 2014, 1:10 am

You would need to turn it into a dropdown list. You would then need to add to the html, and functions that input the messages.

Example :
Code:
$(function() {
    var settings = {
       img : 'backgroud img for button',
       title : 'title of button'
    };
    if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
        $('.sceditor-group:last').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-message" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
        $('body').append('<div id="messageList" style="z-index:15;display:none;position:absolute;background:#fff;border:1px solid #ccc;padding:3px;"><div id="M1" class="listItem" style="cursor:pointer;">Message 1</div><div id="M2" class="listItem" style="cursor:pointer;">Message 2</div><div id="M3" class="listItem" style="cursor:pointer;">Message 3</div></div>');
      
       
       $('.sceditor-button-message').click(function() {
          var display = $('#messageList').css('display');
          if (display == 'none') {
             var Y = $(this).offset().top;
             var X = $(this).offset().left;
             $('#messageList').show().offset({top:Y + 25,left:X});
          }
           else { $('#messageList').hide(); }
       });
        
       $('#M1').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 1',''); });
       $('#M2').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 2',''); });
       $('#M3').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 3',''); });
       $('.listItem').click(function() { $(this).parent().hide(); });
    }
});
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc March 6th 2014, 1:39 am

I will try this
Edit: I just want text no background
ddoesmc
ddoesmc
Forumember

Male Posts : 283
Reputation : 11
Language : Mainly english
Location : New Jersey

View user profile http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur March 6th 2014, 2:00 am

ddoesmc wrote:I will try this
Edit: I just want text no background
I did not comprehend.

Care to explain what you mean ?
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc March 6th 2014, 2:20 am

Just like a drop down with a list of texts no image etc.
ddoesmc
ddoesmc
Forumember

Male Posts : 283
Reputation : 11
Language : Mainly english
Location : New Jersey

View user profile http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur March 6th 2014, 2:24 am

scratch

add this :
Code:
$(window).load(function() {
    var settings = {
       img : 'backgroud img for button',
       title : 'title of button'
    };
    if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
        $('.sceditor-group:last').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-message" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
        $('body').append('<div id="messageList" style="z-index:15;display:none;position:absolute;background:#fff;border:1px solid #ccc;padding:3px;"><div id="M1" class="listItem" style="cursor:pointer;">Message 1</div><div id="M2" class="listItem" style="cursor:pointer;">Message 2</div><div id="M3" class="listItem" style="cursor:pointer;">Message 3</div></div>');
      
     
      $('.sceditor-button-message').click(function() {
          var display = $('#messageList').css('display');
          if (display == 'none') {
             var Y = $(this).offset().top;
             var X = $(this).offset().left;
             $('#messageList').show().offset({top:Y + 25,left:X});
          }
           else { $('#messageList').hide(); }
       });
        
       $('#M1').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 1',''); });
       $('#M2').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 2',''); });
       $('#M3').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 3',''); });
       $('.listItem').click(function() { $(this).parent().hide(); });
    }
});

How do you add a custom button for staff only to the message editor? Captu373
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc March 6th 2014, 2:25 am

What part do I edit to make the list of texts?  :/
ddoesmc
ddoesmc
Forumember

Male Posts : 283
Reputation : 11
Language : Mainly english
Location : New Jersey

View user profile http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur March 6th 2014, 2:28 am

Replace your last code in javascripts management.

At the bottom I have written the functions for when you click the list items. They're marked with the ID #M1, #M2, #M3. In the instance 'insertText' you'll see 'message 1' that is the texts you edit.

You can also edit the list itself, it is appended from the body.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Sir. Mayo March 6th 2014, 4:08 pm

Does this work on all forum types? Or just phbb3?
Sir. Mayo
Sir. Mayo
Forumember

Male Posts : 980
Reputation : 90
Language : English, Some french.
Location : you can also reach me on snoonet's irc server. I idle in #Techsupport Username is Vault108

View user profile http://sir-mayo.forumotion.com/

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur March 6th 2014, 4:13 pm

If the forum contains the SCEditor it should work. The list is a bit different from my actual project since I didn't include the full style for this.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc March 6th 2014, 9:40 pm

Topic Solved  :wouhou: 
Thanks to all!
ddoesmc
ddoesmc
Forumember

Male Posts : 283
Reputation : 11
Language : Mainly english
Location : New Jersey

View user profile http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur March 6th 2014, 10:19 pm

Welcome Smile

Topic solved and archived
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum