Авторский сайт Екатерины Денисовой

Создание фреймового сайта

freimovyisait

Приветствую!

Сегодня речь пойдёт о фреймовых страницах. Из данной статьи Вы узнаете:

  • Что такое фрейм?
  • Что такое фреймовая страница(сайт) и для чего она нужна?
  • Как создавать фреймовые страницы?

Что такое фрейм?

Фрейм (от англ. frame — рамка) — отдельный, законченный HTML-документ, который вместе с другими HTML-документами может быть отображён в окне браузера.

Что такое фреймовая страница (сайт) и для чего она нужна?

Фреймовая страница это копия определённого сайта которая открывается на Вашем домене. Данные страницы рекомендуется делать, если Вы занимаетесь продвижением партнёрских программ. 

Пример: Вы создали фреймовый сайт. Тем самым Вы убиваете не 2 зайцев, а целых 4.

  1. Вам засчитываются переходы по Вашей партнёрской ссылке.
  2. Повышается посещаемость Вашего сайта.
  3. При установке пикселей собираете аудиторию в социальных сетях.
  4. При установке яндекс метрики, отслеживаете посещаемость сайта, а помечая ссылки UTM-метками Вы будете точно знать откуда и сколько идёт трафика на Ваши ссылки.

Покажу на примере. Вот мой сайт  http://ekaterinadenisowa.ru,  а вот фреймовый сайт http://ekaterinadenisowa.ru/pp/matricapp.htm  (сайт партнёрской программы, который открывается на моём домене).

Фреймовые страницы создают, чтобы спрятать сайт, который может не пропустить система. А сайт, спрятанный на Вашем домене система не распознает.

Пример: Партнёрские ссылки, размещённые на сервисе Justclick.ru, при размещении рекламы Вконтакте не пропускает, поэтому приходится их прятать под фреймом. Чтобы партнёры не путались авторы стали размещать свои курсы на отдельном или на своём официальном домене и уже потом загружают партнёрские ссылки на сервис.

Как создавать фреймовые страницы?

А теперь переходим к практике.

Покажу создание фреймового сайта на примере http://ekaterinadenisowa.ru/pp/matricapp.htm.

 

Создание фреймового сайта.

Открываем на компьютере текстовый документ и в самом верху вставляем вот этот код

<html>
<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″ />
<title>Название</title>
</head>
<body style=»margin:0px; padding: 0px;»>
<iframe src=»Ваша партнерская ссылка» frameborder=»0″ scrolling=»yes» height=»100%» width=»100%»></iframe>
</body>
</html>

 

Именно в том виде, как расположено у меня.

 

freim

 

В строке <title>Название</title>, прописываем название сайта, лучше прописывать короткое название на латинском языке.

В строке <iframe src=»Ваша партнерская ссылка» frameborder=»0″ scrolling=»yes» height=»100%»  вставляете Вашу партнёрскую ссылку. Вставляйте ссылку аккуратно, чтобы не удалить кавычки, между которыми будете её вставлять, в противном случае сайт просто не откроется.

В моём случае получилось так:

<html>
<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″ />
<title>matricapp</title>
</head>
<body style=»margin:0px; padding: 0px;»>
<iframe src=»http://evvergus.justclick.ru/aff/sl/matrica-1/vonlinebisnes/?utm_medium=affiliate&utm_source=vonlinebisnes&aff_medium=sait» frameborder=»0″ scrolling=»yes» height=»100%» width=»100%»></iframe>
</body>
</html>

Установка пикселя на сайт.

Чтобы фреймовый сайт приносил больше пользы, установим на него пиксель. Покажу на примере социальной сети Вконтакте. Установив данный пиксель, Вы будете собирать аудиторию. Те люди, которые имеют авторизованную страницу Вконтакте и заходили на Ваш сайт, автоматически попадут в вашу аудиторию.

Для этого переходим в свой аккаунт вконтакте, нажимаем в левом меню на «Реклама» — «Ретаргетинг» — «Пиксели»

freim 2 (1)

У Вас, скорее всего, здесь ничего не будет. В верхнем правом углу нажимаем, Создать пиксель. Заполняем все поля. Название пикселя — пишите такое название, которое будет понятно Вам, т.е. на какую именно страницу будет вести пиксель. Домен сайта и тематику. Нажимаем Создать.

Появляется такой код.

kod

Копируем данный код, нажимаем закрыть и идём в блокнот. В конец тега </head> ставим курсор и нажимаем энтер 3 раза, после чего находим середину и вставляем скопированный код.

