Как сотворить сайт за 5 дней



Дата25.07.2016
өлшемі316.74 Kb.
#220607
Автор: Алексей Бородкин

Как сотворить сайт за 5 дней


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

На самом же деле все обстоит несколько по-другому: без прочных познаний в веб-программировании создать комплексный сайт с нетривиальной начинкой, конечно, не удастся, но вот сделать типовой сайт – к примеру, торговый каталог – вполне возможно.

Для выполнения этой задачи как нельзя лучше подходит CMS-система «1С-Битрикс: Управление сайтом», позволяющая создавать и администрировать веб-проекты c обширным контентом.

Несомненный плюс этой системы заключается в том, что для создания относительно простого сайта на ее основе достаточно обладать компьютерными навыками на уровне среднего пользователя, и для осуществления этой затеи хватит 5 дней – т.е. рабочей недели.

Не сказать, чтобы это было просто, но ничего невозможного в том нет; в доказательство мы вместе с вами создадим сайт на основе «1С-Битрикс: Управление сайтом» и подробно, по этапам, опишем все шаги.

Что ж, приступим.


День 1.


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

Очевидно, что он должен отвечать запросам небольшой компании – скажем, торговой фирмы, занимающейся продажей предметов для оформления интерьеров.

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

Итак, с чего начать? Первым делом нам необходимо загрузить с сайта http://www.1c-bitrix.ru свежую версию системы «1С-Битрикс: Управление сайтом» – ее можно найти в разделе «Скачать».

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

В данном примере использовалась система «1С-Битрикс: Управление Сайтом 6.5 – Бизнес» – именно ее функциональность полностью отвечает нашим задачам.

После загрузки запускаем файл bsm_6_setup.exe; поначалу установка проходит в привычном ключе: мы выбираем папку, куда ставить программу, и знакомимся с лицензионным соглашением.

А вот дальше начинается самое интересное: программа установки спрашивает, по какому порту должен располагаться наш новый сайт и нужно ли ставить целый ворох систем управления базами данных (СУБД):





Рис. 1.1 Настройки установки 1С-Битрикс

Поскольку номер порта нам менять без надобности, а СУБД на нашей локальной системе раньше не стояли, соглашаемся с установками по умолчанию, нажимаем «Установить» и ждем несколько минут, пока CMS «1С-Битрикс: Управление сайтом» устроится в нашей системе.

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

Дальше надо действовать осторожно: в трее вскоре после загрузки программы появится логотип «1С-Битрикс», но кликать по нему пока что не стоит: система в этот момент настраивает внутреннюю базу данных, и наше вмешательство может привести к тому, что «1С-Битрикс» придется переустанавливать с нуля.

Одним словом, ждем; через несколько секунд автоматически откроется окно браузера со следующим сообщением:



Рис. 1.2 Создание базы дынных

Пока «1С-Битрикс» настраивается, никаких действий предпринимать опять-таки не нужно.

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

Перво-наперво нам надо заполнить небольшую анкету администратора сайта, где нужно указать имя, фамилию, адрес электронной почты, а также желаемый логин с паролем (лучше использовать логин admin – так удобнее; а вот пароль лучше выбрать похитрее).





Рис. 1.3 Данные администратора сайта

Главное – не забыть выставить галочку напротив «Запустить мастер создания сайта»: это заметно облегчит создание сайта.

Теперь можно нажимать на кнопку «Следующий шаг».



Рис. 1.4 Первый шаг мастера создания сайта

После короткой паузы откроется небольшое окошко с вариантами шаблонов будущего сайта; для нужд интернет-каталога как нельзя лучше подойдет шаблон «Корпоративный сайт» - его мы и выбираем, выделив соответствующий пункт и щелкнув на «Далее».





Рис. 1.5 Второй шаг мастера создания сайта

Здесь от нас требуется выбрать цветовую схему будущего сайта; этот выбор несет исключительно эстетическую нагрузку, так что мы выбираем «зеленый» вариант как более спокойный (и солидный) и нажимаем на «Далее».





Рис. 1.5 Третий шаг мастера создания сайта

Тут надо ввести название сайта и корпоративный слоган (они будут показываться вверху страницы). Наш сайт будет называться «Декоры.ру», слоган будет соответствующий: «Все для интерьеров!».

Следующие 2 графы – URL сайта и адрес логотипа – оставляем такими, какие они есть (сайт наш пока будет жить на локальном компьютере), потому URL нам без надобности, а с логотипом возиться и вовсе незачем). Нажимаем на «Далее».



Рис. 1.6 Окончание установки

Так! Установка завершена.

Теперь наша главная задача – зарегистрировать продукт: дело в том, что мы скачали демонстрационную версию продукта, которая работает всего лишь 30 дней, не поддерживает обновления и на нее не распространяется техническая поддержка; есть и другие ограничения.

Регистрация выполняется очень просто: после покупки продукта на e-mail высылается специальный регистрационный ключ, которым нам и надо воспользоваться. Для этого мы на заключительном экране установки кликаем пункт «Регистрация продукта».

Вслед за этим открывается внутренний административный интерфейс – панель управления:



Рис. 1.7 Лицензия не найдена

Как видно, программа сейчас указывает на ошибку – «Лицензия не найдена». Что ж, это исправимо: в окошке, в котором сейчас значится DEMO, нам надо ввести полученный по электронной почте регистрационный код и смело нажать на кнопку «Сохранить ключ».





Рис. 1.8 Обновить систему обновлений

Так! Система нашу лицензию приняла. Но снова вывелась ошибка, которая нам говорит обновить систему SiteUpdate. Что ж, кликаем на ссылку ниже «Установить обновление системы SiteUpdate».





Рис. 1.9 Обновления модулей

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

Незамедлительно откроется окошко просмотра обновлений:



Рис. 1.10 Просмотр обновлений

Обновлений и впрямь много (весят они, судя по подсказке справа, 9.1 мегабайт). Ради интереса можно почитать, в чем они заключаются, а потом кликнуть на кнопку «Загрузить».

Чтобы загружать обновления не разом, а по очереди (для уменьшения нагрузки на сервер), нажмем на кнопку «Пошаговое обновление».

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





Рис. 1.11 Установка части обновлений.

И нажмем на кнопку «Установить обновления». Этот процесс займет некоторое время. Далее поступим таким же образом с остальными обновлениями: нажимаем на кнопку «Проверить обновления» вверху страницы, далее в форме на вкладке Список обновлений отмечаем те, которые хотим установить и нажимаем «Установить обновления».

Итак, все обновления установлены.

К слову, здесь же можно просмотреть (и при желании удалить) уже установленные обновления, а также заглянуть в «Журнал установки», щелкнув на ссылке сверху-справа.

Сейчас нам это без надобности, а потому мы закрываем систему, щелкнув на значке в трее правой кнопкой и выбрав последний пункт - «Выход».

План первого дня – установка системы – по большей части выполнен, хотя нам осталась еще парочка дел – например, проверить, работает ли вход в систему.

Для этого мы загружаем «1С-Битрикс» (по ссылке в меню «Пуск»), щелкаем правой кнопкой на значке в трее и выбираем «Администрировать». Вслед за этим мы натыкаемся на невиданное доселе окошко:



Рис. 1.12 Форма авторизации.

Теперь пришла пора ввести придуманные нами логин и пароль – и произойдет вход в систему.

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

Сейчас нам нужен пункт «Список сайтов», расположенный по следующему адресу: раздел «Настройки» – «Настройки продукта» – «Сайты»:





Рис. 1.13 Деактивация сайта компании.

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

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

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

Для этого мы ставим галочку напротив строки «Сайт компании» и выбираем снизу пункт «Деактивировать»; в столбце «Акт.» незамедлительно появляется лаконичное «Нет» - значит, дело сделано.

Раз уж мы находимся в этом меню, мы переделаем и другую деталь шаблона – название сайта. Для этого нужно щелкнуть на пиктограмме с синими прямоугольниками, находящуюся левее названия сайта, и выбрать «Изменить».





Рис. 1.14 Изменение сайта.

Откроется новое окошко:





Рис. 1.15 Редактирование параметров сайта.

Проверяем основные параметры: напротив «Активен» совершенно правильно стоит галочка, а вот в графе «Название» написано что-то не совсем наше. Исправим этот недочет, вписав туда «Декоры.ру» - это и будет названием сайта.

Остальные показатели вроде бы в норме – и выбранная кодировка, и формат даты, и основной язык; смотрим ниже – в шаблонах творится не совсем то, что нам нужно.



Рис. 1.16 Шаблоны сайтов.

Дело в том, что сайт на основе «1С-Битрикс» работает, используя сразу несколько шаблонов – скажем, для общей структуры используется шаблон «Корпоративный сайт», для «обучающей» части используется шаблон «Прохождение курса обучения», а для новостных страниц – шаблон «Версия для печати», позволяющий представлять текстовый контент в удобном для распечатки виде.

Для нашего интернет-каталога последние две возможности, понятно, излишни, поэтому мы отключаем их, кликая на соответствующие пункты столбца «Шаблон» и выбирая «(нет)». В итоге у нас остается лишь шаблон «Корпоративный сайт».

Все, на сегодня достаточно, поэтому мы нажимаем на «Сохранить» и выходим из системы; завтрашний день будет посвящен более подробной переделке основного шаблона.


День 2


Загрузив систему, в качестве разминки попробуем зайти на наш новый сайт. Сделать это можно, просто кликнув дважды на иконке «1С-Битрикс» в системном трее, а можно пойти другим, более хитрым путем.

Для этого щелкаем правой кнопкой на логотипе в трее и выбираем там пункт «Администрировать»; после ввода логина и пароля откроется уже знакомая нам панель управления. Теперь надо щелкнуть на закладке «Публичный раздел», расположенной слева вверху – и откроется публичная часть сайта.





Рис. 2.1 Публичная часть сайта.

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

Ну что ж, надо с чего-то начинать, и начнем мы с изменения заголовка окна браузера, носящего сейчас имя «Демонстрационная версия…», что нас решительно не устраивает.

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





Рис. 2.2 Редактирование страницы в визуальном редакторе.

Переходим в этой форме на закладку «Свойства».





Рис. 2.3 Редактирование свойств страницы.

Нам нужно исправить заголовок, который прячется в строчке «Дополнительный заголовок страницы (заголовок окна браузера)», вставив туда название нашего сайта – «Декоры.ру».

Теперь можно нажимать на «Сохранить» и идти смотреть на обновленную страницу:



Рис. 2.4 Заголовок окна браузера.

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

Для этого мы идем в панель управления, а именно – в раздел «Контент» - «Структура сайта» – «Декоры.ру», где нам жизненно необходим файл «Меню типа ‘top’». Щелкнув на синих прямоугольниках, вызываем пункт «Редактировать меню»:



Рис. 2.5 Переход к редактированию меню.

Откроется новое окошко; кажется, это то, что нам нужно. Начинаем разбираться: выделяем галочками четыре последних строки (в самом деле, зачем нам раздел «Общение» или «Типовые примеры»?); кроме того, меняем слово «Магазин» на «Каталог».





Рис. 2.6 Форма редактирования меню.

Загружаем публичный раздел снова: еще лучше! Меню начинает приобретать нужные нам черты:





Рис. 2.7 Измененное верхнее меню.

Теперь надо разобраться с левым меню: дело в том, что по клику на слове «Каталог» открывается меню с пунктами «Аффилиаты», «Платный контент» и т.д., которые в будущем каталоге нам точно не нужны.

Для решения этой задачи войдем во вкладку «Редактировать сайт», расположенную слева вверху. Левое меню будет выделено рамочкой с набором кнопок. Нажимаем кнопку «Редактировать меню»



Рис. 2.8 Переход к редактированию левого меню.

В открывшемся окошке нам надо, как и в прошлый раз, удалить лишние разделы – «Аффилиаты» и «Платный контент».





Рис. 2.9 Удаление лишних пунктов меню.

Эта форма открывается в публичной части. Удаляем пункты меню нажатием на красные крестики справа.

Зайдем в свойства папки «Интернет-магазин», чтобы изменить заголовок на «Каталог». Это можно сделать из публичной части, кликнув на ссылку «Каталог» в верхнем меню и нажав кнопку на административной панели. Таким образом откроется форма редактирования свойств раздела. В ней изменим заголовок:



Рис. 2.10 Изменим свойства раздела.

Сохраняем изменения.

Теперь нам предстоит работа посложнее: отправляемся в раздел «Структура сайта» – «Файлы и папки».



Рис. 2.11 Структура сайта.

Здесь мы должны оценить, какие из папок нам не нужны – в их число войдет папка communication (т.е. удаленный уже из структуры сайта раздел «Общение»), examples («Типовые примеры»), personal («Профиль») и site2 (тот самый второй сайт, который мы выключили из структуры еще в первый день).

В конце концов, если эти файлы мы не применяли при создании сайта – зачем их держать на диске? Поэтому выделяем эти папки галочками:



Рис. 2.12 Выделим папки на удаление.

Далее нажимаем на красный крестик под всей таблицей – и через некоторое время папки будут уничтожены.

Теперь нам надо навести порядок в папке e-store (соответствующей бывшему разделу «Интернет-магазин»), так что отправляемся туда:



Рис. 2.13 Разбираемся с разделом /e-store.

Здесь нужно удалить папки affiliates (раздел «Аффилиаты») и paid («Платный контент»), выделив их галочками и нажав на красный крест под таблицей.

Теперь нам надо навести окончательный порядок в левом меню раздела «Каталог», так что мы снова отправляемся в свойства файла «меню типа ‘left’» в этом разделе с целью создания двух новых разделов – «Каталог декоративных товаров» и «Каталог сопутствующих товаров».

По приходу туда мы делаем следующее: во-первых, вписываем названия новых разделов (можно поверх уже существующих), во-вторых, удаляем раздел «Каталог товаров из 1С: Предприятие», поставив галочку справа, а в-третьих – переназначаем ссылки с пунктов меню. Чтобы пункты меню выстроились так, как нам нужно, прописываем в столбце «Сортировка» соответствующие значения (так, пункт под номером 10 пойдет раньше пункта под номером 20, и так далее). В конечном счете таблица будет выглядеть так:





Рис. 2.14 Редактируем левое меню.

Переназначение ссылок понадобилось нам по очень простой причине – помимо внешнего вида мы будем изменять и внутреннюю структуру сайта, избавляясь от папок вида “books”, а также вводя новые папки.

Теперь можно нажать на «Сохранить» и отправляться в пункт «Файлы и папки» раздела «Структура сайта». Нам понадобится папка e-store, в особенности вложенная в нее папка books. С ней мы поступаем просто: щелкнув на синих прямоугольниках, выбираем «Переименовать» и вводим название main_catalog.



Рис. 2.15 Переименование раздела.

Кроме того, необходимо удалить папку xml_catalog – она нам не нужна (поскольку она отвечает за импорт товаров из все той же «1С: Предприятие»)

Теперь перед нами стоит творческая задача – продублировать папку main_catalog, чтобы на ее основе сделать папку misc_catalog («Каталог сопутствующих товаров»).

Напрямую это, к сожалению, сделать нельзя, поэтому придется немного схитрить.

Первым делом выполняем следующее: выделяем папку main_catalog галочкой, выбираем в выпадающем списке снизу пункт «Копировать…» и вписываем в соответствующее окошко название папки /content (к слову, символ “/” означает, что папка расположена в корневой директории):



Рис. 2.16 Копируем раздел.

Теперь можно нажимать «Применить» - и дело сделано, копия папки main_catalog улетела в папку content. Мы отправляемся вслед за ней:





Рис. 2.17 Переименовываем раздел.

Далее ее следует переименовать в misc_catalog (точно так же, как мы это делали двумя абзацами выше).

Остается последний шаг: выделить новоиспеченную папку галочкой и скопировать ее обратно в папку e-store:



Рис. 2.18 Измененный раздел /e-store.

Столь хитрыми манипуляциями мы сделали копию папки main_catalog – и теперь можем посмотреть на результаты, выйдя в публичную часть сайта и щелкнув на пункте «Каталог» верхнего меню:





Рис. 2.19 Измененное левое меню.

Как видите, левое меню приобрело весьма приятные очертания, но это лишь внешняя сторона дела. Давайте посмотрим, что у нас делается внутри, перебравшись в панель управления и щелкнув на раздел «Структура сайта» - «Декоры.ру» - «Каталог»:





Рис. 2.20 Раздел Каталог.

Здесь у нас творится что-то непонятное: две папки носят одно и то же название. Впрочем, это легко исправить, назвав один из них «Каталог декоративных товаров», а второй – «Сопутствующие товары» через меню свойств папки.

Теперь нам надо разобраться и с файловой структурой; путь наш лежит в раздел «Структура сайта» – «Файлы и папки» – «e-store» – «main_catalog».

Папки authors и reviews (разделы, описывающие авторов и рецензии на книги из шаблонного сайта) явно лишние; их надо выделить галочками и удалить:





Рис. 2.21 Удаление лишних папок.

Это, однако, далеко не все: нам предстоит почистить меню, чтобы там не выводились уже удаленные разделы «Авторы» и «Рецензии». Это можно сделать, не выходя из папки main_catalog, а просто войдя в свойства файла «Меню типа “left”» (напомним, это можно сделать, щелкнув на стопке синих прямоугольников слева от названия файла).





Рис. 2.22 Редактирование левого меню.

В открывшемся списке видны 2 ненужных нам пункта меню – «Авторы» и «Рецензии». Выделяем в крайнем правом столбце пункты «Удалить» напротив них и нажимаем «Сохранить».

Дело сделано – мы избавили меню от лишних пунктов. Теперь нам надо проделать аналогичные действия для папки misc_catalog, точно таким же образом отредактировав расположенный в ней файл «Меню типа “left”».

Но и это еще не все. В левой части панели управления щелкаем на разделе «Контент» - «Информационные блоки» - «Типы информ. блоков» - «Каталог книг» и попадаем внутрь типа информационного блока (в этом блоке хранится информация о содержимом каталога – и мы будем переделывать его в каталог товаров для интерьера).





Рис. 2.23 Удаление лишних инфоблоков.

Два последних инфоблока – «Авторы» и «Рецензии» - в структуре будущего сайта явно не нужны; поэтому выделяем их и удаляем, нажав на красный крест снизу.

Теперь нам надо посмотреть свойства раздела «Книги»; в будущем он станет нашим основным разделом, сменив, разумеется, название.

Сменой имени мы сейчас и займемся: для этого надо щелкнуть на уже знакомых нам синих прямоугольниках слева от названия раздела и выбрать пункт «Редактировать».

Откроется следующее окошко:



Рис. 2.24 Редактирование инфоблока.

Первым делом смотрим на строки, начинающиеся со слов URL – они «привязывают» раздел каталога к соответствующей папке на сайте. Как видно, там стоит ссылка на папку /e-store/books, которую мы уже давным-давно переназвали.

Заменяем слово books во всех трех строчках на main_catalog. Уже лучше.

Теперь осталось изменить строчку «Название», вписав туда «Каталог декоративных товаров» вместо изначального «Книги», также изменим символьный код на goods.

Теперь можно нажимать на кнопку «Применить» и переходить к вкладке «Свойства»:



Рис. 2.25 Свойства инфоблока..

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

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



Рис. 2.26 Измененные свойства инфоблока..

Намного лучше! Нажимаем «Сохранить» и выходим из меню редактирования.

Теперь наш путь лежит в «Контент» - «Каталог книг» - «Каталог декоративных товаров». Нам отобразится содержимое этого инфоблока:



Рис. 2.27 Содержимое инфоблока..

Напомним, название его мы изменили, но содержимое осталось прежним, книжным – именно поэтому в нем находится столько ненужных подразделов.

Что ж, начнем потихоньку изменять все это в нужную нам сторону, для начала создав новый подраздел, а посему щелкаем на кнопке «Добавить подраздел», расположенной сверху.

Незамедлительно откроется новое окно. Нас пока интересует лишь поле «Название» - и мы вводим туда «Все для цветов»: именно так будет называться наш новый подраздел.





Рис. 2.28 Новый раздел.

Нажимаем «Сохранить» и заходим в новоиспеченный подраздел. Пока что он девственно пуст; это исправимо – щелкаем на кнопке «Добавить элемент»:





Рис. 2.29 Добавление элемента.

Вслед за этим открывается достаточно сложносочиненное окошко. Давайте-ка создадим тестовый предмет для нашего каталога – обычный горшок. Вводим название, год выпуска и имя компании. Стоить он будет 300 рублей, а торговая наценка составит 30%:





Рис. 2.30 Параметры элемента.

Затем открываем вкладку «Анонс» и вносим туда информацию, которая будет выводиться на общей странице каталога; то же самое проделываем и на странице «Подробно»:





Рис. 2.31 Подробная информация.

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

Для этого можно воспользоваться кнопкой «Обзор» на вкладках «Анонс» и «Подробно» и выбрать нужный файл на диске. При сохранении нашего товара, изображения запишутся в папку 1C-Bitrix\www\upload.

Готово! Кликаем на вкладке «Разделы» и проверяем, в том ли разделе оказался созданный товар:





Рис. 2.32 Раздел, в котором размещен элемент.

Все нормально, поэтому щелкаем на «Сохранить» и выходим из меню; на этом второй день сотворения сайта можно считать оконченным.


День 3


Сегодня пришло время вплотную заняться навигационными меню; в первую очередь наш путь лежит во вкладку «Редактировать сайт», расположенную слева вверху панели управления.

Там входим в «Каталог декоративных товаров», пользуясь стандартной навигацией, и нажимаем на кнопку «Редактировать параметры компонента (“Пункты меню”, bitrix::menu.sections)», расположенную рядом с боковым меню:





Рис. 3.1 Переходим к редактированию параметров компонента.

Нажимаем на нее, и в открывшемся окне ищем строчку «URL, ведущий на страницу с содержимым раздела», меняя books на main_catalog, чтобы пункты меню указывали туда, куда надо:





Рис. 3.2 Изменяем параметры компонента.

Готово? Теперь пришла пора вернуться в панель управления, а именно - в информационный блок «Каталог декоративных товаров», куда мы вчера добавляли новый подраздел:





Рис. 3.3 Удаляем лишние разделы.

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

Сейчас нам надо вернуться в раздел «Каталог книг» («Информ. блоки» - «Типы информ. блоков» - «Каталог книг»); там будет находиться один-единственный инфоблок «Каталог декоративных товаров».

Что ж, создаем еще один инфоблок, щелкнув на кнопке «Добавить инфоблок».

Откроется новое окно, в котором нам надо будет заполнить все те же поля, что и в случае «Каталога декоративных товаров». Исключения будет три: во-первых, в полях под названием «URL страницы…» нам надо вписать путь не к main_catalog, но к misc_catalog (этот каталог мы создавали, если помните, чуть раньше); во-вторых, в качестве символьного кода нам нужно указать misc; наконец, третье – называться инфоблок будет не иначе как «Каталог сопутствующих товаров».



Рис. 3.4 Создание еще одного инфоблока.

После этого нажимаем «Сохранить» и начинаем работать с новоиспеченным инфоблоком: создаем там подраздел «Клеящие вещества» и элемент «Клей» точно таким же образом, как и в случае «Каталога сопутствующих товаров». Что ж, теперь наш каталог минимально, но заполнен.

Далее наш путь лежит в раздел ««Файлы и папки», расположенный в «Структуре сайта». Там нас интересует папка /e-store/misc_catalog – нам необходимо сделать так, чтобы в разделе «Каталог сопутствующих товаров» пользователь мог найти элементы соответствующего инфоблока.

Для начала нам надо отредактировать файл index.php, поэтому мы кликаем на синих прямоугольниках слева от него и выбираем пункт «Редактировать как HTML»:





Рис. 3.5 Переходим к редактированию страницы.

Откроется новое окошко, внутри которого будет выведена структура главной страницы раздела сайта «Каталог сопутствующих товаров»; в данном случае на ней присутствует два компонента: комплексный компонент Каталог (фиолетовая пиктограмма) и компонент Ссылка на корзину (желтая пиктограмма).

Щелкаем по фиолетовой иконке и смотрим свойства, которые будут выведены снизу. Ссылка на инфоблок идет неверная: она указывает на «Каталог декоративных товаров». Исправляем это, выбрав в выпадающем меню пункт «Каталог сопутствующих товаров»:



Рис. 3.6 Переходим к редактированию страницы.

Также изменяем заголовок страницы на «Декоративные товары». Сохраняем файл и выходим из редактора по кнопке в левом верхнем углу «Сохранить и выйти».

Вроде бы все нормально, но в меню в левой части указывается старый-добрый «Каталог книг». Это надо исправить.

Для этого в разделе «Контент» найдем в меню слева внизу пункт «Информ. блоки», а в нем – «Типы информ. блоков». Там находим «Каталог книг» и переназываем его в более нейтральное «Каталог»:





Рис. 3.7 Переименовываем тип инфоблока.

Полдела сделано! Теперь нам надо отправиться во вкладку «Редактировать сайт» и в нем войти в раздел «Каталог» - «Сопутствующие товары»: нам предстоит провести заключительную настройку меню.

Для этого нужно щелкнуть на кнопку «Редактировать параметры компонента (“Пункты меню”, bitrix:menu.sections)», расположенную слева сверху от полоски меню, а затем прописать URL’ы к misc_catalog (как мы это уже не раз делали) и изменить инфоблок на «Каталог сопутствующих товаров».



Рис. 3.8 Переходим к редактированию меню.

Поздравляем: мы разобрались с каталогом!

Теперь нам надо создать раздел «О компании»; делать мы его будем на основе раздела «Контент», а посему отправляемся в «Панель управления», а далее – в раздел «Структура сайта» - «Контент».



Рис. 3.9 Содержимое раздела Контент.

Открываем файл «Меню типа “left”»: здесь приведены названия всех подразделов раздела «Контент», и мы сейчас должны выбрать те, которые нам точно не понадобятся.





Рис. 3.10 Редактирование левого меню раздела Контент.

Нам явно не потребуется «Доска объявлений» и «Каталог ресурсов» (запоминаем, что им соответствуют папки /content/board/ и /content/links/ соответственно), а потому удаляем их из меню.

Но этого недостаточно, поскольку нам надо удалить не только ссылки, но и сам раздел тоже, и для этого нам нужно отправиться в раздел «Файлы и папки». Там находим папку content – и удаляем в ней папки board и links.

Сам раздел также нуждается в корректировке, поэтому открываем свойства папки «Контент» и переназываем ее в «О компании» - напомним, подобную процедуру мы уже выполняли, когда переназывали «Каталог книг»:





Рис. 3.11 Изменяем название раздела.

Это, впрочем, еще не все: нам надо отредактировать не только левое навигационное меню (заключенное в файл «Меню типа “left”»), но и верхнее – «Меню типа “top”», лежащее в папке «Декоры.ру» раздела «Структура сайта».

В этом файле мы переназываем раздел «Контент» в, опять-таки, «О компании»:



Рис. 3.12 Редактируем верхнее меню.

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

С этой целью мы отправляемся в раздел «Структура сайта» - «Декоры.ру» - «О компании» - «Статьи» и открываем файл «Статьи», выбрав в выпадающем меню пункт «Редактировать как HTML»:



Рис. 3.13 Переходим к редактированию страницы.

В уже знакомом нам окне редактирования выбираем компонент, расположенный на странице, и в нижнем окне указываем количество новостей на странице, равное 5:





Рис. 3.14 Изменяем количество статей на странице.

Сохраняем страницу и закрываем окно, щелкнув на кнопке слева вверху.

Теперь мы займемся другим полезным делом: созданием новой страницы.

Для этого нам надо войти в папку «О компании», расположенную в разделе «Декоры.ру» раздела «Структура сайта» и щелкнуть на кнопке «Новый файл», расположенной сверху.

Откроется окно редактирования страницы; здесь нам следует ввести текст и определить заголовок: допустим, это будет страница с контактными данными под названием «Как с нами связаться».



Рис. 3.15 Создание новой страницы.

Сохраняем страницу как contact.php – и новая страница готова.

Теперь нам надо сделать ссылку на этот файл из главной строки меню.

С этой благой целью отправляемся в корневую папку «Декоры.ру» и редактируем «Меню типа ‘top’»: нам нужно добавить ссылку на свежесозданный файл, вписав в левое поле название нового пункта меню («Как с нами связаться»), а в правое – ссылку на файл:





Рис. 3.16 Добавление пункта меню.

Проверяем в публичном разделе: ссылка работает.

Что ж, отлично – пришло время вычистить структуру сайта от лишних элементов. Для этого мы возвращаемся в панель управления и отправляемся в тип инфоблока «Сервисы»:



Рис. 3.17 Добавление пункта меню.

Отмечаем галочками и удаляем «Каталог ресурсов» и «Доска объявлений» - они нам точно не понадобятся.

Теперь нам нужно отредактировать правую часть страницы – ту, где выводятся подсказки по ознакомительной демо-версии сайта. Естественно, в финальном варианте они нам не нужны.

Путь наш лежит к файлу index_inc.php, который находится в корневой папке раздела «Структура сайта» - «Файлы и папки». Редактируем его как HTML:





Рис. 3.18 Переходим к редактированию включаемой области.

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





Рис. 3.19 Удаляем информацию про автокеширование.

После чего сохраняем страницу и выходим; ту же редактуру проводим и с index.php, избавляя его от ненужного нам текста.

Теперь нам надо позаботиться и о левой части: для этого нужно войти в папку /bitrix/templates/books раздела «Файлы и папки», где хранятся все шаблоны нашего сайта.

Эта страница весьма полезна, поэтому ее стоит добавить в «закладки», кликнув на кнопку «Избранное» слева вверху и выбрав соответствующий пункт меню:





Рис. 3.20 Добавляем страницу в избранное.

Далее начинается самое интересное – открываем файл header.php как текст и смотрим PHP-код в поисках блока авторизации, подписки и рекламы.





Рис. 3.21 Удаляем лишнее из шаблона.

А, вот он! Выделяем все от





Авторизация

До:


td><td class=”main-column”> (эту строчку не выделяем!)

Удаляем выделенное и отправляемся в публичный раздел: отлично, назойливой левой части больше нет:





Рис. 3.22 Шаблон в публичной части.

На этом наш план на третий день выполнен; можно отдохнуть.


День 4.


Сегодня мы продолжим удаление лишнего: путь наш лежит в раздел «Настройки» - «Настройки продукта» - «Модули», что находится в панели управления.

Здесь мы видим список всех установленных модулей; нам явно не понадобятся модули рассылки и форума, а потому нажимаем на кнопки «Удалить» рядом с соответствующими элементами:





Рис. 4.1 Модули системы.

Теперь мы должны окончательно избавить наш каталог от элементов интернет-магазина – т.е. убрать все кнопки «Купить», «Положить в корзину», а также упоминания о самой корзине.

Для этого нам надо настроить показ цены: отправляемся в раздел «Магазин» панели управления и щелкаем на пункте «Торговый каталог» - и на элементе «Типы цен».



Рис. 4.2 Типы цен.

В этом окне нужно вручную пройтись по свойствам каждого элемента (кликая, как обычно, на синих прямоугольниках); каждому типу цен присвоены группы пользователей, которые имеют право просматривать цены на данный товар и производить покупку, и мы выставляем каждому типу цен группу «[22] Панель управления» - таким образом никто, кроме пользователей, обладающих правом доступа в панель управления не сможет видеть кнопки интернет-магазина.

А как же мы будем показывать цены? Не волнуйтесь: с этим мы сейчас же разберемся.

Для этого мы отправляемся в свойства инфоблока «Каталог декоративных товаров» (кликнув, напомним, из главного раздела «Каталог» на синих прямоугольниках слева от его названия) и добавляем во вкладке «Свойства» новый атрибут товара – «Цена»:





Рис. 4.3 Добавляем свойство инфоблока.

Таким образом можно выводить цены во всех редакциях «1С-Битрикс: Управление сайтом». Для редакций, в которые входит модуль Торговый каталог, можно использовать его возможности, но это потребует дополнительного пояснения.

Для полной картины делаем то же самое и для «Каталога сопутствующих товаров».

Теперь можно отправиться в недра нашего каталога и выставить вручную цену для нашего старинного приятеля «Горшка», вписав ее в соответствующее поле его свойств; кроме того, стоит указать и количество на складе – 10 штук – чтобы на страницах сайта не выводилось сообщение «Нет на складе».

То же самое проделываем и для объекта «Клей» из «Каталога сопутствующих товаров»; столь хитрое – по сути, двойное - указание цены выполняет следующую роль: если в перспективе мы решим сделать на основе нашего каталога интернет-магазин, мы сможем взять их напрямую из базы данных.

Теперь надо разобраться с общим информационным наполнением нашего сайта: для этого мы отправляемся в уже знакомый нам раздел «Типы информ. блоков» и удаляем тип «Новости», после чего удаляем пункт «Новости» из файла меню в папке «О компании» раздела «Структура сайта» - «Файлы и папки» - раздел /content/news. Новости будут представлены у нас чуточку иначе.

Дальше мы направляемся в инфо-блок «Статьи» - и в одноименном разделе находим множество не нужных нам текстов:



Рис. 4.4 Элементы инфоблока Статьи.

Удаляем их выделив, как обычно, галочками и щелкнув на красном кресте снизу.

Остается навести порядок в атрибутах статей: отправляемся в тип инфоблока «Статьи» и открываем свойства инфоблока, опять-таки, «Статьи»; там нам нужно отправиться во вкладку «Свойства» и удалить все позиции кроме «Ключевые слова» и «Автор» - для описания статьи оставшихся будет достаточно.

Добавляем новый текст в раздел «Статьи», щелкнув на кнопке «Добавить элемент»:





Рис. 4.5 Добавление элемента инфоблока Статьи.

На первой вкладке нам нужно ввести имя автора, название статьи и ключевые слова:





Рис. 4.6 Редактирование элемента инфоблока Статьи.

На второй – заполнить информацию для анонса статьи:





Рис. 4.7 Анонс элемента.

Наконец, вставляем текст самой статьи:





Рис. 4.8 Подробная информация по элементу.

На этом заполнение информационного блока будем считать завершенным – и начнем разбираться с фотогалереей.

Сложного в этом ничего нет: сначала, как и в случае статей и товаров, удаляем имеющиеся лишние элементы из раздела «Фотогалерея», а затем создаем папку «Лучшие работы» и добавляем в нее новые фотографии, щелкнув по кнопке «Добавить элемент».

Последовательность действий такова: сначала создаем 2 варианта фотографии – компактный и полноразмерный, затем во вкладке «Анонс» и «Подробно» указываем путь до фотографий по кнопке «Обзор» и заполняем сопутствующий текст точно так же, как и при добавлении статей:





Рис. 4.9 Добавление фотографии.

На этом все - фотогалерея готова; на очереди – редактирование раздела FAQ, т.е. частых вопросов.

Этим мы и займемся, отправившись в инфо-блок FAQ раздела «Сервисы»:



Рис. 4.10 Раздел FAQ.

Первым делом удаляем явно лишний раздел «Настройка продукта», а дальше следуют уже привычные операции: верхний раздел мы переименуем в «О наших товарах», нижний – в «Об украшении интерьеров».

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

Делается это, опять-таки, чрезвычайно просто – кнопкой «добавить новый элемент» добавляются новые вопросы, а сам текст вопроса указывается в свойствах объекта в поле «Название» вкладки «Элемент», тогда как ответ – в тексте «Анонса». Вкладку «Подробно» заполнять не надо.

Таким образом добавляем несколько новых вопросов в разделы «О наших товарах» и в «Об украшении интерьеров» - и все готово.

Далее приступаем к не менее важной задаче: добавлению товаров в каталог.

Новый товар добавляется аналогично добавленному нами «Горшку» или «Клею» - и точно так же, как любая фотография или новость, а потому перечислим лишь основные действия.

В разделе «Товары» - «Каталог декоративных товаров» нужно создать папку «Декоративные вазы»; в нее мы добавляем новый элемент, в его свойствах указывая базовую цену, количество на складе и прочие атрибуты вроде названия и описания:





Рис. 4.11 Добавляем элемент.

Нажимаем «Сохранить» - и все готово!

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

Теперь нам надо удалить совсем уж лишние детали: главным образом это касается главной страницы с приветственным демо-тестом.

Чтобы это исправить, нужно перейти во вкладку «Редактировать сайт» слева сверху и перейти на главную страницу; там нас особо интересует кнопка «Редактировать текущую страницу», расположенная сверху под вкладкой «Публичный раздел». При нажатии на нее откроется старый-добрый визуальный редактор – выделяем в его окне весь не нужный нам текст и удаляем.

Те же самые действия производим и над главной страницей раздела «Каталог», заменив весь текст на что-нибудь нейтральное, к примеру – «Приветствуем вас в каталоге "Декоры.ру"!»

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

День 5


Первое, чем мы займемся сегодня, в заключительный день - удалим лишние элементы в разделе «Настройки» - «Модули» (там хранятся программные ядра всех модулей CMS «1С-Битрикс»).

Нам надо удалить следующие модули (для этого надо щелкнуть по кнопке «Удалить» напротив соответствующего пункта): «Блоги», «Опросы, голосования», «Подписки, рассылки» и, наконец, «Форум».

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

Для этого в разделе «Файлы и папки» нам нужно отправиться по адресу /bitrix/templates/books и там найти файл footer.php; его нужно редактировать как PHP (точно так же, как мы делали раньше).

Здесь нам надо удалить следующий мусорный кусок кода:



Рис. 5.1 Изменение шаблона.

Третье, что нам надо сделать – войти в папку «О компании» (в разделе «Структура сайта» - «Декоры.ру») и отредактировать файл «Контент» как HTML, вписав туда пару приветственных слов:





Рис. 5.2 Редактирование страницы..

И, наконец, на страницах сайта нам надо отредактировать полоску справа сверху (с иконками поиска, карты сайта и т.д.), чтобы иконка с письмом содержала не ссылку на страницу обратной связи, а отправляла электронное письмо на указанный нами адрес электронной почты. Для этого нам надо открыть вкладку «Редактировать сайт» (расположенную слева вверху) и щелкнуть на иконку «Редактировать область как php».

Внутри этот файл устроен весьма просто: каждая строчка кода соответствует кнопкам на панели, начиная слева направо.



