<script>
var input = document.getElementById('wallTxt');
input.onkeyup = (function() {
return function() {
var tt = this.value;
var links = tt.match(/[-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?/gi);
var first_link = links[0];
if(first_link.indexOf('http://')==-1){
if(first_link.indexOf('https://')==-1){
first_link = 'http://'+first_link;
}
}
$('.ssPost').val(''+first_link+'');
$('.ssPostFav').html('<img src="http://www.google.com/s2/favicons?domain='+first_link+'" style="float: left;margin-right: 10px;"> '+first_link+'');
$('.impostss').html('<img src="http://mini.s-shot.ru/1280x1024/1000/jpeg/?'+first_link+'">');
$('.impostss').attr("href",''+first_link+'');
$('.ssPostImgSiti').addClass('ssPostImgSitid');
}

})();

$(document).ready(function(){
$(".ssPostnonpost").click(function(){
$('.ssPost').val('');
$('.ssPostImgSiti').toggleClass('ssPostImgSitid');
});

});

</script>

<div class="ssPostImgSiti">
<div class="ssPostnonpost"><i class="fa fa-times" aria-hidden="true"></i> Скрыть блок ссылки</div>
<div class="ssPostFav" ><img src="http://www.google.com/s2/favicons?domain=$OTHER5$" style="float: left;margin-right: 10px;"> $OTHER5$</div>
<a href="" title="Перейти на сайт" target="_blank" class="impostss"></a>
</div>

<style>
.ssPostImgSiti {position: relative;height: 300px;overflow: hidden;display: none;}
.ssPostImgSitid {display: block;}
.ssPostImgSiti img {
width: 100%;
object-fit: cover;
}
.ssPostFav {
position: absolute;
bottom: 20px;
left: 20px;
z-index: 2;
background: rgba(0,0,0,.7);
padding: 0px 10px;
color: #FFF;
font-size: 11px;
line-height: 30px;
}
.ssPostFav img {width: 18px;height: 18px;object-fit: cover;float: left;margin: 5px 0;}
</style>