Add Image to the Right of the Username

[Raina]

I would like to place an image to the right of the username and online status. Please refer to the attached image.

I understand I need to modify the postbit template but I cant seem to get it in the right place.

Using vbulletin 4.2.3.

Can someone help?

Edit: Sorry should have posted this in the design and styles forum.

[MarkFL]

Rather than hack your template, create a plugin hooked at "postbit_display_complete" and use something like this for the Plugin PHP Code :

$template_hook['postbit_userinfo_left'] .= 'put image element here';

[TheLastSuperman]

You must 'Like' someone else's post before liking any more by MarkFL.

I'm trying here! +1 via my comment then!

[Raina]

Thanks Mark, can I build on the problem a little. I was hoping to actually display an image based on the users secondary group. This is what I originally had:

<vb:if condition="is_member_of($post,14)">
<img src="https://s32.postimg.org/5dc09irbp/mh_MJw6_U.png" />
</vb:if>
<vb:if condition="is_member_of($post,32)">
<img src="https://s32.postimg.org/h8jobvrud/gold.png" />
</vb:if>

How can I add that into the template hook?

[MarkFL]

Actually, your best bet here is to use vBulletin's "User Ranks" feature. With it, you can associate images or HTML with specific usergroups and it will be displayed in the location you specified.

However, if you would rather use a plugin, then you could use the code:

$imagesrc = '';

if (is_member_of($post, array(14)))
{
$imagesrc = '5dc09irbp/mh_MJw6_U.png';
}
elseif (is_member_of($post, array(32)))
{
$imagesrc = 'h8jobvrud/gold.png';
}

if ($imagesrc)
{
$image = '<img src="https://s32.postimg.org/' . $imagesrc . '" />';
$template_hook['postbit_userinfo_left'] .= $image;
}

[Raina]

Thanks for the code. Unfortunately it displays the image underneath the users title. I was hoping to display to the right of the username and title. Is that possible?

See the image for details.

[MarkFL]

Okay, create a plugin hooked at "parse_templates" with the code:

if (THIS_SCRIPT === 'showthread')
{
$template_hook['headinclude_css'] .= '<style>.postbit_badge {position: relative; left: 100px; top: -30px}</style>';
}

You can adjust the left and top values to your liking.

You could add what's inside the "style" tags to the plugin I posted in your other thread about preventing the join date from wrapping. ;)

And then change the code I posted above to:

$imagesrc = '';

if (is_member_of($post, array(14)))
{
$imagesrc = '5dc09irbp/mh_MJw6_U.png';
}
elseif (is_member_of($post, array(32)))
{
$imagesrc = 'h8jobvrud/gold.png';
}

if ($imagesrc)
{
$image = '<img class="postbit_badge" src="https://s32.postimg.org/' . $imagesrc . '" />';
$template_hook['postbit_userinfo_left'] .= $image;
}

[Raina]

That worked perfectly - thanks very much. :)

[MarkFL]

That worked perfectly - thanks very much. :)

Glad to help. :D