Replace Quick Reply and Go Advanced Buttons with Custom Images

[stranlaw]

Hi...I want to replace the default Quick Reply and Go Advanced buttons with images that I've made. Could someone instruct me how to do that?

[Toupsx]

Originally Posted by stranlaw

Hi...I want to replace the default Quick Reply and Go Advanced buttons with images that I've made. Could someone instruct me how to do that?

currently by default those buttons are a form generated button as a input type="submit" button in the form for quick reply..
in order to change this you can find the form where they are coded in the templates in style manager -> show thread templates -> SHOWTHREAD

Find for quick reply:

<input type="submit" class="button" value="$vbphrase[post_quick_reply]" accesskey="s" title="(Alt + S)" name="sbutton" tabindex="2" id="qr_submit" onclick="clickedelm = this.value" />

Find for go advanced:

<input type="submit" class="button" value="$vbphrase[go_advanced]" accesskey="x" title="(Alt + X)" name="preview" tabindex="3" id="qr_preview" onclick="clickedelm = this.value" />

We can see here that their "style" is controlled by the class "button"

in order to change their appearance you would need to edit that "button" class to your liking or change the class of them in the code to something else you choose and modify that class to your styling likes...

To modify the class "Buttons" by default there should be a selection in style manager -> all style options called "Buttons" with the CSS Selector: .button

with this you can either directly modify it from that control selection changing the colors, fonts, background image, etc. to your liking or go into the CSS and change it there by using

.button{
        
}

to make yours changes.. assuming you know CSS.

[stranlaw]

Thank you so much for the very detailed reply!!

I have one question...would modifiying the button style...would that do it for all the buttons? I would like a specific image I created that says Post Quick Reply and a different image for the Go Advanced button. Is that possible with the method you posted?

Thanks again for your help!!