Editor Button for just one forum

Hello Guy's and girls its me again LOL

I have been working on my forum and wanted to add a button to the editor That will only show up in the editor when in one forum.

I want it to be in the "PROMOTION SECTION"

When a member is added to that secession (Group then the Icons will show so they can post this code.

Code:

[table class="posting-table" style="border: 3px solid
rgb(144,144,144);border-bottom: 0px solid
rgb(144,144,144);border-radius: 3px 3px 0px 0px;" cellspacing="0"
width="100%"][tr][td style="background-image:
url(http://i86.servimg.com/u/f86/19/37/39/66/bw_lef11.png);
background-repeat: no-repeat;" height="100" width="152"][/td]
[td
style="background: transparent
url(http://i86.servimg.com/u/f86/19/37/39/66/bwcent11.png) repeat scroll
 0% 0%; -moz-background-clip: border; -moz-background-origin: padding;
-moz-background-inline-policy: continuous; padding-bottom:
15px;"][center][size=16][color=#707070][b][font=Georgia]NEW TEXT
HERE!![/font][/b][/color][/size][/center]
   [/td]
[td
style="background-image:
url(http://i86.servimg.com/u/f86/19/37/39/66/forum_11.png);
background-repeat: no-repeat;" width="84"][/td]
[/tr]
[/table]
[table
 class="posting-table" style="border-left: 3px solid rgb(144,144,144);
border-right: 3px solid rgb(144,144,144); border-bottom: 1px solid
rgb(0, 114, 149);" cellspacing="0" width="100%"][tr][td
style="padding-left: 5px; padding-right: 5px; background-color: rgb(247,
 247, 247);"][center]      
[table border="0"][tr][td]PLACE YOUR BANNER HERE!!!![/td]
[/tr]
[/table]
  
[left]Forum URL:
    Description of your forum:
    
    Staff you have on your forum:

    Some Links to Hot topic's:

    
[center]        
[table border="0"][tr][td]SCREEN SHOTS OF YOUR FORUM!!!![/td]
[/tr]
[/table]
[left]Other Info you think member would like to read:[/left]
   [/center]
   [/left]
   [/center]
   [/td]
[/tr]
[/table]
[table
 class="posting-table" style="border-left: 3px solid
rgb(144,144,144);border-radius: 0px 0px 3px 3px; border-right: 3px solid
 rgb(144,144,144); border-bottom: 3px solid rgb(144,144,144);"
cellspacing="0" width="100%"][tr][td style="background: rgb(247, 247,
247) none repeat scroll 0% 0%; text-align: justify;
-moz-background-clip: border; -moz-background-origin: padding;
-moz-background-inline-policy: continuous; padding-left:
5px;"][center][font=Verdana][b][font=FontAwesome][size=18][size=26][color=#000000][/color][/size][/size][/font][color=#000000]A[/color][color=#0066cc]
 [color=#707070]chat World[/color][/color] [color=#000000]Official Forum
 Promotion Post[/color][/b][/font][/center]
   [/td]
[td
style="background: transparent
url(http://i86.servimg.com/u/f86/19/37/39/66/bottom11.png) No-repeat
scroll 0% 0%; -moz-background-clip: border; -moz-background-origin:
padding; -moz-background-inline-policy: continuous;" height="100"
width="140"][/td]
[/tr]
[/table]

  They would then fill in the Code as they see if then send it.

I would really like the button to be Placed on its own away from the rest of the buttons and if there is any CSS files to be also added to that page not in the CSS files as i have lots of code there already

much thanks to anyone that can help

APE

@APE

Add the following code to a new JavaScript with placement in all the pages.

Code:

if (/\/post?f=43&mode=newtopic/.test(window.location.href)) {
  document.write('<stye type="text/css">.sceditor-button-promotion div { background-image:url(IMAGE) !important; }</style>');

  window.faPromoTemp = 'TEMPLATE';

  $(function() {
    if ($.sceditor) {
      $.sceditor.command.set('promotion', {

        // WYSIWYG MODE
        exec : function() {
          this.insertText(faPromoTemp);
        },

        // SOURCE MODE
        txtExec : function() {
          this.insertText(faPromoTemp);
        }

      });

      toolbar += '|promotion';
    }
  });
}

Modifications :

1. Edit the number "43" in the regular expression to the ID of the forum you want it to work in.

Code:

/\/post?f=43&mode=newtopic/

2. Replace "IMAGE" in the CSS with the button image URL.

Code:

document.write('<stye type="text/css">.sceditor-button-promotion div { background-image:url(IMAGE) !important; }</style>');

3. Replace "TEMPLATE" in the global variable with the template you want inserted when the button is pressed.

Code:

window.faPromoTemp = 'TEMPLATE';

When finished making modifications save the script.

If any problems let me know.

Thank you @Ange Tuteur

I have added the code like said but the button is not showing


This is the address the forum i want it to be added to
http://www.achatworld.com/post?f=22&mode=newtopic
Icons is https://i.servimg.com/u/f86/12/23/10/57/act10.png

This is the code when finished

Code:

if (/\/post?f=22&mode=newtopic/.test(window.location.href)) {
      document.write('<stye type="text/css">.sceditor-button-promotion div { background-image:url(http://i86.servimg.com/u/f86/12/23/10/57/act10.png) !important; }</style>');

      window.faPromoTemp = '        [table class="posting-table" style="border: 3px solid
        rgb(144,144,144);border-bottom: 0px solid
        rgb(144,144,144);border-radius: 3px 3px 0px 0px;" cellspacing="0"
        width="100%"][tr][td style="background-image:
        url(http://i86.servimg.com/u/f86/19/37/39/66/bw_lef11.png);
        background-repeat: no-repeat;" height="100" width="152"][/td]
        [td
        style="background: transparent
        url(http://i86.servimg.com/u/f86/19/37/39/66/bwcent11.png) repeat scroll
        0% 0%; -moz-background-clip: border; -moz-background-origin: padding;
        -moz-background-inline-policy: continuous; padding-bottom:
        15px;"][center][size=16][color=#707070][b][font=Georgia]NEW TEXT
        HERE!![/font][/b][/color][/size][/center]
          [/td]
        [td
        style="background-image:
        url(http://i86.servimg.com/u/f86/19/37/39/66/forum_11.png);
        background-repeat: no-repeat;" width="84"][/td]
        [/tr]
        [/table]
        [table
        class="posting-table" style="border-left: 3px solid rgb(144,144,144);
        border-right: 3px solid rgb(144,144,144); border-bottom: 1px solid
        rgb(0, 114, 149);" cellspacing="0" width="100%"][tr][td
        style="padding-left: 5px; padding-right: 5px; background-color: rgb(247,
        247, 247);"][center]     
        [table border="0"][tr][td]PLACE YOUR BANNER HERE!!!![/td]
        [/tr]
        [/table]
         
        [left]Forum URL:
            Description of your forum:
           
            Staff you have on your forum:
       
            Some Links to Hot topic's:
       
           
        [center]       
        [table border="0"][tr][td]SCREEN SHOTS OF YOUR FORUM!!!![/td]
        [/tr]
        [/table]
        [left]Other Info you think member would like to read:[/left]
          [/center]
          [/left]
          [/center]
          [/td]
        [/tr]
        [/table]
        [table
        class="posting-table" style="border-left: 3px solid
        rgb(144,144,144);border-radius: 0px 0px 3px 3px; border-right: 3px solid
        rgb(144,144,144); border-bottom: 3px solid rgb(144,144,144);"
        cellspacing="0" width="100%"][tr][td style="background: rgb(247, 247,
        247) none repeat scroll 0% 0%; text-align: justify;
        -moz-background-clip: border; -moz-background-origin: padding;
        -moz-background-inline-policy: continuous; padding-left:
        5px;"][center][font=Verdana][b][font=FontAwesome][size=18][size=26][color=#000000][/color][/size][/size][/font][color=#000000]A[/color][color=#0066cc]
        [color=#707070]chat World[/color][/color] [color=#000000]Official Forum
        Promotion Post[/color][/b][/font][/center]
          [/td]
        [td
        style="background: transparent
        url(http://i86.servimg.com/u/f86/19/37/39/66/bottom11.png) No-repeat
        scroll 0% 0%; -moz-background-clip: border; -moz-background-origin:
        padding; -moz-background-inline-policy: continuous;" height="100"
        width="140"][/td]
        [/tr]
        [/table]';

      $(function() {
        if ($.sceditor) {
          $.sceditor.command.set('promotion', {

            // WYSIWYG MODE
            exec : function() {
              this.insertText(faPromoTemp);
            },

            // SOURCE MODE
            txtExec : function() {
              this.insertText(faPromoTemp);
            }

          });

          toolbar += '|promotion';
        }
      });
    }





Here, try replacing the above script with this one :

Code:

if (/\/post?f=22&mode=newtopic/.test(window.location.href)) {
  document.write('<stye type="text/css">.sceditor-button-promotion div { background-image:url(http://i86.servimg.com/u/f86/12/23/10/57/act10.png) !important; }</style>');
 
  window.faPromoTemp = '[table class="posting-table" style="border: 3px solid\nrgb(144,144,144);border-bottom: 0px solid\nrgb(144,144,144);border-radius: 3px 3px 0px 0px;" cellspacing="0"\nwidth="100%"][tr][td style="background-image:\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bw_lef11.png);\nbackground-repeat: no-repeat;" height="100" width="152"][/td]\n[td\nstyle="background: transparent\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bwcent11.png) repeat scroll\n 0% 0%; -moz-background-clip: border; -moz-background-origin: padding;\n-moz-background-inline-policy: continuous; padding-bottom:\n15px;"][center][size=16][color=#707070][b][font=Georgia]NEW TEXT\nHERE!![/font][/b][/color][/size][/center]\n  [/td]\n[td\nstyle="background-image:\nurl(http://i86.servimg.com/u/f86/19/37/39/66/forum_11.png);\nbackground-repeat: no-repeat;" width="84"][/td]\n[/tr]\n[/table]\n[table\n class="posting-table" style="border-left: 3px solid rgb(144,144,144);\nborder-right: 3px solid rgb(144,144,144); border-bottom: 1px solid\nrgb(0, 114, 149);" cellspacing="0" width="100%"][tr][td\nstyle="padding-left: 5px; padding-right: 5px; background-color: rgb(247,\n 247, 247);"][center]      \n[table border="0"][tr][td]PLACE YOUR BANNER HERE!!!![/td]\n[/tr]\n[/table]\n  \n[left]Forum URL:\n    Description of your forum:\n    \n    Staff you have on your forum:\n \n    Some Links to Hot topic\'s:\n \n    \n[center]        \n[table border="0"][tr][td]SCREEN SHOTS OF YOUR FORUM!!!![/td]\n[/tr]\n[/table]\n[left]Other Info you think member would like to read:[/left]\n  [/center]\n  [/left]\n  [/center]\n  [/td]\n[/tr]\n[/table]\n[table\n class="posting-table" style="border-left: 3px solid\nrgb(144,144,144);border-radius: 0px 0px 3px 3px; border-right: 3px solid\n rgb(144,144,144); border-bottom: 3px solid rgb(144,144,144);"\ncellspacing="0" width="100%"][tr][td style="background: rgb(247, 247,\n247) none repeat scroll 0% 0%; text-align: justify;\n-moz-background-clip: border; -moz-background-origin: padding;\n-moz-background-inline-policy: continuous; padding-left:\n5px;"][center][font=Verdana][b][font=FontAwesome][size=18][size=26][color=#000000][/color][/size][/size][/font][color=#000000]A[/color][color=#0066cc]\n [color=#707070]chat World[/color][/color] [color=#000000]Official Forum\n Promotion Post[/color][/b][/font][/center]\n  [/td]\n[td\nstyle="background: transparent\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bottom11.png) No-repeat\nscroll 0% 0%; -moz-background-clip: border; -moz-background-origin:\npadding; -moz-background-inline-policy: continuous;" height="100"\nwidth="140"][/td]\n[/tr]\n[/table]';
 
  $(function() {
    if ($.sceditor) {
      $.sceditor.command.set('promotion', {
 
        // WYSIWYG MODE
        exec : function() {
          this.insertText(faPromoTemp);
        },
 
        // SOURCE MODE
        txtExec : function() {
          this.insertText(faPromoTemp);
        }
 
      });
 
      toolbar += '|promotion';
    }
  });
}

No mate still missing the icon

Oooooh I found the problem.. I forgot to escape the question mark.

Try now :

Code:

if (/\/post\?f=22&mode=newtopic/.test(window.location.href)) {
  document.write('<stye type="text/css">.sceditor-button-promotion div { background-image:url(http://i86.servimg.com/u/f86/12/23/10/57/act10.png) !important; }</style>');
 
  window.faPromoTemp = '[table class="posting-table" style="border: 3px solid\nrgb(144,144,144);border-bottom: 0px solid\nrgb(144,144,144);border-radius: 3px 3px 0px 0px;" cellspacing="0"\nwidth="100%"][tr][td style="background-image:\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bw_lef11.png);\nbackground-repeat: no-repeat;" height="100" width="152"][/td]\n[td\nstyle="background: transparent\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bwcent11.png) repeat scroll\n 0% 0%; -moz-background-clip: border; -moz-background-origin: padding;\n-moz-background-inline-policy: continuous; padding-bottom:\n15px;"][center][size=16][color=#707070][b][font=Georgia]NEW TEXT\nHERE!![/font][/b][/color][/size][/center]\n  [/td]\n[td\nstyle="background-image:\nurl(http://i86.servimg.com/u/f86/19/37/39/66/forum_11.png);\nbackground-repeat: no-repeat;" width="84"][/td]\n[/tr]\n[/table]\n[table\n class="posting-table" style="border-left: 3px solid rgb(144,144,144);\nborder-right: 3px solid rgb(144,144,144); border-bottom: 1px solid\nrgb(0, 114, 149);" cellspacing="0" width="100%"][tr][td\nstyle="padding-left: 5px; padding-right: 5px; background-color: rgb(247,\n 247, 247);"][center]      \n[table border="0"][tr][td]PLACE YOUR BANNER HERE!!!![/td]\n[/tr]\n[/table]\n  \n[left]Forum URL:\n    Description of your forum:\n    \n    Staff you have on your forum:\n \n    Some Links to Hot topic\'s:\n \n    \n[center]        \n[table border="0"][tr][td]SCREEN SHOTS OF YOUR FORUM!!!![/td]\n[/tr]\n[/table]\n[left]Other Info you think member would like to read:[/left]\n  [/center]\n  [/left]\n  [/center]\n  [/td]\n[/tr]\n[/table]\n[table\n class="posting-table" style="border-left: 3px solid\nrgb(144,144,144);border-radius: 0px 0px 3px 3px; border-right: 3px solid\n rgb(144,144,144); border-bottom: 3px solid rgb(144,144,144);"\ncellspacing="0" width="100%"][tr][td style="background: rgb(247, 247,\n247) none repeat scroll 0% 0%; text-align: justify;\n-moz-background-clip: border; -moz-background-origin: padding;\n-moz-background-inline-policy: continuous; padding-left:\n5px;"][center][font=Verdana][b][font=FontAwesome][size=18][size=26][color=#000000][/color][/size][/size][/font][color=#000000]A[/color][color=#0066cc]\n [color=#707070]chat World[/color][/color] [color=#000000]Official Forum\n Promotion Post[/color][/b][/font][/center]\n  [/td]\n[td\nstyle="background: transparent\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bottom11.png) No-repeat\nscroll 0% 0%; -moz-background-clip: border; -moz-background-origin:\npadding; -moz-background-inline-policy: continuous;" height="100"\nwidth="140"][/td]\n[/tr]\n[/table]';
 
  $(function() {
    if ($.sceditor) {
      $.sceditor.command.set('promotion', {
 
        // WYSIWYG MODE
        exec : function() {
          this.insertText(faPromoTemp);
        },
 
        // SOURCE MODE
        txtExec : function() {
          this.insertText(faPromoTemp);
        }
 
      });
 
      toolbar += '|promotion';
    }
  });
}

No still nothing

The button works, but I made a mistake on the stylesheet. This should be the last edit, try it now :

Code:

if (/\/post\?f=22&mode=newtopic/.test(window.location.href)) {
  document.write('<style type="text/css">.sceditor-button-promotion div { background-image:url(http://i86.servimg.com/u/f86/12/23/10/57/act10.png) !important; }</style>');
 
  window.faPromoTemp = '[table class="posting-table" style="border: 3px solid\nrgb(144,144,144);border-bottom: 0px solid\nrgb(144,144,144);border-radius: 3px 3px 0px 0px;" cellspacing="0"\nwidth="100%"][tr][td style="background-image:\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bw_lef11.png);\nbackground-repeat: no-repeat;" height="100" width="152"][/td]\n[td\nstyle="background: transparent\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bwcent11.png) repeat scroll\n 0% 0%; -moz-background-clip: border; -moz-background-origin: padding;\n-moz-background-inline-policy: continuous; padding-bottom:\n15px;"][center][size=16][color=#707070][b][font=Georgia]NEW TEXT\nHERE!![/font][/b][/color][/size][/center]\n  [/td]\n[td\nstyle="background-image:\nurl(http://i86.servimg.com/u/f86/19/37/39/66/forum_11.png);\nbackground-repeat: no-repeat;" width="84"][/td]\n[/tr]\n[/table]\n[table\n class="posting-table" style="border-left: 3px solid rgb(144,144,144);\nborder-right: 3px solid rgb(144,144,144); border-bottom: 1px solid\nrgb(0, 114, 149);" cellspacing="0" width="100%"][tr][td\nstyle="padding-left: 5px; padding-right: 5px; background-color: rgb(247,\n 247, 247);"][center]      \n[table border="0"][tr][td]PLACE YOUR BANNER HERE!!!![/td]\n[/tr]\n[/table]\n  \n[left]Forum URL:\n    Description of your forum:\n    \n    Staff you have on your forum:\n \n    Some Links to Hot topic\'s:\n \n    \n[center]        \n[table border="0"][tr][td]SCREEN SHOTS OF YOUR FORUM!!!![/td]\n[/tr]\n[/table]\n[left]Other Info you think member would like to read:[/left]\n  [/center]\n  [/left]\n  [/center]\n  [/td]\n[/tr]\n[/table]\n[table\n class="posting-table" style="border-left: 3px solid\nrgb(144,144,144);border-radius: 0px 0px 3px 3px; border-right: 3px solid\n rgb(144,144,144); border-bottom: 3px solid rgb(144,144,144);"\ncellspacing="0" width="100%"][tr][td style="background: rgb(247, 247,\n247) none repeat scroll 0% 0%; text-align: justify;\n-moz-background-clip: border; -moz-background-origin: padding;\n-moz-background-inline-policy: continuous; padding-left:\n5px;"][center][font=Verdana][b][font=FontAwesome][size=18][size=26][color=#000000][/color][/size][/size][/font][color=#000000]A[/color][color=#0066cc]\n [color=#707070]chat World[/color][/color] [color=#000000]Official Forum\n Promotion Post[/color][/b][/font][/center]\n  [/td]\n[td\nstyle="background: transparent\nurl(http://i86.servimg.com/u/f86/19/37/39/66/bottom11.png) No-repeat\nscroll 0% 0%; -moz-background-clip: border; -moz-background-origin:\npadding; -moz-background-inline-policy: continuous;" height="100"\nwidth="140"][/td]\n[/tr]\n[/table]';
 
  $(function() {
    if ($.sceditor) {
      $.sceditor.command.set('promotion', {
 
        // WYSIWYG MODE
        exec : function() {
          this.insertText(faPromoTemp);
        },
 
        // SOURCE MODE
        txtExec : function() {
          this.insertText(faPromoTemp);
        }
 
      });
 
      toolbar += '|promotion';
    }
  });
}

Yes it works now thank you so so much


Just one more thing if i want the same thing in the Charity Promotions forum do i use the same code just change the 22 to the one i want to post in ?

I see Ange is offline; yes APE I believe you just add the code again and change the 22.

Thank you Topic solved with thanks to my buddy's @Ange Tuteur and @Forumedic Coffee and cookies all round

Topic solved and archived