WordPress: создание скрина сайта с помощью mShots

Бывает что в пост о каком-то сайте хочется вставить изображение которое демонстрирует внешний вид этого сайта. Для этого приходиться использовать либо всякого рода расширения для браузеров, которые умеют делать снимки страниц, либо банально пользоваться клавишей PrintScreen и редактированием в графическом редакторе. И то, и другое неудобно и всегда хочется этот процесс упростить. Тем более у меня в браузере долго не живут расширения для редактирования изображений. Не так уж часто в этом я нуждаюсь.

Оказывается что избавить нас от этих действий может сам WordPress, а вернее его бесплатный сервис mShots. С помощью shortcode вы значительно облегчите себе задачу подготовки screenshot'ов сайтов для поста.

Итак, сначала отредактируйте файл functions.php в вашем шаблоне, а именно добавьте в него код:

//screenshot сайта: начало
function my_mshot($atts, $content = null) {
        extract(shortcode_atts(array(
            "mshot" => 'http://s.wordpress.com/mshots/v1/',
            "url" => 'https://elims.org.ua',
            "alt" => 'Скриншот сайта',
            "title" => '',
            "w" => '425',
            "h" => ''
        ), $atts));
    if ($title == '') $title = $alt;
    $img = '<img src="' . $mshot . '' . urlencode($url) .
    '?w=' . $w . '&h=' . $h . '" width="' . $w . '" alt="' . $alt .
    '" title="' . $title . '" />';
    return $img; }
add_shortcode("mshot", "my_mshot");
//screenshot сайта: конец

Теперь чтоб опубликовать в посте скрин какого-либо сайта, вам необходимо в редакторе написать код, заключенный в квадратные скобки [] (если вдруг не заработает, попробуйте написать его в режиме html-редактирования):

mshot url="http://yoursite.org.ua/" alt="Описание" w="425" h="325"

url - ссылка на сайт, alt - alt и title изображения, а w -  ширина изображения,  h - высота изображения.

Указывайте либо w, либо h, так как сервис соблюдает пропорции 3 на 4. То есть всегда будет учитываться только один параметр.

Изображения получают свой css-класс "mshots", который вы можете настроить под себя, отредактировав файл styles.css вашего шаблона.

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

При первом снятии скрина сайта можно увидеть что-то вроде:

WordPress.com mShots

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

Вот так  будет выглядеть результат работы описанного выше метода получения скриншотов:

IT Блог elimS

Идею увидел тут: http://www.wordpressplugins.ru/faq/wordpress-mshots.html

Понравилось? =) Поделись с друзьями:

Обсудить