Рис. 5.3 Редактирование файла header_icons.php.

Соответственно, нижнюю строчку, отвечающую за показ версии для печати, можно совсем удалить, а в строчке со словами «Обратная связь» на место ссылки надо подставить следующее:



mailto:info@decory.ru

(сюда мы вписали предполагаемый адрес электронной почты нашего каталога)

На этом главная часть работы завершена; теперь нам предстоит последнее, но крайне ответственное дело – выкладка созданного сайта на хостинг.

К счастью, создатели «1С-Битрикса» предусмотрели несколько путей загрузки готового демо-сайта, и мы воспользуемся самым простым и надежным из них.

Для начала нам надо подготовить резервную копию нашего сайта; для этого нужно открыть меню «Резервное копирование» раздела «Настройки» - «Инструменты»:

В открывшемся меню нужно установить параметры архивации: указать, что архивация будет происходить по шагам, поставить длительность каждого шага – 55 секунд, указать архивацию публичной части и ядра, а также максимально допустимый размер файлов (мегабайт с небольшим, стоящий по умолчанию, вполне подойдет).

Кроме того, стоит указать на архивацию базы данных и на исключение из архивы статистики (впрочем, на данном этапе последнее не имеет особого значения):



Рис. 5.4 Создаем резервную копию.

После этого можно нажимать на кнопку «архивировать» - и система приступит к созданию резервной копии. Процесс этот займет определенное время, поэтому пока можно заняться хостингом: для нормальной работы «1С-Битрикс» требует наличия MySQL 4.0.18 или выше (подойдет Oracle 10g или выше, а также MSSQL 2000 или выше), Apache 1.3 (можно MS IIS 5.0) и PHP версии 4.1.2; к этой стороне дела стоит отнестись с должным вниманием.

Кроме того, для работы зарегистрированной демо-версии понадобится Zend Optimizer, установленный на сервере.

Мы подобрали хостинг под требования «1С-Битрикс», зарегистрировали домен decory.ru.

Для продолжения процедуры установки нам надо получить полный FTP-доступ к нашему сайту и запросить всю информацию о реквизитах SQL-базы данных на хостинге (о том, какую именно информацию мы оттуда взяли, скажем чуть ниже).

В это время как раз закончилось создание резервной копии; ну что ж, отлично: теперь мы можем скачать ее из окна снизу, расположенного в разделе «Резервное копирование» - там появится соответствующий файл с расширением .tar.gz.





Рис. 5.5 Файл резервной копии.

Заодно щелкаем на ссылку «Скачать», расположенную за текстом «Для переноса архива на другую систему или для восстановления системы из архива воспользуйтесь скриптом для восстановления» снизу страницы, чтобы скачать файл restore.php; нам этот скрипт весьма пригодится.

Вот теперь можно отсылать свежесозданный архив .tar.gz и скачанный скрипт с расширением .php на сайт, воспользовавшись любым FTP-менеджером.

Этот процесс тоже занимает время - кажется, самое время выпить чаю.

После закачки самое время установить на оба закачанных файла права 0777 (то есть всеобщие права на запись, удаление и запуск), требуемые для нормальной распаковки резервной копии; это можно сделать, опять же, при помощи FTP-менеджера.

После этого можно запускать браузер и вводить там следующее:



http://decory.ru/restore.php

После этого откроется простенькое окно, в котором надо будет ввести длительность шага распаковки (55 секунд) и нажать на кнопку запуска; незамедлительно начнется распаковка файлов и сайт начнет монтироваться на сайт; что ж, наш сайт почти готов!

После окончания распаковки нам осталось проделать всего 2 шага. Перво-наперво, следует проверить, соответствует ли владелец распакованных файлов фактическому положению дел – все файлы на сервере должны принадлежать четко определенному пользователю, но ни в коем случае не «(?)» или «unknown». Возникнет ли необходимость менять владельца или нет в конкретно вашем случае – сказать сложно, это зависит от настроек сервера, но служба поддержки вашего хостинга, в любом случае, сможет вам помочь.

Наконец, последнее, что мы должны сделать – это настроить файл dbconn.php, отвечающий за привязку базы данных к нашему сайту. Расположен этот файл по следующему адресу:

/www/bitrix/php_interface/dbconn.php

Изначально он имеет следующий вид:





define("DBPersistent", false);

$DBType = "mysql";

$DBHost = "localhost:31006";

$DBLogin = "root";

$DBPassword = "";

$DBName = "bsm_demo";

$DBDebug = false;

$DBDebugToFile = false;

@set_time_limit(60);

@umask(0);

define("DELAY_DB_CONNECT", true);

define("CACHED_b_file", 3600);

define("CACHED_b_file_bucket_size", 10); // Максимальное число файлов таблицы b_file, сохраняемое в одном файле кеша

?>

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

После чего можно сохранять файл dbconn.php и отправляться в браузер. Теперь, если все сделано правильно и настройки хостинга верны, по запросу http://decory.ru будет открываться сайт:



Рис. 5.6 Наш сайт.

Итак, сайт работает; административная часть теперь доступна по следующему адресу: http://decory.ru/bitrix/admin - там потребуется ввести логин и пароль, и можно продолжать работу уже не на локальном компьютере, но в режиме онлайн.



Что ж, поздравляем! Вместе с вами мы создали сайт на «Битриксе» всего за 5 дней – фактически, за рабочую неделю. Как видите, все не так сложно, как кажется – и мы будем рады, если этот материал поможет вам сделать свой собственный сайт, не затрачивая много времени и ненужных усилий!




Достарыңызбен бөлісу:




©dereksiz.org 2024
әкімшілігінің қараңыз

    Басты бет