Долго думал, как назвать статью, лучше не придумал. Но сейчас вы сразу поймете в чем суть. У вас есть сайт, вы пишите на нем статьи и это здорово. Но чего-то не хватает? Человек пришел, почитал, и ушел, возможно, навсегда. А вам так хочется, чтобы он не раз вернулся на ваш сайт. А куда люди возвращаются чаще всего? Правильно, на сервисы!
Но сделать на своем сайте даже небольшой сервис, типа фотохостинга или сокращателя ссылок могут не все, нужен некоторый опыт. Но что мешает нам показывать чужой сервис на своем сайте? Практически ничего! Как это сделать? Вот тут и уместно название статьи: как вставить сайт на сайт?
Для профи я не сделаю открытия, в для новичков это будет, скорее всего, полезно. Хотя, если честно, я ни разу не видел такого подхода ни на одном блоге. А зря, все эти фишки часто дают хороший результат. Хороший пример — это мой способ получения обратных ссылок, описанный в этой статье. Результат — 38512 ссылок, и все естественные ;)
В этом же случае все решается банальным iframe. Сразу перейду к практике: я порой пользуюсь сервисом сжатия png картинок. Есть замечательные онлайн сервисы, ими можно пользоваться без проблем. Но тут есть минус: нужно постоянно держать в уме или в закладках все эти сервисы, вы покидаете свой сайт и пользуетесь чужим. А так, если вставить сайт в сайте iframe, то вы будете пользоваться сервисом (да и не только вы) не покидая своего сайта!
Я уже сегодня сделал на отдельной странице себе такой псевдосервис — Сжать фото онлайн без потери качества (естественно, в заглавии хороший НЧ запрос, и в поясняющем тексте тоже)
Сразу даже и не понятно, что это чужеродный сайт поселился на моем сайте. Работает все так же, как если бы вы зашли на родной сервис. И так можно вставить практически любой сайт в сайт, единственное условие — АДАПТИВНОСТЬ первого, иначе будет неудобно пользоваться. Хотя, допускаю, что это можно как то решить.
Ну и конечно рекламный блок между текстом и сервисом, может кто и кликнет, тем более под сервисы часто дают рекламу, тогда она будет полностью релевантна.
Как вставить сайт в сайт за 1 минуту?
Так как вставить сайт в сайт? Все просто, держите это маленький код:
1 |
<iframe width="600" height="600" src="https://tinypng.com/" name="iframe" scrolling="auto"> </iframe> |
Теперь создаете страницу и в режиме html вставляете этот код, заменив мой url на свой.
Пояснения для тех, кто не в теме: width — это ширина, нужно выставить ширину вашего шаблона, height — это высота, тут нужно подбирать оптимально, чтобы не показывать лишнего, но при этом и не урезать функционал.
Я сегодня сделал еще одну подобную страницу — дешифратор ссылок, долго искал сервис и до сих пор не уверен, что это лучший.
Под каждым таким сервисом нужно создать список других аналогичных сервисов, чтобы получился некий каталог. В этом случае ценность страницы значительно увеличится. Но ссылки лучше скрыть, как описано в этой статье.
Можно так же вставить сквозную ссылку в меню, чтобы немного прокачать такую страницу, да и вам самим будут удобно быстро к ней обращаться. Что думаете, как вам такой подход?
Как сделать iframe адаптивным?
Вот какой метод можно использовать в этом случае:
1 2 3 |
<div class="video"> <iframe class="embed-responsive-item" src="//www.youtube.com/channel/UCuwruYz1tbwxgsyKTWtVgpQ?rel=0" allowfullscreen></iframe> </div> |
1 2 3 4 5 6 7 8 9 10 11 12 |
.video { height: 0; position: relative; padding-bottom: 56.25%; } .video iframe { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } |
Спасибо за статью, воспользовался Вашим советом, правда другой поставил редактор.
Все хорошо, только заключите код в
Вы извините но вы написали
только заключите код в
дальше текста не видно
Да, вордпресс съедает код, вот фото, как должно быть:
Добрый день! Подскажите код фрейма, чтобы не ограничивать окно размерами, а сделать адаптивным размерам вложения?
Так не пробовали? Тут не отображается, вставил в конец статьи…
Мне не видео вставить надо, а целиком чужие сайты на разные мои страницы
Так разницы нет, iframe будет выводить все, что туда вставите. Другой вопрос, что ваш сайт это будет сильно тормозить, так как будет подгружаться + чужие сайты. Это не очень хорошо.
На самом деле это лендинги партнерок, они не тяжелые… (чтобы с сайта не уходили)
А второй код куда вставлять, в functions.php или какой-то другой файл?
Нет, второй файл это стили, нужно добавить в style.css
куда именно? вставил в конце файла — не срабатывает…
пожалуйста, ответьте на почту rashitinvestor@mail.ru
Сайт на движке вордпресс, могу прислать файлы темы
Файл style.css находится в папке темы. Я не силен в разработке, так как не программист, поэтому помочь вам вряд ли смогу, вам нужен человек, который вплотную занимается разработкой сайтов.
А вы могли бы указать источник информации откуда был взят данный код?
Просто забиваете в поиск — адаптивный iframe и получаете кучу полезных статей по данной теме.
А как вставить http сайт если конструктор хостинга поддерживает только трансляцию https сайтов?
Это не должно влиять, или попробуйте просто дописать https вместо http, или сделайте ссылку относительной //site.ru
здравствуйте! а не подскажете, как вставить на свой сайт другой, но его допустим нижнюю часть? чтобы другой сайт вставлялсяне с самого верха?
Вот тут посмотрите есть решения https://www.pandoge.com/stati-i-sovety/kak-pokazat-tolko-opredelennuyu-oblast-element-v-iframe
спасибо большое! а как id элемента узнать не подскажете?😅
Да очень просто, в браузере через ПОСМОТРЕТЬ КОД ищите элемент, который нужен.
Добрый день! А как устранить запрет на встраивание сайта? вот что пишет браузер: «Для обеспечения вашей безопасности tinypng.com не разрешил Firefox отобразить страницу, так как она встроена в другой сайт. Чтобы увидеть эту страницу, вам нужно открыть её в новом окне.» это я прямо Ваш код попробовал вставить…
Никак, если сайт запрещает использовать iframe своего сайта на других, то просто так это не обойти. Вот тут даются эти защитные коды https://snipp.ru/htaccess/x-frame-options