SOFT
SPRINT

softsprint.net Shop

Social login via Instagram API – PrestaShop модуль

55$

Buy it now!

Buy on PrestaShop.com

 

Совместимость
PrestaShop 1.7 – 8.x

 

Цель
Позволяет войти и авторизоваться в PrestaShop, используя учетную запись Instagram. Кроме того, вы можете подключить свою учетную запись Instagram к существующей учетной записи в PrestaShop.

 

Преимущества для торговцев

  • упрощает регистрацию пользователей на вашем сайте;
  • повышает конверсию регистраций на сайте;
  • популяризировать и продвигать свой магазин в Instagram за счет простоты авторизации;
  • рост базы пользователей за счет простоты регистрации;
  • более высокая конверсия заказов за счет быстрого создания аккаунта на сайте через Instagram.

 

Преимущества для клиентов

  • нет необходимости вводить личные данные и пароли;
  • быстрое оформление заказов – не нужно тратить время на создание новой учетной записи;
  • нет необходимости запоминать логин и пароль к аккаунту в магазине – авторизация в Instagram максимально проста и надежна;
  • регистрация и авторизация осуществляются в два клика.

 

Функции

  • возможность создать новую учетную запись магазина на основе аутентификации Instagram;
  • пользователь может редактировать профиль в любое время (добавить адрес электронной почты и остальные детали);
  • к любой существующей учетной записи магазина можно подключить аутентификацию Instagram;
  • пользователь может отвязать свой Instagram от учетной записи магазина.

 

