On-line: гостей 0. Всего: 0 [подробнее..]
АвторСообщение
moderator




Пост N: 1966
Откуда: Россия, Москва
ссылка на сообщение  Отправлено: 30.01.09 11:00. Заголовок: Инструкция по редактированию персональных галерей


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

Спасибо: 0 
ПрофильЦитата Ответить
Ответов - 7 [только новые]


moderator




Пост N: 1967
Откуда: Россия, Москва
ссылка на сообщение  Отправлено: 30.01.09 11:36. Заголовок: 1. Шаг первый – форм..


1. Шаг первый – формирование желания.
Если Вы желаете заняться редактированием Вашей персональной галереи, дополнить её новыми поступлениями, подписями к файлам, Вашими комментариями, ссылками на страницы описаний грибов и помочь тем самым нашему Администратору в его нелёгком труде над сайтом – получите по электронной почте архивный файл, который содержит файлы, необходимые для плодотворной работы по редактированию.
Запрос на получение такого архива будет означать Ваше желание помочь в работе над сайтом.

2. Шаг второй – создание модели сайта.
Распаковав архив, Вы найдёте на Вашем компьютере упрощённую модель сайта "ГКО".

Итак, мы имеем:
Каталог FUNGI (1-й уровень вложенности), в котором находятся:
• страницы описаний
• Каталог Informe (отчеты)
• Каталог Gifs (рисунки, иконки)
• Каталог Submitted (персональные галереи)

В свою очередь, каталог Submitted содержит каталоги – SAE, SAE2, FIO и, возможно, FIO2. Это каталоги второго уровня вложенности.
Примечание: обратите внимание – имя FIO – условное и совпадает с именем каталога Вашей персональной галереи.
Имя каталога (каталогов) Вашей галереи можно посмотреть здесь: http://mycoweb.narod.ru/fungi/Photographers.html

Каталог SAE содержит пример фотогалереи (фотографии, HTML-файл – SAE_Photos.html и файл сценария – SAE_Photos.js), который призван облегчить Вашу работу над своей собственной галереей.
В каталоге FIO находятся только HTML-файл и файл сценария Вашей персональной галереи (FIO_Photos.html, FIO_Photos.js).

Файлы каталогов SAE и FIO находится на третьем уровне вложенности.

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

