13 апр. 2012 г.

Примеры интеграции Loginza в форму авторизации сайта

 Ознакомьтесь с различными вариантами (шаблонами) интеграции виджета Loginza в WEB интерфейс авторизации Вашего сайта.
Эти варианты, всего лишь демонстрируют некоторые шаблоны форм авторизации сайтов с использованием виджета Loginza.
Демонстрация возможности встраиваниявиджета Loginza прямо на страницу авторизации Вашего сайта через блок iframe.
 Данный вариант удобно использовать на странице где расположена Ваша главная форма авторизации.

Спаренная форма авторизации


виджет авторизации Loginza

<script src="http://loginza.ru/js/widget.js" type="text/javascript"></script>
<iframe src="http://loginza.ru/api/widget?overlay=loginza&token_url=http://[RETURN_URL]"
style="width:359px;height:300px;" scrolling="no" frameborder="no"></iframe>

Замените [RETURN_URL] на адрес обратной ссылки на Ваш сайт, куда будет возвращен пользователь после авторизации.

Кнопка виджета Loginza


Кнопка виджета Loginza


Можно использовать кнопку LoginzaКнопка Loginza на любой странице или в любом блоке сайта. Ниже, как пример, представлен блок авторизации сайта с кнопкой Loginza:


<script src="http://loginza.ru/js/widget.js" type="text/javascript"></script>
<a href="http://loginza.ru/api/widget?token_url=http://[RETURN_URL]" class="loginza">
    <img src="http://loginza.ru/img/sign_in_button_gray.gif" alt="Войти через loginza"/>
</a>

Набор иконок провайдера.


Комментарий Loginza
Вы можете заменить картинки иконок провайдеров на другие варианты иконок.
Замените [RETURN_URL] на адрес обратной ссылки на Ваш сайт, куда будет возвращен пользователь после авторизации.



<script src="http://loginza.ru/js/widget.js" type="text/javascript"></script>
Также Вы можете войти используя:
<a href="https://loginza.ru/api/widget?token_url=http://[RETURN_URL]" class="loginza">
    <img src="http://loginza.ru/img/providers/yandex.png" alt="Yandex" title="Yandex">
    <img src="http://loginza.ru/img/providers/google.png" alt="Google" title="Google Accounts">
    <img src="http://loginza.ru/img/providers/vkontakte.png" alt="Вконтакте" title="Вконтакте">
    <img src="http://loginza.ru/img/providers/mailru.png" alt="Mail.ru" title="Mail.ru">
    <img src="http://loginza.ru/img/providers/twitter.png" alt="Twitter" title="Twitter">
    <img src="http://loginza.ru/img/providers/loginza.png" alt="Loginza" title="Loginza">
    <img src="http://loginza.ru/img/providers/myopenid.png" alt="MyOpenID" title="MyOpenID">
    <img src="http://loginza.ru/img/providers/openid.png" alt="OpenID" title="OpenID">
    <img src="http://loginza.ru/img/providers/webmoney.png" alt="WebMoney" title="WebMoney">
</a>