Подписаться на обновления блога?

Да

Нет

  • Способы создания сайта

    1. Какими способами разрабатываются сайты
    2. Как можно сравнить самописные сайты с основанными на CMS
    3. Быстродействие
    4. Безопасность
    5. Функциональность
    6. Простота создания
    7. Как выбрать способ создания сайта

    Здравствуйте уважаемый посетитель!

    Существуют разные способы создания сайтов от простейших, основанных на использовании готовых конструкторов до самописных вариантов, которые делаются под конкретные задачи с непосредственным использованием языков веб-программирования. И естественно, каждый способ имеет свои особенности, которые определяют как недостатки, так и преимущества в сравнении между собой.

    Поэтому перед тем как приступать к созданию своего сайта, целесообразно поближе познакомиться с возможными вариантами. И попытаться по возможности реально оценить все за и против, для того, чтобы быть более уверенным в определении по какому пути пойти в этом не простом, но в то же время очень полезном и интересном деле, как разработка своего собственного интернет-ресурса.

    В этой статье я попытался представить свое видение по этому вопросу. Причем постарался быть максимально объективным, насколько это возможно. Хотя не скрываю, что являюсь сторонником использования самописных вариантов.

    В случае, если кто имеет другое мнение, прошу отнестись к этому спокойно и высказывать свою точку зрения с приведением конкретных аргументов.

  • Инструкция по загрузке исходных файлов сайта на локальный веб-сервер

    1. Подготовка локального веб-сервера
    2. Скачивание и распаковка исходных материалов
    3. Перенос файлов на локальный веб-сервер
    4. Импорт таблиц MySQL в базу данных текущего хоста

    Здравствуйте уважаемый посетитель!

    Как ранее отмечалось, в представленных материалах Сборника в случае, если в ходе рассмотрения статей в программный код сайта или базу данных MySQL вносятся какие-либо изменения, то к ним прилагается последний вариант исходных материалов, включающий все файлы сайта в каталоге "www" и таблицы базы данных MySQL.

    И таким образом имея возможность загружать их на свой локальный веб-сервер можно проверять работу сайта на определенных этапах его создания. Что довольно удобно для проверки и понимания тех действий, которые рассматриваются в данном цикле статей.

    Однако, несмотря на то, что исходные файлы сформированы таким образом, что выполнение импорта на локальный веб-сервер не должно вызывать затруднений, все же некоторые пользователи иногда сталкиваются с определенными сложностями. В основном это касается вопросов места расположения файлов на веб-сервере и загрузки базы данных MySQL.

    Поэтому, для того, чтобы как-то упорядочить этот процесс, сегодня мы отдельно остановимся на этом вопросе. По существу, эту статью можно рассматривать в качестве некоторой "Инструкции по загрузке исходных файлов сайта на локальный веб-сервер".

    Данная инструкция приведена для примера использования локального веб-сервера Denwer. В случае же работы с другими сборками локального сервера, все операции по загрузке будут применимы и к этим вариантам. За исключением только той части, которая относится к установке сервера Denwer.

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

    Что же касается загрузки на хостинг файлов сайта, то по этому вопросу имеется отдельная статья Переносим сайт на хостинг, где показано, как это можно сделать с использованием FTP клиента FileZilla.

Самописный сайт своими руками!

Текущее состояние создаваемого сайта

Здесь можно посмотреть текущее состояние тестового самописного сайта, который создается в рамках цикла статей Сделай сайт с нуля своими руками.

Описание которого сопровождается исходными файлами с таблицами MySQL, предоставляемые бесплатно в дополнительных материалах.

Вы здесь: Главная → Сборник статей → Поиск → Устанавливаем Яндекс Поиск на сайт


Автор: / Дата:

Устанавливаем Яндекс.Поиск на сайт

Здравствуйте уважаемый посетитель!

В предыдущей статье мы подтвердили права на управление сайтом и теперь можем перейти к вопросу установки Яндекс.Поиска на сайт. И сегодня сформируем HTML и CSS код поисковой формы и результатов ответов по заданным запросам, которые в дальнейшем будем размещать на сайте.

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

Поэтому сейчас не будем понапрасну тратить время на дополнительные рассуждения о выбранном способе организации поиска по сайту, а сразу перейдем к делу. И на примере создаваемого ресурса avtobezugona.ru рассмотрим все шаги, необходимые для создания такого функционала.

скриншот 90

При этом в случае необходимости можно использовать соответствующий поясняющий материал Яндекс помощи. В котором представлены подробные разъяснения по каждому выполняемому шагу.

Следует еще раз отметить, что использование такого Яндекс сервиса возможно только в случае, если имеются подтвержденные права на управление сайтом. Поэтому, если у кого это не сделано, то обязательно следует выполнить процедуру, описанную в предыдущей статье.

Содержание


  • Подготовка к созданию поиска
  • Определение области поиска
  • Настройка внешнего вида поисковой формы
  • Настройка результатов
  • Проверка настроенного поиска
  • Получение кода для вставки на сайт

Подготовка к созданию поиска


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

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

Для увеличения / уменьшения размера изображения кликните по картинке
Главная страница сервиса Яндекс.Поиск

Рис.1 Главная страница сервиса Яндекс.Поиск

А затем, если это делается в первый раз, то в появившимся окне Лицензионного соглашения нужно с ним ознакомиться и согласиться, нажав на кнопку "Продолжить".

Для увеличения / уменьшения размера изображения кликните по картинке
Согласие с Пользовательским соглашением

Рис.2 Согласие с Пользовательским соглашением

Все, теперь можно перейти к дальнейшим шагам для определения всех основных параметров создаваемого функционала.

Определение области поиска


На этом этапе необходимо задать следующие параметры:

  • техническое название, которое будет отображаться на странице "Мои поиски";
  • приглашение к вводу запроса в форме для стандарта Opensearch;
  • установка ограничительного фильтра (выбран умеренный фильтр);
  • адреса интернет-ресурсов, по которым предполагается получать результаты, в нашем случае avtobezugona.ru.

Ниже приведен скриншот страницы, с заполненными полями для рассматриваемого варианта.

Для увеличения / уменьшения размера изображения кликните по картинке
Область поиска

Рис.3 Область поиска

Все довольно просто и понятно. Можно лишь обратить внимание на наличие отметки об имеющихся подтвержденных правах на заданные ресурсы. Как видно, по указанному адресу avtobezugona.ru с правами все в порядке. Иначе на этом месте присутствовало бы сообщение о возникшей проблеме. Причем дальнейшие шаги в этом случае были бы невозможны.

Что касается адреса электронной почты на который возможно получать сообщения об изменении статуса, то здесь указан e-mail, используемый ранее при подтверждении права на управление сайтом.

Для увеличения / уменьшения размера изображения кликните по картинке
Область поиска

Рис.4 Область поиска

Настройка внешнего вида поисковой формы


Далее переходим к настройке внешнего вида поисковой формы. Вид этой страницы с заполненными полями изображен на следующем скриншоте.

Для увеличения / уменьшения размера изображения кликните по картинке
Форма поиска

Рис.5 Форма поиска

В данном случае определены такие параметры формы, как:

  • тип формы - без фона;
  • цвет поля для ввода запроса - #fdfadc;
  • цвет рамки для ввода запроса - #eaeaea;
  • цвет приглашения к вводу запроса - #5f5f5f;
  • цвет текста в кнопке - #000066;
  • размер шрифта кнопки - 15px;

Данные параметры выбраны с учетом дизайна сайта, в который будет устанавливаться поисковая форма. Полученный результат можно посмотреть здесь же внизу страницы в выделенной для этого области предварительного просмотра.

При этом, если потом понадобится что-то подкорректировать, то это можно сделать в любое время на сервисе через вкладку "Мои сайты".

Настройка результатов


На следующей вкладке при настройке результатов укажем лишь адрес страницы, на которой будут ответы по заданным запросам. Остальные настройки трогать не будем, так как все необходимые изменения будем делать с использованием стилей CSS при встраивании поиска на сайт.

Для увеличения / уменьшения размера изображения кликните по картинке
Результат поиска

Рис.6 Результат поиска

Проверка настроенного поиска


На этом этапе мы можем проверить работу созданного поиска. Для этого достаточно в соответствующее поле ввести какой-нибудь подходящий запрос. Например для нашего сайта можно использовать ключевое слово "маркировка".

После нажатия на кнопку "Найти" должно появиться все, что Яндекс смог отобрать на сайте по данному запросу.

Для увеличения / уменьшения размера изображения кликните по картинке
Проверка поиска

Рис.7 Проверка поиска

Как видно на данный момент найдено 5 ответов. Что говорит о нормальной работе данного функционала.

Получение кода для вставки на сайт


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

Для этого следует перейти на следующую страницу, на которой необходимо отметить опцию "Добавить CSS к коду результатов", как показано на следующем скриншоте.

Это обусловлено тем, что для встраивания полученного функционала в HTML-структуру сайта с учетом существующего дизайна мы будем использовать свойства CSS.

Для увеличения / уменьшения размера изображения кликните по картинке
Код для вставки на сайт

Рис.8 Код для вставки на сайт

На этом мы закончили создание и настройку поиска от Яндекс. Осталось только скопировать и сохранить код.

В дополнительных материалах полученный код размещен отдельно в двух файлах. Один, предназначен для формы (seach_form.html), другой для результатов (seach_result.html).

В следующей статье используя первый файл мы сформируем на сайте поисковую форму запросов. И посмотрим, как у нас получится используя стили CSS приблизить ее внешний вид к существующему дизайну сайта.

Исходные файлы сайта


Полученный код Яндекс поиска, можно скачать из прилагаемых дополнительных материалов.

Исходные файлы бесплатно предоставляются только зарегистрированным пользователям.

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

С уважением, Николай Гришин


Комментарии


Если у Вас возникли вопросы, или есть какие-либо пожелания по представлению материала, либо заметили какие-нибудь ошибки, а быть может просто хотите выразить свое мнение, пожалуйста, оставьте свои комментарии. Такая обратная связь очень важна для возможности учитывать в дальнейшем мнение посетителей.

Буду Вам за это очень признателен!

comments powered by HyperComments