В этом уроке я покажу как создать иконку для сайта, которую будет видеть пользователь в адресной строке при посещении Вашего сайта.
Первое, что необходимо сделать - это подобрать изображение в любом формате, который Вас устроит. Главное, что необходимо помнить - иконка будет очень маленькой - 16x16 точек, поэтом изображение нужно выбрать вреди значков или тому подобных изображений, т.к. например панорамное изображение красивого вида природы не будет видно при таких малых размерах.
Отобрав для себя изображение заходим в фоторедактор ( я использую Photoshop 7), и загружаем туда нашу фотографию. выделяем нужную нам часть изображения, копируем и создаем новое изображение с параметрами 16 точек по высоте и 16 точек по ширине:
увеличить
Далее вставляем наше изображение в новый файл, нажимаем "Правка > Свободное преобразование" (или сочетание клавиш Ctrl + T) и подгоняем изображение под размеры документа.
У меня получилась вот, такая вот иконка:
Сохраняем изображение на компьютере в формате jpg
Заходим на сайт favicon
Нажимаем на кнопку "Обзор" и выбираем сохранённый файл:
увеличить
После выбора нажимаем на кнопку "создать favicin.ico"
Если иконка подходит по всем параметрам, то после загрузки на сервер Вам будет предложено сохранить получившийся файл в формате ico:
увеличить
Сохраните файл в папке, где у вас находятся страницы сайта. Например в корневой директории сайта.
Открываем Динамический веб-шаблон сайта в программе FrontPage. Переходим в режим отображения кода и в верхней части файла находим закрывающийся тег "</head>". Следующий код необходимо вставить до этого тега!!! (До тега!!!!)
<link rel="icon" href="/frontpage.ico" type="image/x-icon"><!-- вместо frontpage.icoнадо прописать название вашего файла --> <link rel="shortcut icon" href="/frontpage.ico" type="image/x-icon"><!-- вместо frontpage.icoнадо прописать название вашего файла -->
Сохраняем Динамический веб-шаблон, загружаем все файлы на сервер и тестируем...
Результат:
Вставка плагинов (кнопок "нравится" и "Рекомендации") от mail.ru на свой сайт.
В этом уроке я расскажу как, очень легко добавить на свой сайт кнопки и рекомендации для сайта от сервиса mail.ru
Как это работает - Пользователь, нажав кнопку нравится, поднимает рейтинг ваших страниц, а другие пользователи посмотрев его рекомендации переходят на Ваш сайт. Данный сервис не требует особых знаний HTML, просто следуйте инструкциям на этой странице:
Переходим на сайт api.mail.ru открываем раздел "Сайты" и нажимаем кнопку "Подключить сайт":
увеличить
В открывшемся окне необходимо ознакомится с "Правилами использования", и если Вас всё устаивает, устанавливаем флажок "Я принимаю правила..." и нажимаем кнопку "Продолжить"
увеличить
В следующем окне необходимо ввести адрес Вашего сайта и его название. После ввода данных нажимаем кнопку "Продолжить":
На следующем шаге необходимо скачать файл к себе на компьютер и разместить его на на сайте в корневом каталоге, как это написано на странице:
увеличить
После добавления файла к себе на сайт, нажмите кнопку "Продолжить".
Если Ваш сайт успешно добавлен в систему, в следующем окне отобразятся данные, которые необходимо будет запомнить, а лучше записать (ID Вашего сайта, Приватный ключ, и Секретный ключ):
увеличить
Теперь при нажатии "Перейти к моим сайтам" можно редактировать основные настройки сайта:
увеличить
Переходим в раздел "Плагины" и выбираем для примера "Кнопка нравится". Нажимаем "Подробное описание и код для вставки":
увеличить
На следующей странице необходимо настроить виджет, как Вам это удобно и скопировать код для вставки:
увеличить
Теперь необходимо вставить этот код на страницы нашего сайта, если Вы используйте FrontPage и динамические Веб-Шаблоны, то необходимо вставить код именно в динамический Веб-Шаблон 1 раз и обновить все страницы, к оторым прикреплён данный шаблон. У меня на сайте используется отдельный шаблон для уроков, поэтому именно в него я и вставлю этот код:
Установка счетчика на сайт. Рассмотрим на примере Яндекс.Метрика.
В этом уроке я расскажу как поставить счетчик от Яндекс.Метрика на свой сайт для просмотра количества посетителей на сайте, а так же для подробной статистики. Установка будет производится в программе FrontPage в динамический Веб-Шаблон сайта.
Итак, заходим на сайт Яндекс.Метрика и нажимаем кнопку"Получить счетчик":
увеличить
Если у Вас есть почта на Яндексе, то далее необходимо ввести данные почты и войти под своим логином и паролем. Если у Вас нет почты на яндексе, то самое время её завести :)
После успешной авторизации на сервисе нам предлагается ввести данные о сайте, на котором будет расположен счетчик. Заполняем необходимые поля? и нажимаем кнопку "Продолжить":
увеличить
На следующей странице необходимо настроить вид отображения кода счетчика, дизайн информера, и скопировать код, который получается в результате:
увеличить
Теперь перейдем непосредственно к установке счетчика к себе на сайт. Для этого откроем программу FrontPage и в ней откроем динамический Веб-Шаблон сайта, для которого делается счетчик. Перейдем в режим отображения "С разделением" для удобства работы. Левой кнопкой мыши в визуальной части сайта щелкнем на месте, где будет отображаться счетчик, в части отображения кода вставляем код:
увеличить
Пример установленного кода можно посмотреть ниже:
увеличить
Если вы обратите внимание, то можете заметить, что счетчик установлен внутри параграфа, к которому применён определенный стили (ID), параметры которого прописаны в файле CSS. Сделано это для того чтобы счетчик при загрузке страницы был немного прозрачным. Можно посмотреть подробный урок на нашем сайте о применении данного метода к счетчикам для их прозрачности.
Теперь необходимо сохранить динамический веб-шаблон и обновить все страницы, к которым он присоединен. Загружаем файлы на сервер и тестируем...
Конечный вид моего счетчика:
Счетчик пока ещё пуст, т.к. должно пройти время после установки. Через некоторое время счетчик начнет работать.
увеличить
Сохраняем динамический веб-шаблон и обновляем все страницы, к которым он присоединен. Копируем все файлы на сервер и проверяем.
Смотрим результат:
увеличить
Теперь таким же образом добавим "Плагин рекомендаций". Переходим в раздел "Плагины" и выбираем "Плагин рекомендаций". Нажимаем "Подробное описание и код для вставки":
увеличить
На следующей странице необходимо настроить виджет, как Вам это удобно и скопировать код для вставки:
увеличить
Теперь необходимо вставить этот код на страницы нашего сайта, если Вы используйте FrontPage и динамические Веб-Шаблоны, то необходимо вставить код именно в динамический Веб-Шаблон 1 раз и обновить все страницы, к оторым прикреплён данный шаблон. У меня на сайте используется отдельный шаблон для уроков, поэтому именно в него я и вставлю этот код: