Делать было нечего, решил поиграться с api и доками вконтакте и впихнуть, воткнуть, вставить, нежно всунуть так сказать свой сайт внутрь iframe-приложения вконтакте. Ниже опишу пошаговую инструкцию что и как, и нахуй нада.
Предупреждаю сразу, нихрена не выйдет если на вашем домене не добавлен ssl сертификат и он не открывается по https. Можете даже не пробовать.
Займемся созданием приложения. Идем по этому адресу и заполняем инфу. Следуйте скриншоту
http://prntscr.com/c185td
Жмем "перейти к загрузке приложения". Тут нужно подтвердить создание при помощи смс или приложения на андроиде. Подтверждаем. Откроется страница с информацией которую вы ввели, тут можно пока оставить все как есть.
http://prntscr.com/c187rh
Идем дальше. Делаем приложение включенным и прописываем ссылки на главную страницу сайта
http://prntscr.com/c189mj
Сохраняем и входим в приложение. Тут вы столкнетесь с первой проблемой, выглядит она так
http://prntscr.com/c18al4
Стандартная dleшная защита не разрешает запустить сайт через iframe, думая что это хакерская атака.
Внимание крайне не желательно отключать защиту в дле, комментируя эту строчку. Есть другие методы, на уровне php создать условие - если открывается сайт через вк то сточку скрыть, если любым другим способом, то строчку оставить. Тут я не знаю как сделать. Мб в комментах подскажет кто...
Идем дальше. Мы столкнулись со второй проблемой, указанные в настройках приложения высота и ширина обрезает сайт, нужно сделать высоту адаптивной, а ширину хотя бы 1000px. Делаем это так.
Открываем main.tpl вашего шаблона, перед
вставляем
Перед
вставляем
В коде выше 1000 означает ширину приложения, играйтесь с этой цифрой.
Далее после
вставляем
и перед
вставляем
Вот и все. Теперь должно быть норм, меняйте ширину приложения в коде скрипта под себя и настраивайте приложение, добавляйте ему иконку и тп...
http://prntscr.com/c18glp
Пример приложения
Предупреждаю сразу, нихрена не выйдет если на вашем домене не добавлен ssl сертификат и он не открывается по https. Можете даже не пробовать.
Займемся созданием приложения. Идем по этому адресу и заполняем инфу. Следуйте скриншоту
http://prntscr.com/c185td
Жмем "перейти к загрузке приложения". Тут нужно подтвердить создание при помощи смс или приложения на андроиде. Подтверждаем. Откроется страница с информацией которую вы ввели, тут можно пока оставить все как есть.
http://prntscr.com/c187rh
Идем дальше. Делаем приложение включенным и прописываем ссылки на главную страницу сайта
http://prntscr.com/c189mj
Сохраняем и входим в приложение. Тут вы столкнетесь с первой проблемой, выглядит она так
http://prntscr.com/c18al4
Стандартная dleшная защита не разрешает запустить сайт через iframe, думая что это хакерская атака.
Фиксим это так, открываем /engine/init.php, ищем в нем
закомментируем эту строчку
PHP:
check_xss ();
PHP:
// check_xss ();
Идем дальше. Мы столкнулись со второй проблемой, указанные в настройках приложения высота и ширина обрезает сайт, нужно сделать высоту адаптивной, а ширину хотя бы 1000px. Делаем это так.
Открываем main.tpl вашего шаблона, перед
PHP:
</head>
HTML:
<script src="https://vkontakte.ru/js/api/xd_connection.js?2" type="text/javascript"></script>
HTML:
</body>
HTML:
<script type="text/javascript">
setInterval(onBodyResize, 100);
function onBodyResize()
{
var real_height = document.getElementById('page').clientHeight;
VK.callMethod('resizeWindow', '1000', real_height);
}
</script>
Далее после
HTML:
<body>
HTML:
<div id="page">
HTML:
</body>
HTML:
</div>
Вот и все. Теперь должно быть норм, меняйте ширину приложения в коде скрипта под себя и настраивайте приложение, добавляйте ему иконку и тп...
http://prntscr.com/c18glp
Пример приложения
Последнее редактирование: