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.

Buttons to add prefixes in topic titles

Go down

Tutorial Buttons to add prefixes in topic titles

Post by Ange Tuteur July 14th 2014, 9:26 pm

Buttons to add prefixes in topic titles



With this tutorial you will be able to add more prefixes in the "Modify topic title" field for your Forumotion forum, as in the example below.

prefixes - Buttons to add prefixes in topic titles Screen17

This way you will be able to add more common prefixes such as :

  • [Solved] Solved
  • [Progress] In progress
  • [Accepted] Accepted



1. Installation
Go to Administration Panel ► Modules ► Javascript codes management and create a new JavaScript code.

Title : Your choice
Placement : In all the pages
Paste the code below and submit.
Code:
jQuery(document).ready(function() {
jQuery('#modif_topic_title').after('<input type="button" value="LABEL" onclick="set_solved(this.form.elements[\'modif_topic_title\'],\'[CONTENT]\')" style="display: inline;" id="button_label">');
});


2. Modifications
LABEL : is the content you want to show members so they know what that button is for
Note : The label and content don't have to be the same

[CONTENT] : This is the content that will be added to the title when the button is clicked

Exclamation Attention : if you need to use characters like (') or quotes ("), you must use the escape character (\) before them
example: he said "hello"
code:
Code:
he said "hello"


3. Customization
Go to Administration Panel ► Display ► Colors ►CSS stylesheet and add the following code

Code:
#button_label {
/*style*/
}

You can replace /*style*/ with any of the properties below to customize the button style.

  • color: #000;: edit the color of the text
  • background-image: url('LINK');: add a background image
  • background-color: #000;: edit the color of the background
  • border: 1px solid #000:: you can edit the fullness of the line (1px), the style (solid, dashed) and the color (#000)
  • box-shadow: 1px 1px 1px #000: you can add a shadow in the three dimensions (1px, 1px, 1px) and the color
  • border-radius: 2px;: you can round the corners of the button
  • opacity: 0.7: with a value between 0 and 1 you can make it a bit transparent


How does it work?
You just have to click on a button and the content associated will be added in the title

Can I add more than one button?
Sure, just add the code more than one time, editing it with different values

Can I add more than one prefix in the title?
Sure, you just have to click on the buttons and the prefixes will be added one by one

How to remove a prefix?
Just click again on the button you used to add it


Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

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