понеділок, 17 серпня 2009 р.

Добавление категории и ссылки на нее в шаблон сайта

Сейчас мы рассмотрим, как создавать категории для новостей и как прописывать их в шаблон (на примере стандартного шаблона "Default").

Для того, чтобы создать категорию на сайте, надо обладать правами администратора.
При наличии этих прав, достаточно перейти в админпанель(сылка на нее есть в "Панели управления" в правом верхнем углу страницы).
В админпанели, по адресу:
http://имя_вашего_сайта/admin.php?mod=main
мы видим три длинных кнопки: "добавить новость", "редактировать новости" и "другие разделы".

Нажимаем "другие разделы":
http://имя_вашего_сайта/admin.php?mod=options&action=options


Там открываем "Категории"
http://имя_вашего_сайта/admin.php?mod=categories

и видим следующее:
Добавление категории и ссылки на нее в шаблон сайта


Ко всем пунктам есть подсказки, поэтому не буду особо описывать каждый из них. Остановлюсь только на пункте "Альтернативное имя" - он заполняется латиницей, и если вы не выбрали родительскую категорию, то ссылка на созданную категорию будет иметь вид:
http://имя_вашего_сайта/alternativnoe_imja

Заполняем все обязательные поля - и у нас появляется новая категория.

Теперь, рассмотрим как добавить ссылку на созданную категрию в стандартный шаблон.
Зайдем в админпанель, сразу в раздел редактирования шаблонов:
http://имя_вашего_сайта/admin.php?mod=templates

выбираем там "Общий макет страницы" и в появившемся окошке ищем "Навигация по сайту". Ниже видим
<tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/spacer.gif" width="1" height="5" /></td>
                                    <td align="left" nowrap="nowrap"><img src="/templates/Default/images/spacer.gif" width="1" height="5" /></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/spacer.gif" width="1" height="5" /></td>
                                    <td align="left" nowrap="nowrap"><img src="/templates/Default/images/spacer.gif" width="1" height="5" /></td>
                                  </tr>
                                  <tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">О сайте</a></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">В мире</a></td>
                                  </tr>
                                  <tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Экономика</a></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Религия</a></td>
                                  </tr>
                                  <tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Криминал</a></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Спорт</a></td>
                                  </tr>
                                  <tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Культура</a></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Инопресса</a></td>
                                  </tr>


Для примера, заменим
<a href="#">В мире</a>

на
<a href="/alternativnoe_imja">Новая категория</a>


и получим:
<tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/spacer.gif" width="1" height="5" /></td>
                                    <td align="left" nowrap="nowrap"><img src="/templates/Default/images/spacer.gif" width="1" height="5" /></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/spacer.gif" width="1" height="5" /></td>
                                    <td align="left" nowrap="nowrap"><img src="/templates/Default/images/spacer.gif" width="1" height="5" /></td>
                                  </tr>
                                  <tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">О сайте</a></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="/alternativnoe_imja">Новая категория</a></td>
                                  </tr>
                                  <tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Экономика</a></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Религия</a></td>
                                  </tr>
                                  <tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Криминал</a></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Спорт</a></td>
                                  </tr>
                                  <tr>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Культура</a></td>
                                    <td width="15" align="left"><img src="/templates/Default/images/dlet_navi_point_1.gif" width="15" height="16" /></td>
                                    <td align="left" nowrap="nowrap"><a href="#">Инопресса</a></td>
                                  </tr>


Сохраняем изменения в шаблоне страницы - и вот у нас есть новая каьегория и ссылка на нее на главной странице. smile
Оригинал статьи можно найти на сайте apache.kiev.ua

Добавляем красивые хинты на сайт при помощи джаваскрипта.

Я давно искал, как бы заменить стандартные (и достаточно невзрачные) хинты на сайте на что-то более заметное и удобное.
И вот, недавно нашел.

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

1) положить в корень сайта файл mw_hint.js
2) в таблице стилей добавить код
.hint {
background-color: #74B2D4;
line-height: 10px;
color: white;
font-family: Verdana;
font-size: 10px;
width: auto;
border-top: 1px solid white;
border-right: 1px solid white;
border-bottom: 1px solid white;
border-left: 1px solid white;
margin: 1px;
padding: 2px;
position: absolute;
visibility: hidden;}


3) в файле шаблона добавить
<script type="text/javascript" src="/mw_hint.js"> </script>
до тега
</head>
.

После этого, все элементы, имеющие аттрибут "title" будут выглядеть так же, как на этом сайте. Для примера - наведите курсор на текст "Apache's blog" в шапке сайта. smile

Оригинал статьи можно найти на сайте apache.kiev.ua - Datalife Engine для начинающих

Установка Datalife Engine на Denwer

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

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

Как это работает?
Вы устанавливаете локальный веб-сервер на своем компьютере - набор программ, которые позволяют тестировать разные скрипты прямо у себя на компьютере. Вы можете ставить DLE и любые другие движки и скрипты на свой компьютер почти так же, как на удаленный сервер на хостинге ("почти так же" в данном случае означает "легче" и без риска запороть уже работающий сайт).

Что нам для этого нужно?
Нам потребуется приложение-вебсервер. Я рекомендую использовать "denwer". Денвер - это набор дистрибутивов (Apache, PHP, MySQL, Perl и т.д.) и программная оболочка, l0;спользуемые Web-разработчиками для разработки сайтов на «домашней» (локальной) Windows-машине без необходимости выхода в Интернет (описание взято мной с официального сайта). Он очень прост в установке и не требует дополнительных настроек после нее.
Еще нам понадобится дистрибутив DLE, демоверсию которого можно взять на официальном сайте разработчиков.


Итак, приступим.

Устанавливаем DENWER


