<style>
.stena .post-content {display: none;}
.stena .post-content.hide {display: none !important;}

.stena {text-align: center;}
.stena .post-content {text-align: left;}
.stena .post-content:hover .podtext {opacity: 1;}

.stena .post-content.show {
display: inline-block;
width: 210px; /* максимальная ширина блока с подарком */
height: 210px; /* максимальная высота блока с подарком */
margin: 5px;
position: relative;
overflow: visible;
}

.stena .podimg img {
display: block;
position: absolute;
top: 0;
left: 0;
border-radius: 50%; /* закругление подарка в кружочек ( если не нужно - удалить эту строчку) */
z-index: 10;
max-width: 190px; /* максимальная ширина подарка */
max-height: 190px; /* максимальная высота подарка */
background-color: #ccc; /* цвет фона подарка */
border: 5px solid #284966; /* бордюрчик вокруг подарка (если не нужно - удалить строчку, если нужно меняем #284966 на свой цвет */
}

.stena .stenaava {
display: block;
position: absolute;
z-index: 30;
border-radius: 50%;
max-width: 34px; /* максимальная ширина авы дарителя */
left: 20px; /* двигаем аву дарителя влево */
top: 0px; /* двигаем аву дарителя сверху */
background-color: #224463; /* цвет фона авы */
border: 3px solid #214261; /* бордюрчик вокруг авы (если не нужно - удалить строчку, если нужно меняем #284966 на свой цвет */
}

.stena .stenafrom {
position: absolute;
z-index: 20;
background-color: #234563;  /* цвет фона на нике дарителя */
color: #fff;  /* цвет текста на нике дарителя */
font-size: 14px; /* размер шрифта в нике дарителя */
padding: 5px;
border-radius: 5px;  /* закругление границ (если не надо - удалить) */
transition: all 0.8s;
-webkit-transition: all 0.8s;
left: 40px; /* двигаем ник дарителя влево */
top: 0px; /* двигаем ник сверху */
padding-left: 25px; /* фоновый отступ слева (убрать, если не нужно) */
}

.stena .podtext {
position: absolute;
z-index: 40;
font-size: 14px; /* размер шрифта всплывающего описания */
background-color: #90a2c6;  /* цвет фона всплывающего описания */
padding: 5px;
border-radius: 5px; /* закругление границ (если не надо - удалить) */
text-align: left !important;
opacity: 0;
transition: all 0.8s;
-webkit-transition: all 0.8s;
top: 32px; /* двигаем всплывающее описание сверху */
width: 250px; /* ширина всплывающего описания */
}

.stena .podtext:before {
content: '';
border: 10px solid transparent; 
border-bottom: 10px solid #90a2c6; /* цвет фона всплывающего описания ЕЩЕ РАЗ (это стрелочка, меняем #90a2c6 на цвет, который вставляли для описания выше) */
position: absolute;
top: -18px; /* двигаем стрелочку вверх */
left: 60px; /* двигаем стрелочку влево */
z-index: 40;
}
.stena .post-content .podtext img {
max-width: 100px; /* максимальная ширина картинок в всплывающем ОПИСАНИИ (тексте дарителя) */
max-height: 50px; /* максимальная высота картинок в всплывающем ОПИСАНИИ (тексте дарителя) */
}

.stena .stenalink { /* ссылка "подарить подарок" */
display: block;
text-align: center;
font-size: 18px; /* размер текста */
text-transform: uppercase;
background-color: #b5cde3; /* цвет фона */
color: #1f4160; /* цвет текста */
padding: 5px;
text-decoration: none;
transition: all 0.8s;
-webkit-transition: all 0.8s;
}
.stena .stenalink:hover { /* ссылка "подарить подарок" при наведении курсора */
text-decoration: none;
color: #fff; /* цвет текста */
background-color: #507ca4; /* цвет фона */
}
</style>

<script language="javascript">
var ot = 1; //отображение сообщений на стене 0 по убыванию, 1 по возрастанию
var mc = 20; //число отображаемых сообщений из темы
var anyava = 'https://forumstatic.ru/files/0000/14/1c/20038.jpg';//аватар по умолчанию для тех, у кого он не установлен

if($('#profile-signature').length){
var LoginU = $('#profile-name').text(), ss = $('#profile-signature >ul >p >a[href*="viewtopic.php"]').eq(-1), si =parseInt($(ss).attr('href').split(/=/)[1]), as = [],
blk = '<article class="stena"><h1>Последние подарки пользователя</h1>';
$.get('/export.php?type=atom&tid='+si+'&max='+mc, function(d) {
var d2 = $(d).find('entry');
$(d2).each(function (i){
as[i] = {a: $(this).find('name').text(), b: $(this).find('content').text()};
});	
function fs(arr){for (var i in arr){(arr[i].a==LoginU)? blk +='<div id ="s-'+i+'" class="mypost post-content">' : blk +='<div id ="s-'+i+'" class="anypost post-content">';
blk +='<img alt="'+arr[i].a+'"  src="" class="stenaava"><div class="stenafrom">'+arr[i].a+'</div>'+arr[i].b+'</div>';
}};
var unq = [...new Set(as.map(item => 'username[]='+item.a))].join('&');
$.getJSON('/api.php?method=users.get&'+unq+'&fields=avatar,username',function(j) {
var x = j.response.users;
for (var k in x){if (x[k].avatar=='') {x[k].avatar=anyava}; $('div[id*="s-"]>img[alt="'+x[k].username+'"]').attr('src',x[k].avatar);}
});
(ot==1)? fs(as): fs(as.reverse());
blk +='<a href="/viewtopic.php?id='+si+'" class="stenalink">Подарить подарок</a></article>';
$('#profile-signature').after(blk);
$('div[id*="s-"]').each(function (){
if( $(this).find('div.podarok').length ){$(this).addClass('show')}
});
$('div[id*="s-"]').each(function (){
if( $(this).find('div.shablon').length ){$(this).addClass('hide')}
});
});}
</script>

[block=podarok][block=podtext]

Ваш текст
Ваш текст
Ваш текст

[/block][block=podimg]

[img]ссылка на картинку подарка[/img]

[/block][/block]

$('#viewprofile #pa-fld1 strong a[href*="viewtopic.php"]')

[block=podarok][block=podtext]
 
Ваш текст
Ваш текст
Ваш текст
 
[/block][block=podimg]
 
[img]ссылка на картинку подарка[/img]
 
[/block][/block]