Оформление и добавление материалов на клан-сайт | Сайт клана Bregan Dart

Оформление и добавление материалов на клан-сайт

   Вопросы:
   1) Как создать новость или статью
   2) Как вставить картинку в новость или статью
   3) Как оформить таблицу
   4) Как оформить ник игрока
   5) Как оформить цитату (например, с форума игры)
   6) Как добавить фотографию в галерею
   7) Что следует помнить при разбиении текста на абзацы
   8) Как сделать абзацный отступ
   9) Какие общедоступные на клан-сайте изображения можно использовать в новости или статье
   10) Каким способом можно оформить интервью
   11) Что следует знать и учитывать при подготовке иллюстраций для сайта
   12) Как оформить ссылку
   13) Как самому установить размер усеченной версии новости

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

   1) Как создать новость или статью

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

   Теперь видим перед собой список доступных типов материалов. Разнообразие велико, но нас сейчас интересует только тип "Статья / Новость". Выбор типа публикации можно сделать как в центральной части страницы, так и слева, в меню. Это иллюстрируют два следующих скриншота.


   Далее появится форма ввода статьи/новости. У данного типа материала есть три атрибута: заголовок (поле ввода Title), раздел (выпадающий список Контент) и тело заметки (Body). Нижеследующий скриншот демонстрирует выбор раздела. Раздел следует выбирать наиболее подходящим по смыслу для заметки. На иллюстрации видно, к примеру, раздел Новости и два его дочерних раздела: "Клан" и "Грани реальности". Понятно, что новости о взятии уровней сокланов, свадьбах, других достижениях клана будут попадать в раздел "Новости - Клан", а заметки и новости об нововведениях и изменениях в игре - в раздел "Новости - Грани реальности".

   Кроме атрибутов данный тип публикации имеет и некоторые настройки. Я упомяну только о самых важных, потому что остальные вы не будете использовать в 90-100% случаев, как показывает практика существования нашего клан-сайта. Итак, для того, чтобы получить возможность применять к тексту любые стили (а это нужно в каждой новости и статье), следует изменить "Формат ввода" с позиции "Filtered HTML" на позицию "Full HTML". Данную операцию иллюстрирует следующий скриншот.

   Есть еще несколько настроек, которые могут вам пригодиться. Это флажки "Опубликовано" и "Представить на главной странице". Когда установлен флажок "Опубликовано", это значит, что ваша заметка присутствует на сайте, она доступна в разделе "Последние сообщения" и в разделе, в который была помещена сама публикации. Когда этот флажок снят, публикация видна только в списке неопубликованных материалов, для рядовых пользователей сайта она недоступна. Таким образом можно коллективно работать с черновиком новости/статьи, и когда работа завершена - просто опубликовать материал с помощью данного флажка.
   Название второго флажка говорит само за себя. Устанавливать его следует только для новостей, и тогда они попадают на главню страницу сайта, которая является новостной лентой. Для более обширных статей (мануалы, гайды и др.) его устанавливать не следует, данные типы материалов помещаются в соответствующие разделы сайта и доступны там.
   Нижеследующий скриншот иллюстрирует блок настроек публикации и, собственно, два описанных флажка.

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

   К списку вопросов

   2) Как вставить картинку в новость или статью

   Сначала кратко поясню сам механизм использования изображений в материалах. Весь механизм объясняется следующей цепочкой утверждений:
   - чтобы вставить картинку в текст, нам нужно знать ссылку на эту картинку;
   - если картинка общедоступна в Интернете, то ссылка на нее известна;
   - если картинка находится у вас на компьютере и предназначена для использования в материале, то сначала ее следует загрузить на клан-сайт, то есть сделать картинку общедоступной в Интернете, и получить на нее ссылку.
   Итак, некоторые картинки универсальны, и используются по всему клан-сайту. Следовательно, загружать их каждый раз на клан-сайт не нужно. Это например изображение клан-значка, изображение серебра, изображение золота и подобные. Полный их список смотрите в вопросе 9.
   Теперь расскажу, как загрузить и использовать на сайте подготовленную вами для заметки картинку.
   В форме ввода статьи/новости находится интересующий нас блок "Прикрепленные файлы" (смотрите скриншот ниже).

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

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

   Видим заголовок и текст заметки, а также список вложений. Естественно, отображение этого списка в новости/статье нежелательно, поэтому возвращаемся к блоку "Прикрепленные файлы". Теперь он выглядит, как показано ниже.

   Видим здесь список всех прикрепленных к публикации файлов, ссылки на них (а именно ссылку нам требуется знать, чтобы использовать картинку в тексте), размер файла изображения, а также флажки "Список" и "Удалить". Чтобы добиться скрытия списка вложений в тексте публикации у всех файлов в списке следует снять флажок "Список". Флажок "Удалить" используется, когда мы хотим "открепить" некоторый файл от публикации, в этом случае следует пометить нужные файлы данным флажком и нажать "Отправить".

   Итак, мы добились того, что у нас есть ссылка на изображение, в приведенном здесь примере она выглядит так: "http://www.bregan.erclans.ru/bregan/files/angels_0.jpeg".
