Мегатаймер - простой таймер обратного отсчета на защищенный сайт https

Рейтинг 3.6 (5 Голоса)

Мегатаймер - очень крутое решение для таймера обратного отсчета на Ваш сайт. Красивый дизайн, возможность настройки, легкое подключение на сайт, в общем все, что нужно. Единственный минус данного решения, это отсутствие защищенного подключения на сайт. Если у Вас сайт на https, то данный таймер Вам не подойдет. Но это можно исправить, что мы сейчас и опишем. Как же поставить таймер megatimer на сайт с защищенным соединением.


Давайте перейдем к практике и посмотрим, как это делается. Для начала нужно сделать сам таймер, переходим на сайт, выбираем тип таймера, устанавливаем дату/время и переходим к следующему шагу.

Теперь выбираем дизайн таймера:

И переходим к настройкам:

Последний шаг, это копирование и вставка кода в то место сайта, где он должен отображаться.

Если вставить данный код на сайт с защищенным подключением, то он отображаться не будет. Давайте решим эту проблему. Если посмотреть на код JS-файла, который мы подключаем для отображения таймера, то видим в нем подключение двух шрифтов (не защищенное) и сам файл скрипта.

Если к адресу шрифтов можно дописать "s", чтобы получилось "https://",  то к скрипту так не получится, он "лежит" на сайте Мегатаймера. Чтобы решить это, нужно данный файл - http://megatimer.ru/timer/timer.min.js скачать и "залить" к себе на хостинг. Давайте теперь по порядку:


  1. Собираем таймер.
  2. Скачиваем файл, который нам выдало в результате сборки, в нашем случае - http://megatimer.ru/s/4b40750a0654adcfd58cd0494ac0f58a.js
  3. Скачиваем файл - http://megatimer.ru/timer/timer.min.js
  4. "Заливаем" оба файла к себе на хостинг.
  5. В скачанном файле из 2 пункта, меняем адреса шрифтов на https://
  6. Меняем в файле из 2 пункта адрес файла из 3 пункта.

​​

В итоге, у вас должно получится так, что шрифты подключаются с внешнего источника, а файл скрипта с Вашего сайта.

Теперь просто берем и вставляем в нужное место на сайт для отображения таймера этот код:

<script src="/test/https://ВАШ_САЙТ/timer/4b40750a0654adcfd58cd0494ac0f58a.js"></script>


И таймер будет отображаться даже на защищенном соединении.

Оставьте первый комментарий

Похожие статьи

Популярные статьи

Как конвертировать  контакты из Excel в vCard (VCF) бесплатно

Как конвертировать контакты из Excel в vCard (VCF) бесплатно

Оставить отзыв
Читать далее
Самые покупаемые товары в интернете: рейтинг

Рейтинг ТОП товаров наиболее продающихся в интернете

Оставить отзыв
Читать далее
EnglishDom или Skyeng? Честный отзыв ученика и промокоды в подарок

EnglishDom или Skyeng? Реальный отзыв ученика 2х школ, подробное сравнение и подарки в конце

Оставить отзыв
Читать далее
Как сделать красивое превью ссылки для Вконтакте и Facebook

Как сделать красивое превью ссылки для Вконтакте и Facebook

Оставить отзыв
Читать далее
О чем писать в своем блоге, чтобы заработать и было интересно читать

55 идей для блогера

Оставить отзыв
Читать далее
Как продвигать интернет-сервис с нуля

Стратегия продвижения интернет-сервиса. 10 лучших инструментов

Оставить отзыв
Читать далее
Английский язык онлайн по скайпу с носителем бесплатно? Как посещать бесплатно разговорный клуб английского языка

Онлайн-изучение английского языка с носителем бесплатно! Реально ли? Как я посещаю разговорный клуб английского языка Skyeng бесплатно уже более 2х лет

Оставить отзыв
Читать далее
Стратегия маркетинга Airbnb: десять уроков, как стать мировым лидером

Стратегия маркетинга Airbnb: десять уроков, как стать мировым лидером

Оставить отзыв
Читать далее
Организация онлайн-конференции своими руками

Организация онлайн-конференции. Основные шаги и этапы

Оставить отзыв
Читать далее
Как конвертировать аудиокниги с формата MP3 в M4B на Macbook для загрузки в itunes

Как конвертировать аудиокниги с формата MP3 в M4B на Macbook для загрузки в itunes

Оставить отзыв
Читать далее
Как раскрутить и усилить личный бренд в интернете бесплатно

51 способ усилить личный бренд

Оставить отзыв
Читать далее
Руководство - как делать картинки для рекламы ВКонтакте

Как делать идеальные изображения для рекламы Вконтакте

Оставить отзыв
Читать далее