3. Шаг третий – наполнение каталогов персональной галереи превью Ваших фото.
На странице сайта [url=http://mycoweb.narod.ru/fungi/Photographers.html ]http://mycoweb.narod.ru/fungi/Photographers.html [/url]найдите ссылку на Ваши фото на сайте и откройте её.
По этой ссылке открывается коллекция Ваших фотографий, находящихся на сайте на сегодняшний день.

На открывшейся странице Ваших фотографий щёлкните по превью правой кнопкой мыши и выберите "Сохранить рисунок как…". В открывшемся диалоговом окне укажите путь к каталогу Вашей галереи (FIO) и сохраните превью под предлагаемым именем.
Повторите эту операцию для каждого файла Вашей галереи.

4. Шаг четвёртый – запуск персональной галереи на локальном компьютере.
Зайдите в каталог FIO и откройте файл FIO_Photos.html.

В зависимости от настроек безопасности на Вашем компьютере браузер может ограничивать отображение активного содержимого (а к нему относится Ваша персональная галерея, точнее – файл сценария FIO_Photos.js).
Разрешите выполнение активного содержимого, и Вы увидите, как отображается Ваша персональная галерея на локальном компьютере. Для перемещения по галерее Вы можете использовать ссылки prev, next и ссылок с номерами страниц.
Обратите внимание, что при запуске галереи с локального компьютера не будут работать никакие другие ссылки.

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

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

Редактирование персональной галереи сводится к редактированию файла сценария FIO_Photos.js любым текстовым редактором. Например, блокнотом или MS Word.

5. Шаг пятый – как устроен файл сценария?
Прежде чем приступать к редактированию, нужно понять, как устроен файл сценария.
Откройте в текстовом редакторе, с которым Вам нравится работать, файл сценария SAE_Photos.js.

Файл сценария состоит из трёх частей, которые можно легко найти в маленьком тестовом файле сценария.

В первой части файла объявлен массив фотографий (переменная pics):
var pics =new Array(
"Tricholoma_sp_SAE_20060907_small.jpg",
"Tricholoma_sp_SAE_20060907_small.jpg",
"Amanita_muscaria_2_SAE_20051006_small.jpg",
"Amanita_muscaria_2_SAE_20051006_small.jpg",
"Amanita_muscaria_3_SAE_20050929_small.jpg",
"Amanita_muscaria_3_SAE_20050929_small.jpg",
"Amanita_phalloides_SAE_20050720_small.jpg",
"Amanita_phalloides_SAE_20050720_small.jpg"
);

Объявление массива фотографий должно иметь определённую структуру:
 элементы массива pics – имена фотографий, точно соответствуют именам файлов из каталога SAE и заключены в двойные кавычки;
 элементы массива разделены запятыми, естественно, что последний элемент массива "Amanita_phalloides_SAE_20050720_small.jpg" заканчивается закрывающей скобкой, которая для удобства работы перенесена на следующую строку.

Во второй части файла сценария заданы строковые константы. Это записи типа
var foto="<p class='mini'>Фото ";
var pm = "<p class=mini>"; // p mini
var sol="<br><a class=mini href='../../"; //sol - start of link
var tag="' target='_blank'>"; //open in the window
var poisk ="</a>&nbsp;&nbsp;<a href='../../PhotoBank.html?"; //call PhotoBank page with name of fungi after ? sign
var lupa ="' target='_blank' alt='Поиск изображений на сайте' title='Поиск изображений на сайте'><img src='../../Gifs/magnifier.gif' border='0' /></a>";
var book="&nbsp;&nbsp;<img src=../../Gifs/book.gif border=0></a> ";
var camera=" target='_blank'><img src=../Gifs/camera.gif border=0></a> ";


Эти константы призваны заменить многократно повторяющиеся элементы массива подписей и упростить работу над сценарием.

И, наконец, – объявление массива подписей (переменная myTitles):
var myTitles =new Array(
"<p class=mini>Иллюстрация к статье <br><a class=mini href=../../Informe/Photographing_of_mushroom_spores.html>Фотографирование спор…</a><br><font color=red>Уточнено: </font>Рядовка голубиная <br> <a class=mini href='../../Tricholoma_columbetta.html' target='_blank'> Tricholoma columbetta&nbsp;&nbsp;<img src=../../Gifs/book.gif border=0></a> <br> Особая благодарность всем, принявшим участие в идентификации гриба на форуме ",

Объявление массива подписей должно иметь структуру, подобную структуре массива фотографий:
 элементы массива myTitles заключены в двойные кавычки;
 элементы массива разделены запятыми, естественно, что последняя запись в массиве заканчивается закрывающей скобкой, которая для удобства работы перенесена на следующую строку;
 последнее и самое главное – количество элементов массива myTitles соответствует количеству элементов массива pics.

Если массив pics нам интуитивно понятен, то структуру элементов массива myTitles следует разобрать подробнее.

Например, для первого элемента массива красным цветом выделены фрагменты, которые Вам можно изменять:

"<p class=mini>Иллюстрация к статье <br><a class=mini href=../../Informe/Photographing_of_mushroom_spores.html>Фотографирование спор…</a><br><font color=red>Уточнено: </font>Рядовка голубиная <br> <a class=mini href='../../Tricholoma_columbetta.html' target='_blank'> Tricholoma columbetta&nbsp;&nbsp;<img src=../../Gifs/book.gif border=0></a> <br> Особая благодарность всем, принявшим участие в идентификации гриба на форуме",

И объяснение их смысла:
Informe/Photographing_of_mushroom_spores.html – ссылка на статью, отчёт, страницу конкурса;
Фотографирование спор… – название статьи, отчёта, страницы конкурса;
<br><font color=red>Уточнено: </font>Рядовка голубиная <br> – русское название вида, пояснительный текст, комментарии, уточнения;
<br> – переход на следующую строку (очень полезная штука для форматирования текста;
<font color=red>Уточнено: </font> – использование красного цвета шрифта для фрагмента текста "Уточнено:";
Tricholoma_columbetta.html – ссылка на страницу описания гриба;
Tricholoma columbetta – текст ссылки, отображаемый на экране (должен совпадать с именем ссылки на страницу описания, но с пробелом вместо знака "_");
&nbsp;&nbsp;<img src=../../Gifs/book.gif border=0></a> – вывод на экран иконки "книга"

А теперь тот же самый элемента массива, записанный с использованием строковых констант:
pm + "Иллюстрация к статье" + sol + "Informe/Photographing_of_mushroom_spores.html" + tag + "Фотографирование спор…</a><br><font color=red>Уточнено: </font>Рядовка голубиная" + sol + "Tricholoma_columbetta.html" + tag + "Tricholoma columbetta" + poisk + "Tricholoma_columbetta" + lupa + "<br> Особая благодарность всем, принявшим участие в идентификации гриба на форуме",

Не правда ли, стало намного проще и понятнее?

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

А вот добавить поиск (иконка "лупа" ) стало проще: достаточно после имени гриба написать комбинацию
+ poisk + "Fungi_name" + lupa
Здесь Fungi_name – латинское имя гриба со знаком "_" вместо пробела.

Внимание: все Ваши фрагменты текста должны быть ограничены двойными кавычками с двух сторон.
Примечание: если Вам необходимо использовать в подписях кавычки – Вы должны использовать ТОЛЬКО одинарные.

Откройте в браузере HTML-файл SAE_Photos.html, а файл сценария SAE_Photos.js – в текстовом редакторе.
Сопоставляйте увиденное на странице тестовой галереи с содержимым файла сценария. Анализируйте, делайте выводы.

6. Шаг шестой – каким текстовым редактором воспользоваться? MS Word vs Notepad?
Можно пользоваться такими простейшими текстовыми редакторами, как Блокнот или WordPad, можно использовать MS Word.

Мне больше нравится использовать MS Word, предварительно настроив параметры автозамены (меню "Сервис" – параметры автозамены – вкладки "Автоформат при вводе" и " Автоформат"). Нужно отменить замену "прямых" кавычек «парными» (снять "галочку" на двух вкладках).
Второе – MS Word автоматически добавляет пробелы слева и справа от вставляемого из буфера фрагмента текста. Лишние пробелы следует удалять при копировании ссылок, что, согласитесь, не совсем удобно.
Третья заморочка с MS Word состоит в том, что он не умеет автоматически открывать файлы сценария (с расширением .js).
Загрузите MS Word, выполните команду "Открыть" и выберите тип файлов – все файлы (*.*). Откройте файл сценария, внесите нужные изменения и сохраните. На запрос о возможной потере форматирования файла (а оно нам не нужно), отвечайте – Да.

При использовании Блокнота Вы будете застрахованы от ошибок, вызванных автозаменой (в простых редакторах её просто нет), но будете лишены возможности автоматизировать работу по правке однотипных элементов документа. Да при открывании и сохранении файла сценария не будет проблем.

Каким редактором пользоваться – решать Вам. Главное, не наделать ошибок в файле сценария при его редактировании.

7. Шаг седьмой – что следует изменить в персональной галерее?

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

Откройте в браузере HTML-файл FIO_Photos.html, а файл сценария FIO_Photos.js – в текстовом редакторе.
HTML-файл будем использовать для проверки правильности редактирования сценария, нажимая F5 (команда "обновить") после редактирования и сохранения изменений файла сценария.

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

Что касается добавления уточнённой информации – то это всецело Ваше творчество.

Как получить ссылку на страницу описания гриба?
Ищите на главной странице сайта (http://mycoweb.narod.ru/fungi/index.html) НОВЫЕ СТРАНИЦЫ (NEW PAGES). Проверяйте списки русских (http://mycoweb.narod.ru/fungi/Russian_list.html) и латинских (http://mycoweb.narod.ru/fungi/Latin_list.html) названий видов.
Зайдите на найденную страницу и откопируйте в буфер ссылку на страницу. Оттуда же можно откопировать русское название вида и какую-либо нужную Вам информацию.

Как получить ссылку на страницу конкурса, статью или отчёт?
Скорее всего, эта ссылка у Вас уже есть (в файле сценария). Если это не так, ищите их на главной странице сайта или в отчётах грибников (http://mycoweb.narod.ru/fungi/Informe/All_informes.html).

8. Шаг восьмой – добавление новых фотографий и подписей к ним – где взять информацию?
Можно, конечно, рекомендовать Вам искать полную коллекцию Ваших фотографий здесь http://mycoweb.narod.ru/fungi/Photographers.html, как в Шаге третьем.
Но, во-первых, они отсортированы в алфавитном порядке, во-вторых – не снабжены подписями.

Как быть?
Просмотреть ВСЕ страницы новых поступлений, начиная с главной страницы сайта, и заканчивая, возможно, архивом новостей.

Откройте, например, страницу новых поступлений за январь-февраль 2009 г. (http://mycoweb.narod.ru/fungi/Js/NEW_200901_Photos.html).
Не правда ли, очень похоже на Вашу персональную галерею?

Если теперь сохранить первую (или любую на выбор) страницу новых поступлений как "веб-страница полностью" (командой "сохранить как…"), на локальном компьютере можно будет обнаружить каталог и HTML-файл под одинаковыми именами. В нашем случае – это "Грибы Калужской области новые поступления на сайт за январь-февраль 2009 г".

Нас очень интересует файл сценария под именем NEW_200901_Photos.js. Он сохранён в каталоге "Грибы Калужской …".
Откройте его в текстовом редакторе и убедитесь, что он имеет точно такую же структуру, как файл сценария Вашей персональной галереи. Самое главное – файл сценария содержит подписи к фотографиям со ссылками на страницы описаний грибов.

Осталось сделать три очень простые вещи.
Первое – отыскать на сайте и сохранить на своём локальном компьютере все страницы новых поступлений, где размещены присланные Вами фотографии. Естественно, те, которые ещё не включены в Вашу персональную галерею.
Второе – грамотно откопировать элементы массива pics – имена фотографий, и элементы массива подписей – myTitles.
Третье – правильно отредактировать откопированные элементы.

9. Шаг девятый – добавление новых фотографий и подписей к ним – копирование.
Откройте в текстовом редакторе файл сценария новых поступлений, выделите и скопируйте в буфер элементы массива pics, описывающие имена Ваших фотографий и расположенные друг за другом. Признак, по которому Вы узнаете свои фото в описании массива – наличие в имени файла Вашей "визитной карточки" – FIO перед датой съёмки.

В открытом для редактирования файле сценария Вашей галереи установите курсор в конец последнего элемента массива pics (перед закрывающей список элементов скобкой) и добавьте запятую после кавычек.
Ведь Вы собираетесь добавить из буфера порцию элементов массива, и последний элемент массива перестанет быть последним.
Вставьте содержимое буфера обмена, начиная со следующей строки.
Проверьте последний элемент массива pics – перед закрывающей скобкой НЕ ДОЛЖНО быть запятой.

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

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

10. Шаг десятый – добавление новых фотографий и подписей к ним – редактирование.

Теперь можно редактировать добавленные фрагменты файла сценария.
Редактирование массива pics.
Чтобы вызвать из сценария фото, лежащее в том же каталоге FIO, где хранится файл сценария, т.е. на 3-м уровне вложенности, в ссылке не надо указывать переход на один уровень вверх (“../”). Достаточно просто написать, например, "Fungi_name_FIO_YYYYMMDD_small.jpg"

Если в галерее несколько каталогов FIO, FIO2, FIO3 и т.д. (а Вы к этому обязательно придёте, если будете активно сотрудничать с сайтом ГКО), ситуация несколько иная.
Если файл лежит в каталоге FIO2, то мы сначала должны выйти из родного каталога FIO на второй уровень (написать “../”), затем на этом 2-м уровне среди многих каталогов найти конкретный каталог FIO2, войти в него и там открыть это фото. Таким образом, правильная ссылка на фото будет выглядеть так: "../FIO2/Fungi_name_FIO_YYYYMMDD_small.jpg"

Редактирование массива myTitles.
Если элементы массива записаны с использованием строковых констант (например, poisk,lupa) дополнительной правки не требуется.
Если строковые константы не использованы (в страницах новых поступлений ранее декабря 2008 г) дополнительно придется дописывать переход на один уровень наверх (“../”) для ссылок. Это связано с иерархией каталогов на сайте.
Т.е. вместо “../” пишем везде “../../”. Иначе ссылки работать не будут.

Удалите из подписи Вашу фамилию – фото будут отображаться в галерее под общим заголовком с Вашей фамилией.

Остальные исправления – подписи к файлам, дополнительная и уточнённая информация, ссылки на статьи, отчёты, страницы конкурсов, ссылки на страницы описаний грибов – приветствуются.
Удалять или нет из Вашей галереи строки, управляющие выводом на экран иконки "книга" – (&nbsp;&nbsp;<img src=../../Gifs/book.gif border=0></a>) – решайте сами.

Повторите Шаг девятый и Шаг десятый для всех найденных Вами файлов сценария новых поступлений.

11. Шаг одиннадцатый – последняя проверка.
Проверьте – по окончании работы с галереей в ней должно быть столько же фотографий, сколько в коллекции Ваших фотографий, находящихся на сайте на сегодняшний день (http://mycoweb.narod.ru/fungi/Photographers.html).
Если в галерее фотографий больше, значит, Вы что-то потеряли – ищите недостающее.
Если, наоборот, в галерее фотографий меньше, чем на сайте на сегодняшний день – ищите дубли фотографий. Например, присланные на сайт в разное время под разными именами.

12. Шаг двенадцатый – самый последний – перестановка фотографий и подписей.
К этому пункту следует приступать, если у Вас всё получилось. Точнее, получается работать с галереей точно и без ошибок.

Смысл перестановок – поместить рядом в галерее фотографии, объединённые общим замыслом, но отправленные на сайт в разное время.
Например, фото грибов одного вида, сделанные в разное время.
При перестановке нужно чётко помнить о том, что элементу массива pics под номером № соответствует элемент массива myTitles под таким же номером № и переставлять их нужно синхронно в позиции под одинаковыми номерами.

13. Шаг тринадцатый – финальный – отправка на сайт.
Готовый файл сценария в архиве отправьте на почту Вячеславу.
После размещения на сайте проверьте правильность функционирования галереи – ссылок на фотографии, страницы и пр.

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

Успехов.



Спасибо: 0 
ПрофильЦитата Ответить
moderator




Пост N: 711
Откуда: Россия, Вятка
ссылка на сообщение  Отправлено: 30.01.09 13:11. Заголовок: SAE Все понятно все..


SAE Все понятно все разжевано! А желание заняться редактированием как выражать, в ЛС?

Грибы - они разные... один тебя покормит, другой - кино покажет...
Спасибо: 0 
ПрофильЦитата Ответить
администратор форума




Пост N: 1411
Откуда: Россия, Обнинск
ссылка на сообщение  Отправлено: 30.01.09 13:35. Заголовок: Grey Сергей, я Вам ..


Grey
Сергей, я Вам сейчас по элекронной поче отправлю мини-модель сайта с одним Вашим каталогом TSP

Письмо (порядка 1 Мега) улетело в 13:44 по Москве на Вашу почту на list.ru

Спасибо: 0 
ПрофильЦитата Ответить
moderator




Пост N: 714
Откуда: Россия, Вятка
ссылка на сообщение  Отправлено: 30.01.09 15:38. Заголовок: vstepanov Спасибо! П..


vstepanov Спасибо! Получил, все распаковалось!

Грибы - они разные... один тебя покормит, другой - кино покажет...
Спасибо: 0 
ПрофильЦитата Ответить
moderator




Пост N: 1968
Откуда: Россия, Москва
ссылка на сообщение  Отправлено: 30.01.09 21:31. Заголовок: Отправлены файлы гал..


Отправлены файлы галереи Елены и Сергея Лукашиных.
Получилось фото меньше, чем на сайте, но там (на сайте) есть повторы.
Это к Вячеславу.

Спасибо: 0 
ПрофильЦитата Ответить
moderator




Пост N: 1969
Откуда: Россия, Москва
ссылка на сообщение  Отправлено: 31.01.09 01:08. Заголовок: Отправлены Ирине нед..


Отправлены Ирине недостающие файлы.
Отстающие - подтягивайтесь!!!

Спасибо: 0 
ПрофильЦитата Ответить
moderator




Пост N: 1971
Откуда: Россия, Москва
ссылка на сообщение  Отправлено: 31.01.09 11:47. Заголовок: Получил сообщение от..


Получил сообщение от Grey с прекрасной идеей по поводу размещения новых поступлений на сайт.
Обсуждаем! Красным мои комментарии.

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


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

Ваши мнения?


Спасибо: 0 
ПрофильЦитата Ответить
Ответ:
1 2 3 4 5 6 7 8 9
видео с youtube.com картинка из интернета картинка с компьютера ссылка файл с компьютера русская клавиатура транслитератор  цитата  кавычки оффтопик свернутый текст

показывать это сообщение только модераторам
не делать ссылки активными
Имя, пароль:      зарегистрироваться    
Тему читают:
- участник сейчас на форуме
- участник вне форума
Все даты в формате GMT  3 час. Хитов сегодня: 82
Права: смайлы да, картинки да, шрифты нет, голосования нет
аватары да, автозамена ссылок вкл, премодерация вкл, правка нет