Получается вот так:

<html>
<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″ />
<title>matricapp</title>
</head>

<script type=»text/javascript»>(window.Image ? (new Image()) : document.createElement(‘img’)).src = ‘https://vk.com/rtrg?p=VK-RTRG-232054-agyKQ’;</script>

<body style=»margin:0px; padding: 0px;»>
<iframe src=»http://evvergus.justclick.ru/aff/sl/matrica-1/vonlinebisnes/?utm_medium=affiliate&utm_source=vonlinebisnes&aff_medium=sait» frameborder=»0″ scrolling=»yes» height=»100%» width=»100%»></iframe>
</body>
</html>

Далее нажимаем «Аудитория» — Создать аудиторию.

piksel (1)

Прописываем название аудитории, источник -Получить с помощью пикселя, далее выбираем наш пиксель, с помощью которого будем собирать аудиторию.

Правило: Все посетители сайта. За всё время.

Нажимаем создать.

Аудитория будет обновляться несколько раз в сутки, так что не переживайте, если по Вашей ссылке перешли, а переход сразу не засчитался, он появится позже.

Установка яндекс метрики.

Переходим в поисковик Яндекса и вводим яндекс метрика. Переходим на главную страницу метрики. В верхнем левом углу нажимаем жёлтую кнопку Добавить счётчик.

Прописываем имя счётчика, адрес сайта или полный путь к странице, ставим галочку о принятии условий и нажимаем Создать счётчик.

Далее копируем код метрики и вставляем его под код пикселя Вконтакте. Вот так:

<html>
<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″ />
<title>matricapp</title>
</head>

<script type=»text/javascript»>(window.Image ? (new Image()) : document.createElement(‘img’)).src = ‘https://vk.com/rtrg?p=VK-RTRG-232054-agyKQ’;</script>

<!— Yandex.Metrika counter —>
<script type=»text/javascript» >
(function (d, w, c) {
(w[c] = w[c] || []).push(function() {
try {
w.yaCounter48361403 = new Ya.Metrika({
id:48361403,
clickmap:true,
trackLinks:true,
accurateTrackBounce:true
});
} catch(e) { }
});

var n = d.getElementsByTagName(«script»)[0],
s = d.createElement(«script»),
f = function () { n.parentNode.insertBefore(s, n); };
s.type = «text/javascript»;
s.async = true;
s.src = «https://mc.yandex.ru/metrika/watch.js»;

if (w.opera == «[object Opera]») {
d.addEventListener(«DOMContentLoaded», f, false);
} else { f(); }
})(document, window, «yandex_metrika_callbacks»);
</script>
<noscript><div><img src=»https://mc.yandex.ru/watch/48361403″ style=»position:absolute; left:-9999px;» alt=»» /></div></noscript>
<!— /Yandex.Metrika counter —>

<body style=»margin:0px; padding: 0px;»>
<iframe src=»http://evvergus.justclick.ru/aff/sl/matrica-1/vonlinebisnes/?utm_medium=affiliate&utm_source=vonlinebisnes&aff_medium=sait» frameborder=»0″ scrolling=»yes» height=»100%» width=»100%»></iframe>
</body>
</html>

Всё. Мы создали фреймовый сайт. Теперь нам нужно его сохранить. Нажимаем файл -сохранить как — тип файла: всё файлы. 

Называем файл, можно назвать так же, как писали в коде фрейма, после названия файла без всяких пробелов пишем .htm, нажимаем Сохранить.

Теперь нам нужно загрузить фрейм в корневую папку сайта. Для удобства я создала отдельную папку для фреймовых сайтов и назвала её pp. Вы можете её назвать, как необходимо Вам.

Далее прописываем путь ссылки по порядку: Домен, где находится фрейм http://ekaterinadenisowa.ru/, папку, в которую мы загрузили фрейм pp/ и само название фрейма matricapp.htm. Соединяем, получилась ссылка фреймового сайта http://ekaterinadenisowa.ru/pp/matricapp.htm.

При переходе по ссылке открылся тот сайт, который нам нужно.

Поздравляю! Мы создали фреймовый сайт.

Аналогично можно поставить пиксели и метрику на сам домен.

Надеюсь моя статья была Вам полезна. В качестве благодарности поделитесь статьёй в социальных сетях.

 

С Уважением, Екатерина Денисова!

Спасибо, что поделились статьей в социальных сетях!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *