В демке четыре сообщения, с разными вариантами оформления и начального срабатывания кнопок в профиле, в зависимости от установки параметров а1 и a2 (*см. начало скрипта, в части, устанавливаемой в HTML низ).

Установка
Кнопки-картинки (ссылки красным) ставим в нужное место перед нужной группой полей.
Число кнопок - произвольное.

В HTML верх

<!-- HTML верх -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика -->
<style>img.post-img-Sp {margin:6px 3px;}
div.tipsy.tipsy-s.Sp-imgSp-img .tipsy-inner{font-size:14px;letter-spacing:1px;}
</style>
<script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/57844.js"></script>

В HTML низ

<!-- HTML низ -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика -->
<script>
var a1 = 0 // 0 - спойлер-аккордеон, 1 - вертикальный спойлер; 3 - обычный спойлер
var a2 = 0 // 0 - Скрытие первой вкладки; 1 - Показ первой вкладки;
var a3 = 0 // Резкость Открытия: 0 - Плавно; 1 - Резко;

var LiArr=new Array(
//При наличии двух косых => // в начале пункта, - пункт не скрывается.

//"pa-author",     //Ник-Нейм
//"pa-avatar",     //Аватар
//"pa-title",      //статус

// 1 кнопка - ссылка на Картинку
//В квадратных скобках, прямо к ссылке можно добавить своё описание (по желанию)
"http://s3.uploads.ru/VymNB.png[Описание 1]",

"pa-reg",        //Зарегистрирован
"pa-invites", //Приглашений
"pa-posts",      //Кол-во сообщений:
"pa-respect",    //Уважение:
"pa-positive",  //Позитив
"pa-sex",        //Пол
"pa-age",        //Возраст
"pa-icq",        //Аська
"pa-ip",         //IP Юзера
"pa-time-visit", //Провел на форуме:
"pa-last-visit", //Последний визит:
//"pa-online",     //Пользователь online - Не засовываем в спойлеры

// 2 кнопка- ссылка на Картинку
"http://s3.uploads.ru/T7hLI.png",

"pa-from",       //Откуда
"pa-fld1",       //Доп.Поле.1

// 3 кнопка- ссылка на Картинку
"http://s3.uploads.ru/VtGQ4.png",

"pa-fld2",      //Доп.Поле.2
"pa-fld3",      //Доп.Поле.3
"pa-fld4",       //Доп.Поле.4
"pa-fld5",       //Доп.Поле.5
//"award",      //Награды(только для rusff и ork)
//"gift",         //Подарки(только для rusff и ork)

//Конец Списка,
"_End"); SetProvilSpoil(a1,a2,a3);
</script>
<!--Конец//=Cпойлер cкрытия Инфы под N-кнопок в Профиле Топик-->

В скрипте расположение Пунктов, установлено так же, как и по умолчанию на форумах mybb.
Пункты в списке - можно переставлять, и они не зависят от их начального положения.
Приведённый вариант, по дефолту, чуть быстрее, если поля не переставлялись в Админке, в  настройках "Поля Профиля", поскольку требует меньше времени на перестановку скриптом.

Пункт активен - //"pa-online" сейчас вытащен из спойлеров.
Для этого необходимо было поставить перед ним две косых //.
Это для последующих установок, к примеру скриптов: офлайн - онлайн картинкой, аналогично можно вытащить из участия в спойлере и любой другой пункт.

Пункты:

//"award",      //Награды(только для rusff и ork)
//"gift",         //Подарки(только для rusff и ork)

Только для для rusff и ork  - снимаем два наклонных слеша только для реально используемого(ых) пунктов.
*Награды и подарки удобнее ставить под последнюю кнопку, особенно если их много.

Совет: При горизонтальном расположении кнопок, симпатичней  их делать несколько длиннее

Для дизайнеров
Селектор для стиля вкладки ul.post-ul-Sp
Селектор для картинки-кнопки .post-img-Sp
Селектор aктивной кнопки .post-img-Sp.active
Селектор кнопки при наведении .post-img-Sp:hover
Селектор подсказки при наведении на кнопку div.tipsy.tipsy-s.Sp-imgSp-img .tipsy-inner

Пример текущего оформления кнопок в DEMO

<!-- HTML верх - Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика -->
<style>img.post-img-Sp {
  margin:1px;
  padding:2px;
  border:transparent 1px dashed;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
    -moz-border-radius:4px;
    -o-border-radius:4px;
    -ms-border-radius:4px;
    border-radius:4px;
}
img.post-img-Sp.active {
    border:#645850 1px dashed;
    -webkit-box-shadow:0px 5px 18px #000;
    -khtml-box-shadow:0px 5px 18px #000;
    -moz-box-shadow:0px 5px 18px #000;
    -ms-box-shadow:0px 5px 18px #000;
    box-shadow: 0px 5px 18px #000;
}
</style>

Дополнительно
Пробная Версия не скрытием, а с растворением-упрозрачниванием вкладки
В HTML верх Замените эти строки:

Код:

<!-- HTML верх -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика -->
<style>img.post-img-Sp {margin:6px 3px;}
div.tipsy.tipsy-s.Sp-imgSp-img .tipsy-inner{font-size:14px;letter-spacing:1px;}
</style>
<script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/57844.js"></script>

На:

<!-- HTML верх -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика -->
<style>img.post-img-Sp {margin:6px 3px;}
div.tipsy.tipsy-s.Sp-imgSp-img .tipsy-inner{font-size:14px;letter-spacing:1px;}
</style>
<script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/44653.js"></script>
<style>
    .post .post-author li[class*="pa-fld"]{
      width:160px;
    }
</style>

В HTML низ замените параметр выделенный красным:

<!-- HTML низ -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика -->
<script>
var a1 = 1 // 0 - спойлер-аккордеон, 1 - вертикальный спойлер; 3 - обычный спойлер
var a2 = 1 // 0 - Скрытие первой вкладки; 1 - Показ первой вкладки;
var a3 = 0 // Резкость Открытия: 0 - Плавно; 1 - Резко;
var LiArr=new Array( ....

На:

<!-- HTML низ -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика -->
    <script>
    var a1 = 1 // 0 - спойлер-аккордеон, 1 - вертикальный спойлер; 3 - обычный спойлер
    var a2 = 1 // 0 - Скрытие первой вкладки; 1 - Показ первой вкладки;
    var a3 = 2 // Резкость Открытия: 0 - Плавно; 1 - Резко; 2 - Fade;