Buttons to add prefixes in topic titles Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skin • Return to the skin page

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.
The forum of the forums

    Buttons to add prefixes in topic titles

    Ange Tuteur
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania
    • Post n°1

    Tutorial Buttons to add prefixes in topic titles

    Post by Ange Tuteur July 15th 2014, 1:26 am

    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.

    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



    This tutorial was written by Niko!.
    • Back to top