Оформляем ссылки на сообщение либо тему в виде открыток.

С помощью этого скрипта можно красочно оформлять цитаты. Хотя на самом деле это оформление ссылок на чьё-то сообщение (открытки). Работает внутри форума, ссылки с других сайтов не работают.
  Что для этого нужно.. Копируем ссылку на пост правой кнопкой мышки и вставляем её в любом месте. В итоге получаем такую красоту:

Панель Управления Модули HTML & JAVASCRIPT Управление кодами JavaScript Расположение:      На всех страницах

Код:

$(function() {
   var a = $('.postbody a'),
      version = $('.bodylinewidth')[0] ? 0 : document.getElementById('wrap') ? 1 : $('div.pun')[0] ? 2 : document.getElementById('ipbwrapper') ? 3 : document.getElementById('fa_edge') ? 4 : 'badapple';
 
  // или ошибки уведомления
  if (version == 'badapple' || !window.JSON || !window.localStorage) {
    var errString = 'Плагин "fa_post_card" не может быть исполнен, потому что : ';
 
    if (version == 'badapple') errString += '\nВаша версия форума не поддерживается.';
    if (!window.JSON) errString += '\nJSON не поддерживается вашим браузером';
    if (!window.localStorage) errString += '\nAPI хранилища не поддерживается вашим браузером.';
 
    window.console && console.error ? console.error(errString) : alert(errString);
    return;
  }
 
  window.fa_post_card = {
    summary_length : 160, // максимальная длина символа для сообщений в открытках
        cache_time : 1*60*60*1000, // количество времени, в течение которого карты кэшируются (1 час)
 
    // языковая конфигурация
    lang : {
      error : {
          name : 'Ошибка',
          title : 'ПОСТ НЕ НАЙДЕН',
        summary : 'Пост, который Вы пытались просмотреть не может быть найден или не доступен для вас.'
      },
 
        no_name : 'Аноним',
      no_avatar : 'https://illiweb.com/fa/invision/pp-blank-thumb-38px.png',
        no_title : 'Название не доступно',
      no_summary : 'Нет сводных данных',
      no_origin : 'Нет доступных происхождения',
        tooltip : 'Нажмите, чтобы посмотреть полный пост'
    },
 
          a : a, // якорный кеш
      index : -1, // индекс привязки
      quota : a.length, // общий кеш привязки
    version : version, // версия форума
 
    // селекторы
    select : {
      content : ['.postbody > div', '.content > div', '.entry-content > div:first > div', '.post-entry > div:first', '.content > div'],
        title : ['.postdetails:has(.sprite-icon_miniposted)', '.topic-title', '.posthead a', '.postbody-head a', '.topic-title'],
        avatar : ['.poster-profile a img', '.postprofile dt img', '.user-basic-info img:first', '.postprofile dt img', '.postprofile .user-avatar img'],
      username : ['.name', '.postprofile dt > strong', '.username', '.postprofile dt > strong', '.postprofile .username']
    },
 
    // избежать HTML-тегов
    sanitize : function(str) {
      if (str) {
        return str.replace(/<|>/gm, function(M) {
          switch (M) {
            case '<' :
              return '<';
 
            case '>' :
              return '>';
          }
        });
      } else {
        return '';
      }
    },
 
    // создать открытку
    createCard : function(anchor, post, ver) {
      // переменные для содержимого карты
      var o = {
        username : post ? $(fa_post_card.select.username[ver], post).text() : fa_post_card.lang.error.name,
          avatar : post ? $(fa_post_card.select.avatar[ver], post).attr('src') : fa_post_card.lang.no_avatar,
          title : post ? $(fa_post_card.select.title[ver], post).text() : fa_post_card.lang.error.title,
        summary : post ? $(fa_post_card.select.content[ver], post).text() : fa_post_card.lang.error.summary,
          origin : anchor.innerHTML
      },
      id = o.origin.replace(/.*?#(\d+)$/, '$1'),
      cards = localStorage.fa_post_cards ? JSON.parse(localStorage.fa_post_cards) : {},
      i;
 
      // избегать HTML-тегов, чтобы снизить риск XSS-атак
      for (i in o) {
        o[i] = fa_post_card.sanitize(o[i]);
      }
 
      anchor.className += ' fa_post_card';
      anchor.title = fa_post_card.lang.tooltip;
 
      // структура карты
      anchor.innerHTML = '<div class="fa_card_inner">'+
        '<div class="fa_card_left">'+
          '<img class="fa_card_avatar" src="' + ( o.avatar ? o.avatar : fa_post_card.lang.no_avatar ) + '"/>'+
          '<div class="fa_card_username">' + ( o.username ? o.username : fa_post_card.lang.no_name ) + '</div>'+
        '</div>'+
 
        '<div class="fa_card_right">'+
          '<div class="fa_card_title"><h2>' + ( o.title ? o.title : fa_post_card.lang.no_title ) + '</h2></div>'+
          '<div class="fa_card_summary"><p>' + ( o.summary ? ( o.summary.length > fa_post_card.summary_length ? o.summary.slice(0, fa_post_card.summary_length) + '...' : o.summary ) : fa_post_card.lang.no_summary ) + '</p></div>'+
          '<div class="fa_card_origin">' + ( o.origin ? o.origin.replace(/http:\/\//, '') : fa_post_card.lang.no_origin ) + '</div>'+
        '</div>'+
 
        '<div class="fa_card_clear"></div>'+
      '</div>';
 
      // сохраните данные карты в объекте карты
      if (!cards[anchor.host]) {
        cards[anchor.host] = {};
      }
 
      cards[anchor.host]['card' + id] = {
        data : anchor.innerHTML,
        expires : +new Date
      };
 
      localStorage.fa_post_cards = JSON.stringify(cards);
    },
 
    // получите и превратите ссылку в карточку
    get : function() {
      var a = fa_post_card.a[++fa_post_card.index],
          cards = localStorage.fa_post_cards ? JSON.parse(localStorage.fa_post_cards) : {},
          reg = /#\d+$/, // сопоставьте хэш сообщения
          id,
          post;
 
      // убедитесь, что фиксатор содержит хэш-значение в href и HTML-контент
      if (a && reg.test(a.innerHTML) && reg.test(a.href)) {
        id = a.href.replace(/.*?#(\d+)$/, '$1'); // идентификатор сообщений
        post = $('.post--' + id)[0]; // селектор сообщений
 
        // получите данные карты, если они кэшированы
        if (cards[a.host] && cards[a.host]['card' + id] && cards[a.host]['card' + id].data && cards[a.host]['card' + id].expires > +new Date - fa_post_card.cache_time) {
          a.className += ' fa_post_card';
          a.title = fa_post_card.lang.tooltip;
          a.innerHTML = cards[a.host]['card' + id].data;
        } else {
          // если сообщение присутствует на странице мы получим его по идентификатору
          if (post) {
            fa_post_card.createCard(a, post, fa_post_card.version);
          } else {
            // в противном случае нам нужно получить данные post через AJAX
            $.get(a.href.replace(reg, '') + '?change_version=prosilver', function(d) {
              var post = $('.post--' + id, d)[0];
              fa_post_card.createCard(a, post, new RegExp(window.location.host).test(a.href) ? fa_post_card.version : 1); // измените версию на prosilver, чтобы можно было получить внешние почтовые открытки
            }).error(function() {
              fa_post_card.createCard(a);
            });
          }
        }
      }
 
      // продолжайте перебирать якорный массив до тех пор, пока мы не достигнем квоты
      if (fa_post_card.index < fa_post_card.quota) {
        fa_post_card.get();
      }
    }
 
  };
 
  fa_post_card.get(); // начните повторять якоря
});
 
 
document.write('<style type="text/css">a.fa_post_card{font-size:12px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;text-decoration:none!important;color:#333!important;background:#FFF;border:1px solid #CCC;border-radius:10px;display:block;width:600px;max-width:100%;min-height:100px;overflow:hidden;position:relative;margin:3px 0}.fa_card_inner{margin-left:125px}.fa_card_left{text-align:center;background:#EEE;border-right:1px solid #CCC;position:absolute;top:0;left:0;bottom:0;width:125px}.fa_card_avatar{height:50px;width:50px;position:absolute;top:50%;left:50%;margin:-35px 0 0 -25px}.fa_card_username{font-size:12px;font-weight:700;position:absolute;top:50%;left:0;right:0;margin-top:20px}.fa_card_title h2{color:#333;font-size:14px;font-weight:700;border:none;margin:0}.fa_card_summary p{font-size:12px;margin:0}.fa_card_origin{color:#999}.fa_card_origin,.fa_card_summary p,.fa_card_title h2{padding:3px 10px}.fa_card_origin,.fa_card_title h2,.fa_card_username{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fa_card_clear{clear:both}</style>');
 

Стили CSS прописаны в скрипте уже (самая нижняя строка). Можете поменять стиль на свой.

Разжатый стиль CSS:

Код:

a.fa_post_card {
    font-size: 12px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    text-decoration: none !important;
    color: #333 !important;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 10px;
    display: block;
    width: 600px;
    max-width: 100%;
    min-height: 100px;
    overflow: hidden;
    position: relative;
    margin: 3px 0;
}
.fa_card_inner {
    margin-left: 125px;
}
.fa_card_left {
    text-align: center;
    background: #eee;
    border-right: 1px solid #ccc;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 125px;
}
.fa_card_avatar {
    height: 50px;
    width: 50px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -35px 0 0 -25px;
}
.fa_card_username {
    font-size: 12px;
    font-weight: 700;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin-top: 20px;
}
.fa_card_title h2 {
    color: #333;
    font-size: 14px;
    font-weight: 700;
    border: none;
    margin: 0;
}
.fa_card_summary p {
    font-size: 12px;
    margin: 0;
}
.fa_card_origin {
    color: #999;
}
.fa_card_origin,
.fa_card_summary p,
.fa_card_title h2 {
    padding: 3px 10px;
}
.fa_card_origin,
.fa_card_title h2,
.fa_card_username {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.fa_card_clear {
    clear: both;
}
 

Вы можете отредактировать его на свой вкус или в соответствии с дизайном вашего форума, максимально сжать обратно в любом онлайн-сервисе и заменить в скрипте.

Как настраивать..
Из скрипта удаляете строку со стилем (или закомментите) на время. Указанный мною разжатый код помещаете в таблицу стилей CSS и подбираете варианты настроек.