Визуальные закладки появляются в браузере, если пользователь регулярно посещает какой-либо ресурс.
Если вы хотите, чтобы ваш сайт хорошо смотрелся среди прочих визуальных закладок, следует предпринять некоторые меры для этого.
Далее я расскажу как добавить иконку страницы и ее эскиз на «экспресс-панель».
В шапку страниц сайта нужно добавить ссылку на миниатюру/иконку сайта:
<link rel="shortcut icon" type="image/png" href="<путь к иконке>/favicon.png" />
Чтобы определить цвета эскиза, нужно указать их с помощью CSS:
@media screen and (view-mode: minimized) {
body {
color: #f00;
background: #fa0;
}
}
Либо сделать тоже самое, подключив файл:
<link rel=stylesheet type="text/css" href="preview.css" media="(view-mode:minimized)">
Другой способ добавления эскиза страницы
С помощью этого способа вы явно указываете внешний вид закладки, если она была запрошена.
// если идет запрос миниатюры для закладки
if ( $_SERVER['HTTP_X_PURPOSE'] == 'preview' ) {
$title = 'Название сайта';
?>
<html>
<head>
<title><?php echo $title; ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="preview-refresh" content="604800">
<style>
body {
margin: 0;
padding: 2em 0;
}
div {
text-align: center;
}
</style>
</head>
<body>
<div>
<img src="logo_new.png" title="<?php echo $title; ?>" alt="<?php echo $title; ?>"/>
</div>
</body>
</html>
<?
} else {
define( 'WP_USE_THEMES', true );
// Загрузка среды WordPress и шаблона
require( './wp-blog-header.php' );
}
Используется для того, что бы вывести еще каки-то данные, например текст. Выводить текст бывает целесообразно, когда Вы хотите о чем-то оповестить пользователя. Например Facebook выводит количество новых сообщений в эскизе.Для того, что бы установить регулярность обновления эскиз используем следующий код:
<meta http-equiv="preview-refresh" content="604800" />
Эскиз будет обновляться каждую неделю(время указывается в секундах). Этот параметр не обязателен, если у Вас нет динамических данных.