Как с помощью FBML отобразить вкладку обратной связи UserVoice на странице приложения Facebook?

У меня есть приложение Facebook, использующее FBML, и я хочу включить виджет вкладки обратной связи UserVoice на страницах моего приложения. Я скопировал и вставил JavaScript на свою страницу FBML, но когда Facebook отображает страницу, этот JavaScript удаляется, поэтому вкладка не отображается.

Есть ли у кого-нибудь опыт работы с модифицированной версией JavaScript от Facebook и с получением вкладки UserVoice в работать на странице FBML?

Вот код JavaScript:

<script>
<!--
  var uservoiceJsHost = ("https:" == document.location.protocol) ? "https://uservoice.com" : "http://cdn.uservoice.com";
  document.write(unescape("%3Cscript src='" + uservoiceJsHost + "/javascripts/widgets/tab.js' type='text/javascript'%3E%3C/script%3E"))
//-->
</script>
<script>
<!--
UserVoice.Tab.show({ 
  /* required */
  key: 'callme',
  host: 'callme.uservoice.com', 
  forum: '31286', 
  /* optional */
  alignment: 'left',
  background_color:'#f00', 
  text_color: 'white',
  hover_color: '#06C',
  lang: 'en'
})
//-->
</script>

facebook fbml fbjs uservoice
person CoderDennis    schedule 31.10.2009    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Забудьте о JavaScript. Просто включите следующий HTML:

<style type="text/css">
#uservoice-dialog
{
    display: block;
    margin: -2em auto 0 auto;
    position: absolute;
    text-align: left;
    z-index: 100003;
}
#uservoice-overlay
{
    background-color: #000;
    filter: alpha(opacity=70);
    height: 100%;
    left: 0;
    opacity: .7;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 100002;
}
#uservoice-dialog[id], #uservoice-overlay[id]
{
    position: fixed;
}
#uservoice-overlay p
{
    color: #ddd;
    font: bold 14px arial, sans-serif;
    letter-spacing: -1px;
    margin: 0;
    padding: 5px;
}
#uservoice-dialog #uservoice-dialog-close
{
    background-color: transparent;
    background-position: 0 0;
    background-repeat: no-repeat;
    color: #06c;
    cursor: pointer;
    height: 48px;
    position: absolute;
    right: -12px;
    top: -11px;
    width: 48px;
}
* html.dialog-open body
{
    height: 100%;
}
* html.dialog-open, * html.dialog-open body
{
    overflow: hidden;
}
html.dialog-open object, html.dialog-open embed, * html.dialog-open select
{
    visibility: hidden;
}
* html #uservoice-overlay
{
    width: 110%;
}
* html #uservoice-dialog #uservoice-dialog-close
{
    background: none;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://uservoice.com/images/icons/close.png');
}
a#uservoice-dialog-close
{
    background-image: url(http://cdn.uservoice.com/images/icons/close.png);
}
</style>
<a href="YOUR_USERVOICE_PAGE_URL_HERE" id="uservoice-feedback-tab">Feedback</a>

В результате на вашей странице должна появиться вкладка UserVoice. Вы можете настраивать CSS сколько угодно.

Обратите внимание, что это пропускает модальное диалоговое окно UserVoice (которое в любом случае не очень хорошо работает на Facebook) и перенаправляет пользователей прямо на вашу домашнюю страницу UserVoice.

person Portman    schedule 01.11.2009
comment
Теперь, глядя на это более подробно, у вас есть куча классов css, но как / где вы предлагаете их использовать? - person CoderDennis; 02.11.2009
comment
Единственное, что делает UserVoice JavaScript, это добавляет эти классы и пару элементов на вашу страницу. CSS на самом деле больше, чем вам нужно; если хотите, можете просто выбрать стиль вкладки uservoice-feedback-tab. - person Portman; 02.11.2009

arrow_upward
2
arrow_downward

Вы также можете подписаться на новую вкладку UserVoice Facebook, которая позволяет вам встраивать UserVoice прямо на свои страницы Facebook. Это, наверное, было бы лучшим решением! (Полное раскрытие информации, я соучредитель UserVoice)

www.uservoice.com/facebook

person Scott Rutherford    schedule 01.12.2010
comment
Спасибо, Скотт! Я проверю это. Добро пожаловать в StackOverflow! - person CoderDennis; 07.12.2010
comment
Это относится к страницам Facebook, но как насчет UV для приложений Facebook? - person aalaap; 26.07.2011