XF 1.2 Embed Member card into a page


New member
Thank you for your quick reply... is there no add-on for such a thing?? im very new to Xenforo! i have tried copying a source code of another and editing the users.. but i can't seem to link the Cards up to the correct user!


in memoriam 1991-2020
The basic functionality that you want to accomplish is in 1.2, but should be able to modify the staff page (linked above) to what you want.


Well-known member

i am making a forum staff page...


i want to be able to embed the staff members member card into the page?

is this possible??
If you don't mind manually doing it, it is certainly possible.

You can get the user ids of a user by hovering over their avatar and looking at the url at the bottom of the page... like if you hover over mine here it ends with .1321giving me a user id of 1321

If you get all of the user ids of staff at your forum I can probably put together an example that would work for you with html and css only.


Well-known member
This example is a reuse of existing xf code just slightly modified, it will display an avatar with the user name under it and a click on the avatar will load the member card.

You can create a page node and paste this in to test it, from there it can be modified however you see fit.

<a class="avatar Av1l" href="members/user.1/" data-avatarhtml="true">
<span class="img l" style="background-image: url('http://www.cmnet.co.uk/data/avatars/l/0/1.jpg')"> </span>

<a class="avatar Av7l" href="members/user.7/" data-avatarhtml="true">
<span class="img l" style="background-image: url('http://www.cmnet.co.uk/data/avatars/l/0/7.jpg')"> </span>

<a class="avatar Av33l" href="members/user.33/" data-avatarhtml="true">
<span class="img l" style="background-image: url('http://www.cmnet.co.uk/data/avatars/l/0/33.jpg')"> </span>

if the config is repetitive im sure i can just continue it? or is much harder than that?
To repeat and add more like the same
(USERID#) = those numbers from the link I spoke of above

<a class="avatar Av(USERID#)l" href="members/user.(USERID#)/" data-avatarhtml="true">
<span class="img l" style="background-image: url('http://www.cmnet.co.uk/data/avatars/l/0/(USERID#).jpg')"> </span>

don't try to copy paste this last example because there is bbcode in it...use the code from the codebox above and this lower one as an example


Ohh yeah...and welcome to the community.