Как автоматически создавать скриншоты сайтов в WordPress
Существует множество сайтов, которые предоставляют возможность делать снимки (скриншоты) сайтов. Но к сожалению, практически все такие ресурсы платные в той или иной мере (бесплатное использование подразумевает или редкое обновление снимков или рекламу ресурса в виде «водяных знаков» на скриншоте или другую белеберду). Мало кто знает, но на WordPress.com есть свой собственный сервис снятия снимков под названием «WordPress.com mShots». Для блогов на движке WordPress можно реализовать простенький шорткод, с помощью которого можно легко вставить снимок любого сайта в нужное вам место в блоге.
Есть несколько способов реализовать скрин сайта у себя на странице. Давайте рассмотрим их:
1. Добавьте в файл functions.php (НЕ Рекомендуется) вашего шаблона код:
//создание скриншотов для сайтов start
function my_mshot($atts, $content = null) {
extract(shortcode_atts(array(
"mshot" => 'https://s.wordpress.com/mshots/v1/',
"url" => 'https://www.wordpress.org',
"alt" => 'Скриншот сайта',
"title" => '',
"w" => '200',
"h" => ''
), $atts));
if ($title == '') $title = $alt;
$img = '<img class="mshots" src="' . $mshot . '' . urlencode($url) .
'?w=' . $w . '&h=' . $h . '" width="' . $w . '" alt="' . $alt .
'" title="' . $title . '" />';
return $img; }
add_shortcode("mshot", "my_mshot");
//создание скриншотов для сайтов end
Использовать данный шорткод очень просто, для этого добавьте в запись в html-режиме редактора код:
[mshot url="https://www.wordpress.org/" alt="Здесь alt и title" w="200" h="150"]
Где url указывает на урл сайта, alt указывает на alt и title картинки (title можно задать отдельно), а w и h это ширина и высота скриншота в пикселях.
[screenshot width=700]www.wordpress.org[/screenshot]
Указывать одновременно и высоту и ширину картинки бессмысленно, так как сервис всегда делает снимки высотой в 3/4 от ширины. То есть если вы указали ширину скриншота в 200 пикселей, то высота будет 150 пикселей независимо от указанного вами размера. Достаточно указать лишь один параметр картинки – второй будет вычислен автоматом.
Картинкам присваивается класс «mshots«, с помощью которого можно оформить выводимые снимки сайтов. Например, добавьте в styles.css шаблона код:
.mshots{
border-radius: 5px;
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15);
}
2. Вы можете создать свой Плагин не затрагивая файл functions.php — Рекомендуется
[screenshot width=700]vk.com[/screenshot]
3. Вы можете установить плагин, активировать его и просто вставлять шорт код. Например вот этот плагин: mShots Ниже приведена работа именно этого плагина:
[screenshot width=700]www.ahost.uz[/screenshot]
4. Очень Рекомендуется -Вы можете отредактировать блок в режиме HTML и вставить код:
<iframe width="600" height="600" src="https://адрес.сайта/" name="iframe" scrolling="auto"> </iframe><br></p>
Вывод кода такой: