2012-05-14 3 views
1

StumbleUpon публикует Widget script и documents, как использовать его, чтобы вставить кнопку stumbleUpon (они называют это значок), на веб-сайт.Как создать пользовательскую кнопку StumbleUpon?

Вы можете создать разметку для кнопки с their online tool. Это выглядит так:

<!-- Place this tag where you want the su badge to render --> 
<su:badge layout="2" location="http://example.com"></su:badge> 

<!-- Place this snippet wherever appropriate --> 
<script type="text/javascript"> 
    (function() { 
    var li = document.createElement('script'); 
    li.type = 'text/javascript'; 
    li.async = true; 
    li.src = 'https://platform.stumbleupon.com/1/widgets.js'; 
    var s = document.getElementsByTagName('script')[0]; 
    s.parentNode.insertBefore(li, s); 
    })(); 
</script> 

Этот элемент сценария - это всего лишь способ задержать загрузку вещи widgets.js. Просто взглянув на это, я полагаю, что он работает, просматривая документ для элементов <su:badge> и заменяя их iframes. Затем сами iframes получают исходный контент от stumbleupon по адресу, подобному этому: http://badge.stumbleupon.com/badge/embed/4/?url=http%3A%2F%2Fexample.com.

Функция Iframe делает визуально так: enter image description here

Кнопка StumbleUpon является второй один. Я показываю другие для сравнения. Как вы можете видеть, рендеринг StumbleUpon выглядит иначе, чем все остальные ребята. SU делает свою кнопку похожим на «значок», а каждый другой вид виджета в социальных сетях выглядит как ... uh .... кнопка.

Я пытаюсь сделать виджет Stumbleupon похожим на кнопку. Я уверен, что это возможно. Например, mashable делает это (example). Вот как это выглядит:

enter image description here

Как вы можете видеть, кнопка выглядит как StumbleUpon кнопки. Это не значок. Mashable не использует вещь su:badge - они сделали свой собственный тег <a> и стилизовали его.

Визуальный рендеринг не является проблемой; Я могу понять, как сделать span похожим на кнопку, без проблем. Проблема возникает, когда я нажимаю тег или интервал. Мне кажется, что, с IFrame-вещь, которая StumbleUpon использует, он вызывает этот URL, чтобы отправить страницу для совместного использования:

http://www.stumbleupon.com/badge/?url=http%3A//example.com/whatever HTTP/1.1

Функция Iframe используется в JavaScript window.open для запроса , и ограничивает изменение размера и так далее. Так оно работает на mashable. В результате окно выглядит следующим образом:

enter image description here

Это также то, что Mashable страница делает, хотя он не использует IFRAME. Страница Mashable содержит javascript, который просто открывает окно «stumbleupon submit» непосредственно с главной страницы mashable.

Но когда я пытаюсь то же самое с моей страницы, маленькое неподвижное стекло получает 302 редиректа от StumbleUpon, а потом еще 302, который в конечном счете указует его

http://www.stumbleupon.com/submit/visitor

... который не позволяет использовать ссылку.

Это была длинная история, но:
ли кто-нибудь есть какие-либо представление о том, как я могу убедить StumbleUpon позволить мне поделиться ссылкой или URL, с помощью кнопки, которая не содержится в плавающем фрейме?

Что такое секрет mashable?

ответ

1

ОК, вот что я нашел.

302 о том, что в конце концов заостренные меня/представить/посетителя произойдет, когда оба из следующих условий:

  • пользователь не вошел в систему
  • статья не споткнулся в StumbleUpon ранее

Когда это произойдет, stumbleupon приглашает вас (пользователя) на вход в систему. Это не приведет вас к странице «отправить URL».

Если пользователь не вошел в систему, но статья была отправлена ​​ранее, то она перенесет вас в окно отправки без 302. В конце концов вам будет предложено войти в систему, если вы приступите к представлению. Но первый взгляд на сайт stumbleupn в этом случае дает вам визуальное указание на то, что вы что-то подаете.

Если пользователь вошел в систему, и статья не была отправлена ​​ранее, вы попадаете прямо на страницу отправки.


Так что я ничего не делал неправильно. Мне просто нужно было войти в систему в первый раз. Это всего лишь артефакт пользовательского опыта, предлагаемого StumbleUpon. По-моему, это странно. Это удивительно и потому неправильно. Но это только мое мнение.

Смежные вопросы