1) Для начала, возьмем denwer: 1240163294_denwer3_base_2008-01.rar [5.38 Mb] (cкачиваний: 0)
2) Устанавливаем denwer: распаковываем скачанный архив и запускаем Denwer3_Base_2008-01-13_a2.2.4_p5.2.4_m5.0.45_pma2.6.1.exe
3) Появится окно с предложением начать установку:
Установка DLE на локальный компьютер

мы нажимаем "Yes", после чего появляется черное ДОСовское окошко с текстом
Приветствие... Для продолжения закройте браузер.
и откроется окно браузера с информацией о том, что сейчас начнется инсталляция денвера.
4) Закрываем окно браузера. В ДОСовском окошке появляется текст
Для продолжения нажмите Enter.
Нажимаем "Enter". После этого инсталлятор денвера проверит нужные для работы файлы, и спросит, куда ему установиться:
Установка DLE на локальный компьютер

Указываем путь, куда его устанавливать, или просто нажимаем "Enter", если предложенный по умолчанию вариант устраивает.
5) После этого инсталлятор переспросит, туда ли устанавливать сервер, или в другое место. Когда вы подтвердите свой выбор, будет задан вопрос о букве виртуального диска. Инсталлятор хочет создать виртуальный диск, на котором будет размещен сервер и весь сайт в будущем. Выбирайте любую букву, на которую еще не на
79;начен диск в системе.
6) Инсталлятор скопирует все необходимые файлы, после чего появится текст
█ Денвер может запускаться в двух режимах:
█ 1. Виртуальный диск создается ПРИ ЗАГРУЗКЕ ОС. Запуск серверов
█ осуществляется с помощью ярлыка на Рабочем столе. При завершения
█ работы Денвера виртуальный диск НЕ отключается.
█ * Этот режим рекомендуется использовать, если вы собираетесь
█ * использовать виртуальный диск, не запуская серверов (например,
█ * хотите запускать Perl-скрипты не только из браузера, но и из
█ * командной строки).
█ 2. При загрузке ОС виртуальный диск НЕ создается. На Рабочем столе
█ также, как и в п. 1, создаются ярлыки для запуска и останова серверов.
█ При запуске серверов вначале создается виртуальный диск, после
█ останова - диск отключается.
█ * Необходимо помнить, что в этом режиме при неактивном Денвере не
█ * будет доступа к виртуальному диску (в частности, к Perl).
█ * Кроме того, некоторые версии Windows не умеют правильно отключать
█ * виртуальный диск (требуется перезагрузка).

█ Рекомендуется выбрать вариант 1, потому что он наиболее удобен.

> Введите 1 или 2 [1]:

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

Если вы все-таки решили не создавать ярлычки для запуска, или они по каким-либо причинам не создались - расскажу, как запускать вручную:
Открываете папку, куда установился денвер (обычно - "C:\WebServers"), там открываете "denwer" и по очереди запускаете Boot.exe и Run.exe
Если хотите отключить денвер - запустите по очереди Stop.exe и SwitchOff.exe

7) Все, денвер установлен и готов к работе (осталось только запустить его)!

Приступаем к установке движка на компьтере



1) Качаем демо-версию DLE(7.5): [attachment=5]. Открываем архив дистрибутивом Datalife Engine, и видим там три папки: Developer, Documentation и upload. Открываем папку upload распаковываем в папку home\localhost\www, которая находится на виртуальном диске, который вы указывали при инсталляции денвера. В процессе распаковки операционная система запросит разрешение заменить файлы - соглашайтесь, иначе движок не будет работать.

2) Запускаем Денвер. Открываем home\localhost\www на виртуальном диске, и переименовываем файл ".htacess" в ".htacess1" (это временная мера, потом надо будет вернуть все обратно - поэтому просто допишите один символ к имени, этого будет достаточно).
Открываем в браузере адрес http://localhost/tools/phpmyadmin/ - это панель управления базами данных. Базы данных используются для хранения почти всей информации, которая отображается на сайте, кроме настроек (об этом поговорим позже).
Здесь нам потребуется создать базу данных, чтобы DLE смог проинсталлироваться и вообще работать.
Установка DLE на локальный компьютер

Вы увидите приблизительно такое окно. В поле, которое на скриншоте я выделил желтым цветом, надо вписать название базу данных, которую вы хотите создать. Название должно быть написано латиницей, и желательно, не содержать символов кроме букв и цифр. Указав название, нажимайте кнопку "Создать". Теперь у нас есть пустая база данных.
Переименовываем ".htacess1" обратно в ".htacess".

3) Открываем в браузере "http://localhost/install.php"
Там мы увидим приветствие, текст лицензионного соглашения и кнопку "Начать установку". Ставим галочку возле "Я принимаю данное соглашение" и жмем " Начать установку ". Попадаем на следующую страницу - там показаны установленные компоненты PHP и рекомендуемые настройки. Если что-то из рекомендуемых настроек отмечено красным - ничего страшного, главное чтобы все компоненты PHP присутствовали и были отмечены зеленым. Жмем "Продолжить". Попадаем на страницу "Проверка на запись у важных файлов системы" - опять жмем "Продолжить".
И вот, мы на странице, где надо указать параметры базы данных, и информацию о администраторе. Об этом подробнее:
Установка DLE на локальный компьютер

Заполнять надо только поля, отмеченные желтым.
Имя базы данных: - указываем имя базы, которое вы написали в пункте 2
Имя администратора, пароль и и-мейл пишете на свое усмотрение. И-мейл можно указывать любой - на него всеравно ничего не будет приходить. (вся почта для администратора будет складываться в папке tmp\!sendmail на виртуальном диске).
Нажимаем "Продолжить" - все, установка DLE закончена!

Оригинал статьи можно найти на сайте apache.kiev.ua - Datalife Engine для начинающих