Настройка приложения Instagram администратором магазина PrestaShop

  1. Перейдите по адресу https://developers.facebook.com/products/instagram/, войдите в свою учетную запись Facebook, если вы еще не вошли в нее. Нажмите My Apps в правом верхнем углу.create instagram app - prestashop module
  2. Добавить новое приложение Create Appcreate instagram app prestashop
  3. Выберите Consumer и нажмите Nextprestashop module - create instagram app
  4. Укажите App Display Name для вашего приложения и App Contact Email приложения. Выберите учетную запись Business Manager, если она у вас есть. Нажмите Create App IDcreate instagram app prestashop module
  5. Нажмите Set Up в блоке Instagram Basic Displaycreate instagram app prestahop module
  6. Прокрутите страницу вниз и нажмите SettingsPrestashop module instagram app
  7. Укажите Privacy Policy URL вашего сайта. Сохраните тот же URL-адрес в текстовом поле Data Deletion Callback URL, который находится в User Data Deletion. Выберите Category, к которой принадлежит ваш веб-сайт.prestashop module create instagram app
  8. Прокрутите вниз и нажмите на Add Platformcreate instagram app prestashop module
  9. Выбратьprestashop module instagram app
  10. Сохраните полный URL-адрес (включая https://) домашней страницы вашего веб-сайта в Site URL. Сохранить изменения.prestashop module instagram app
  11. Перейдите в раздел Instagram Basic Display > Basic Display в меню слева.create instagram app prestashop module
  12. Прокрутите вниз и нажмите Create New Appprestashop module instagram app
  13. Укажите отображаемое имя вашего приложения Instagram и нажмите Create Appprestashop module instagram app
  14. Перейдите к Basic Display в разделе Instagram Basic Display на левой боковой панели.instagram app prestashop module
  15. Введите следующие данные:Valid OAuth Redirect URIs: HOME_PAGE_URL/module/instagramauth/redirect
    где: HOME_PAGE_URL – адрес главной страницы вашего веб-сайта.Deauthorize Callback URL: URL главной страницы вашего сайта
    Data Deletion Request URL: Сохранить URL-адрес страницы политики конфиденциальности вашего сайта.Нажмите Save Changesprestashop module instagram app
  16. Нажмите ползунок в разделе App Mode и активируйте Live приложение Instagram.create instagram app prestashop
  17. Перейдите к разделу App Roles > Roles и прокрутите вниз до раздела Instagram Testers.prestashop instagram app
  18. Нажмите Add Instagram Testers, введите имя пользователя своего аккаунта Instagram и отправьте приглашение.Prestashop instagram app
  19. Войдите в учетную запись Instagram, которую вы создали на предыдущем шаге, на другой вкладке браузера, щелкните имя Instagram над изображением профиля. Нажмите на значок настроек, выберите Apps and websites. В разделе Tester Invitations примите отправленное ранее приглашение. Вы сможете использовать эту учетную запись Instagram только до тех пор, пока не получите одобренные разрешения для своего приложения Instagram (см. шаг 23 ниже).prestashop instagram appprestashop instagram app
  20. Вернитесь на вкладку браузера, где вы настраивали приложение Instagram. Перейдите на страницу Basic Display в разделе Instagram Basic Display на левой боковой панели. Скопируйте Instagram App ID и Instagram App Secret (после нажатия кнопки Show прямо перед ним) и вставьте их в параметры Instagram App ID и Instagram App Secret на странице конфигурации модуля в области администрирования.prestashop instagram app
  21. Прокрутите вниз до раздела App Review for Instagram Basic Display в нижней части страницы и нажмите Add to submission прямо перед instagram_graph_user_profile.Prestashop instagram app
  22. Нажмите Edit details перед instagram_graph_user_profile в разделе Current submissionprestashop instagram app
  23. В параметре Tell us how you’re using this permission or feature, вы можете точно указать следующее:
    This app integrates the Instagram icon at the user-profile page of our website which allows end-user to connect their Instagram profile with their pre-existing user-account.
    Примечание. Поскольку Instagram не разрешает использовать вход/аутентификацию ни в одной из своих областей в соответствии с документацией для разработчиков, вы можете описать механизм, с помощью которого ваш веб-сайт использует значок Instagram, в разделе «Связывание социальной учетной записи» на странице профиля пользователя, чтобы разрешить вашим пользователям связываться их учетные записи Instagram к их существующим учетным записям на вашем веб-сайте. Просто отключите значки входа в социальные сети при входе в систему, зарегистрируйте страницы своего веб-сайта до того, как Instagram одобрит вашу заявку.
    Загрузите скриншот, показывающий то же самое, примите политику использования данных и save changes.prestashop instagram app
  24. Нажмите Edit details перед App verification.instagram app prestashop
  25. Здесь вы можете указать такие данные, как — страница входа на ваш сайт, где рецензенты могут войти и увидеть значок Instagram на странице профиля, логин-пароль учетной записи, которую вы создали для них на своем сайте и т. д.prestashop instagram app

 

Настройки модуля

  1. Скопируйте Instagram App ID, Instagram App Secret и вставьте их в соответствующие поля на странице конфигурации модуля:instagram app settings prestashopinstagram app settings prestashop
  2. Скопируйте ссылку Valid OAuth Redirect URIs и Deauthorize callback URL со страницы конфигурации и вставьте ее в поля приложения Instagram:
    Valid OAuth Redirect URIs
    Deauthorize callback URLprestashop instagram app settingsprestashop instagram app settings

 

Установка:

  1. Загрузить модуль через Backoffice (Modules > Add New Module) или с помощью FTP-клиента
  2. Нажмите Install it и введите конфигурациюinstagram prestashop install

 

Установка стилей CSS для кнопки:

  1. Файл стиля находится здесь:

/modules/instagramauth/views/css/instauthfront.css

instagram prestashop css

instagram prestashop css code

Кейсы рабочего процесса модуля:

1. Когда пользователь не авторизовался и впервые нажимает кнопку «Войти через Instagram» на странице входа или на странице регистрации:

– после нажатия на кнопку «Войти через Instagram» пользователь перенаправляется на страницу Instagram, где ему необходимо подтвердить свое согласие на отправку своих данных. После подтверждения он будет перенаправлен в свою учетную запись на вашем сайте.

instagram module prestashop

instagram module prestashop

instagram module prestashop

instagram module prestashop

– создается новая учетная запись клиента:

instagram module prestashop
– затем учетная запись пользователя в Instagram привязывается к созданной учетной записи клиента.
– если пользователь отменил передачу своих данных на странице Instagram, он вернется на ваш сайт и увидит сообщение об ошибке авторизации.

instagram module prestashop

instagram module prestashop

2. Когда пользователь не вошел в систему, но ранее был зарегистрирован в Instagram, нажимает кнопку «Войти в Instagram» на странице входа или на странице регистрации:

– после нажатия на кнопку «Войти через Instagram» пользователь перенаправляется на страницу Instagram, где ему необходимо подтвердить свое согласие на отправку своих данных. После подтверждения он будет переведен в свою учетную запись пользователя на вашем сайте.

instagram module prestashop

instagram module prestashop

instagram module prestashop

instagram module prestashop

instagram module prestashop

3. Когда пользователь авторизован:

– пользователь может отвязать или привязать свой Instagram-аккаунт в личном кабинете на странице «Ваши личные данные»:

instagram module prestashop

instagram module prestashop

4. Когда пользователь отвязал свой аккаунт в Instagram:

– если пользователь снова войдет в систему с помощью Instagram, связь Instagram с существующей учетной записью клиента будет восстановлена.
– если пользователь создал новую учетную запись клиента стандартным способом и привязал к ней свой аккаунт Instagram, то учетная запись предыдущего клиента будет удалена, если в ней не был указан адрес электронной почты. Если у предыдущей учетной записи есть электронная почта, она останется активной в PrestaShop, поэтому всего будет 2 учетных записи: предыдущая без подключения к Instagram и новая с подключением к Instagram.

5. При удалении учетной записи клиента:

– в случае удаления учетной записи покупателя из Prestoshop, подключение к учетной записи Instagram этого покупателя будет удалено из базы данных.

6. При изменении настроек модуля на странице конфигурации в админке:

– при изменении Instagram App ID или Instagram App Secret на другие значения все привязки аккаунтов клиентов к Instagram, сделанные ранее, будут потеряны.
– если Instagram App ID или Instagram App Secret введен неправильно или приложение Instagram не настроено должным образом, то при попытке авторизации через Instagram пользователь будет перенаправлен на страницу Instagram, где увидит ошибку:

instagram module prestashop
instagram module prestashop

Видео:
https://youtu.be/NoNNsfZkct8

 

Buy it now:

Buy it now!

Buy on PrestaShop.com

CONTACT US
Cookies | Privacy Policy | Terms and ConditionsSoftSprint ©