• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.1 Styling Buttons


Active member
Okay, the links that show up at the bottom of posts ... "Edit" "IP" "Like" "Reply" etc...

Is there a simple way to take those links and make them images instead, like vBulletin and other boards have?

I know I can add HTML / Images to the phrases that correspond with these links, is that the only way? As the skin I have, there is a 1px rounded border around those links which makes an image then have that border, and it looks very strange.


Jake Bunce

XenForo moderator
Staff member
Yeah I would do the phrases.

You can also edit the template:

Admin CP -> Appearance -> Templates -> post

For example, here is the code for the "Like" and "Reply" links in a post:

			<div class="publicControls">
				<a href="{xen:link threads/post-permalink, $thread, 'post={$post}'}" title="{xen:phrase permalink}" class="item muted postNumber hashPermalink OverlayTrigger" data-href="{xen:link posts/permalink, $post}">#{xen:calc '{$post.position} + 1'}</a>
				<xen:hook name="post_public_controls" params="{xen:array 'post={$post}'}">
				<xen:if is="{$post.canLike}">
					<a href="{xen:link posts/like, $post}" class="LikeLink item control {xen:if $post.like_date, unlike, like}" data-container="#likes-post-{$post.post_id}"><span></span><span class="LikeLabel">{xen:if $post.like_date, {xen:phrase unlike}, {xen:phrase like}}</span></a>
				<xen:if is="{$canReply}">
					<a href="{xen:link threads/reply, $thread, 'quote={$post.post_id}'}" data-postUrl="{xen:link posts/quote, $post}" class="ReplyQuote item control reply" title="{xen:phrase reply_quoting_this_message}"><span></span>{xen:phrase reply}</a>
But the phrases are more convenient for this.