В текст изображение вставляется с помощью следующей конструкции:

<img src="ссылка" />

   Попробуем использовать теперь наши знания на практике. Прикрепим картинку к публикации и введем следующий текст заметки:

А вот она, наша картинка
<img src="http://www.bregan.erclans.ru/bregan/files/angels_0.jpeg" />

   Полученный после отправки на сайт результат приведен на скриншоте.

   К списку вопросов

   3) Как оформить таблицу

   Приведу лишь два кратких примера здесь, для получения более полной информации обратитесь к описаниям тэгов HTML в клан-чат либо ко мне с конкретным вопросом.
   Пример первый. Таблица из двух строк и трех столбцов. Вводим в тело публикации текст

<table>
<tr>
<td>Первая строка</td>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>Вторая строка</td>
<td>3</td>
<td>4</td>
</tr>
</table>

   Результат:

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

<style>
table { border: solid 0px black;}
td { border: solid 0px black;}
tbody { border: solid 0px black;}
</style>
<table>
<tr>
<td>Первая строка</td>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>Вторая строка</td>
<td>3</td>
<td>4</td>
</tr>
</table>

   Результат:

   К списку вопросов

   4) Как оформить ник игрока

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

<b><span class="nick">nicronom</span></b>&nbsp;<span class="info"><a target="_blank" href="http://ereality.ru/~nicronom"><img title="Информация о персонаже" alt="Информация о персонаже" style="border: medium none;" src="http://www.bregan.erclans.ru/bregan/files/info.gif"/></a></span>

   Результат: nicronom Информация о персонаже

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

<img src="http://www.bregan.erclans.ru/bregan/files/93.gif" style="display: inline;" />&nbsp;<b><span class="nick">nicronom</span></b>&nbsp;<span class="info"><a target="_blank" href="http://ereality.ru/~nicronom"><img title="Информация о персонаже" alt="Информация о персонаже" style="border: medium none;" src="http://www.bregan.erclans.ru/bregan/files/info.gif"/></a></span>

   Результат:  nicronom Информация о персонаже

   К списку вопросов

   5) Как оформить цитату (например, с форума игры)

   Для оформления цитат в своих материалах я пользуюсь следующей конструкцией

<img src="http://www.bregan.erclans.ru/bregan/files/93.gif" style="display: inline;" /> <b><span class="nick">nicronom</span></b> <span class="info"><a target="_blank" href="http://ereality.ru/~nicronom"><img title="Информация о персонаже" alt="Информация о персонаже" style="border: medium none;" src="http://www.bregan.erclans.ru/bregan/files/info.gif"/></a></span>
<div class="erquote">
<b>Реферальная программа</b>

Реферальная ссылка имеет вид <a>http://www.ereality.ru/reg33076.html</a>

Каждый зарегистрировавшийся по реферальной ссылке персонаж считается рефералом 1-го уровня для владельца ссылки и рефералом 2-го уровня для персонажа, по реферальной ссылке которого зарегистрировался владелец.
</div>

Результат:

 nicronom Информация о персонаже:

Реферальная программа

Реферальная ссылка имеет вид http://www.ereality.ru/reg33076.html

Каждый зарегистрировавшийся по реферальной ссылке персонаж считается рефералом 1-го уровня для владельца ссылки и рефералом 2-го уровня для персонажа, по реферальной ссылке которого зарегистрировался владелец.

Чтобы шрифт в цитате не отличался от шрифта сайта меняем "erquote" на "erquoteint". Результат:

 nicronom Информация о персонаже:

Реферальная программа

Реферальная ссылка имеет вид http://www.ereality.ru/reg33076.html

Каждый зарегистрировавшийся по реферальной ссылке персонаж считается рефералом 1-го уровня для владельца ссылки и рефералом 2-го уровня для персонажа, по реферальной ссылке которого зарегистрировался владелец.

   К списку вопросов

   6) Как добавить фотографию в галерею

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

   Теперь видим перед собой список доступных типов материалов. Нас сейчас интересует тип "Изображение". Выбор типа публикации можно сделать как в центральной части страницы, так и слева, в меню. Это иллюстрируют два следующих скриншота.


   Далее появится форма добавления изображения.


   Следует заполнить три обязательных поля: заголовок, галерея (Image Galleries) и указать путь к файлу (Image). Также можно написать подробное описание фотографии в поле "Текст".
   Отдельно расскажу о галереях. Они могуть быть вложены друг в друга. То есть в галерее "Сокланы" присутствует отдельная галеря для каждого соклана. Галерею следует указывать по смыслу. Если вам нужно создать какую-то новую галерею - обращайтесь ко мне или в клан-чат. Вот список уже существующих галерей и их краткое описание

Название Описание
Сокланы Здесь есть альбом каждого соклана, кто захотел добавить фотографии на сайт.
Друзья клана Альбомы тех, кто когда-то был в клане, либо просто тех, кто дружит со многими из клана и захотел разместить свои фотографии у нас.
Встречи Фотоотчеты о встречах в реальной жизни. :)
Образы Изображения, эскизы, наброски и т.д. желаемых образов.
Скриншоты Примечательные чем-то скриншоты из игры.

   К списку вопросов

   7) Что следует помнить при разбиении текста на абзацы

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

   К списку вопросов

   8) Как сделать абзацный отступ

Я использую конструкцию

&nbsp;&nbsp;&nbsp;Начало абзаца...

   Результат:

   Начало абзаца...

   И чем больше повторений "&nbsp;", тем большим будет отступ.

   К списку вопросов

   9) Какие общедоступные на клан-сайте изображения можно использовать в новости или статье

Изображение Ссылка
http://www.bregan.erclans.ru/bregan/files/silver.gif
http://www.bregan.erclans.ru/bregan/files/gold.gif
http://www.bregan.erclans.ru/bregan/files/93.gif
http://www.bregan.erclans.ru/bregan/files/93a.gif
http://www.bregan.erclans.ru/bregan/files/info.gif

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

:123:

   Получаете: Smile

   К списку вопросов

   10) Каким способом можно оформить интервью

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

<div class="erquote">
<img src="http://www.bregan.erclans.ru/bregan/files/93a.gif" style="display: inline;" />&nbsp;<b>:</b>&nbsp;
Пока ты отдыхаешь задам тебе несколько вопросов, если ты не против…
</div>
<div class="erquote" style="background-color: #dedede;">
<img src="http://www.bregan.erclans.ru/bregan/files/98.gif" style="display: inline;" />&nbsp;<b>:</b>&nbsp;
Пока ты отдыхаешь задам тебе несколько вопросов, если ты не против…
С удовольствием отдохну, и отвечу на все тебя интересующие вопросы.
</div>

   Результат:

 : Пока ты отдыхаешь задам тебе несколько вопросов, если ты не против…
 : С удовольствием отдохну, и отвечу на все тебя интересующие вопросы.

Чтобы шрифт в цитатах не отличался от шрифта остального текста сайта меняем "erquote" на "erquoteint". Результат:

 : Пока ты отдыхаешь задам тебе несколько вопросов, если ты не против…
 : С удовольствием отдохну, и отвечу на все тебя интересующие вопросы.

   К списку вопросов

   11) Что следует знать и учитывать при подготовке иллюстраций для сайта

   Вот небольшой список правил:
   - понятно, что изображение должно подходить по смыслу к тексту. :) При этом старайтесь убирать с изображения ссылки и надписи об авторстве;
   - ширина изображения не должна превышать 500 пикселей, если на строке находится несколько изображений, то следите, чтобы их суммарная ширина не превышала данное число;
   - если на изображении присутствует в основном текст, таблицы, мелкие элементы графики, то его лучше всего сохранять в формат .gif;
   - при наличии большого количество разнообразной графики на изображении оно должно быть сохранено в .png либо .jpg, коэффициент качества изображения подбирайте самостоятельно, но учитывайте, что он не должен достигать слишком больших значений, когда картинка будет весить 200 и более Кб.

   К списку вопросов

   12) Как оформить ссылку

   Ссылка вставляется в текст с помощью

<a href="Ссылка">Текст ссылки</a>

   Результат:

   Чтобы ссылка открывалась в новой вкладке браузера немного изменим конструкцию выше:

<a href="Ссылка" target="_blank">Текст ссылки</a>

   Результат:

   К списку вопросов

   13) Как самому установить размер усеченной версии новости

   На новостной ленте материалы и заметки отображаются усеченными. По умолчанию текст отсекается на отметке 700 символов. Но этим можно управлять. Вставив в нужное место текста тэг "<!--break-->" , вы добьетесь того, что новость будет усечена именно до этого места.

   К списку вопросов