Всем привет!!
Кто еще не заметил, прошу зайти ко мне в гости в студию лепки.
А пока я делала новый дизайн сайту, мне захотелось добавить флэш галерею с обучением. Что бы нажав на картинку, можно было перейти на страницу обучения.
Сначала пыталась разобраться с галереей, который предлагает Blogger, но это не то, что мне было нужно. Не стала я детально разбираться и пошла в просторы интернета искать нужную мне галерею.
Что я искала от галереи:
- Добавлять фотографии, какие я хочу
- Возможность добавления ссылки для перехода на др страницу
- Красивый, стильный внешний вид
- Возможность добавления в Blogger
1. Для начала тебе понадобится скачать программу Aneesoft 3d flash gallery.
C помощью этой программы ты и создашь свою галерею. Программа очень простая и не требует специальных навыков программирования.
2. Открываем скаченную программу и сразу можно добавлять фотографии.
Нажимай на кнопку Add Photo и выделяй нужные файлы, можно выделить сразу несколько.
3. Теперь можно немного корректировать фотографии, удалять их и добавлять ссылки.
Для того что бы добавить ссылку, выделите фотографию и нажмите на кнопку Add Caption.
Тебе предлагается придумать название фотографии, можно написать описание, добавить ссылку, выбрать будет ли открываться ссылка в том же окне или новом, а если поставите галочку на Apply this URL to all photos, то данная ссылка распространится на все фотографии, которые вы залили.
В этой вкладке больше ничего не сделаешь. Переходим ко второму шагу, самому прикольному.
4. Балуемся, выбираем внешний вид нашей галереи.
Тебе предлагается аж три тематики:
Cool - в переводе "Прикольная" ☺
3D Shape - "Объемные формы"
3D Wall - "Объемные стены"
Выбираешь, понравившийся внешний вид и теперь можно немного его доработать, через настройки - Settings.
На этой же страничке программа показывает предпросмотр твоей галереи. Вот как ты ее видишь, так она и будет выглядеть. Т.е. все изъяны фона, которые ты видишь, надо убирать.
Можно залить обои, замостить ими фон нельзя.
Достаточно сложно подобрать размер обоев так, что бы они заполнили собой все пространство. На фото ниже, видно, что пространство заполнено не все, виден красный фон по бокам.
Для этого выберете более или менее подходящий цвет в Background color. Иначе никак.
Я выбрала светло серый, через Custom...
Получилось лучше:
Напоследок можно добавить музыки. Я этого не делала.
Тут всё, переходим к заключительной части - публикации.
5. Тут пришлось попотеть.
Я буду рассказывать только про то, как вставить нашу галерею в Blogger.
Сначала можно нажать play и посмотреть что у нас получилось.
Если все устраивает, то жмем слева на кнопку SWF - это значит, что ваш файл сохранится как флэш файл, с расширением *.swf
Теперь этот файл нужно сохранить на сервере в интернете так, что бы ты могла получить ссылку на данный файл обязательно в конце с названием файла. Например:
http://lana-rabota.narod2.ru/005.swf - это правильная ссылка ( в конце я вижу название своего файла 005.swf)
https://docs.google.com/leaf?id=0BzOJ0mDAeeqINmEzZTZjOGUtYTRkNy00ZDIyLThmYjItZDAxNTkzYTUxYzdk&hl=en_US - это неправильная ссылка, такой абракадабры быть не должно и нигде не вижу название своего файла 005.swf
Если ты знаешь что такое FTP, то заливай свой файл туда, должно сработать.
Если для тебя FTP просто набор букв, то я предлагаю тебе следующий вариант, но не единственный, но им воспользовалась я. Делюсь.
Тебе нужен аккаунт в почте яндекса.
Зайти в него, как если бы проверяла почту.
Сверху нажми на ссылку Народ. Ты попадешь вот на такую страничку.
Слева надо завести свой сайт, придумать ему имя, что бы можно было его редактировать. Яндекс предлагает бесплатный сервер, который как раз нам нужен.
После того как ты зарегистрировала сайт, надо нажать на кнопку Редактировать как на фото ниже.
6. Теперь нам надо добавить наш заветный файл.
Слева вверху выбираем "Управление файлами" как показано на фото ниже
Далее жмешь на кнопку Загрузить файл и выбираешь сохраненную галерею в формате *.swf
Файл появится в окне. Нажми на файл и выбери "Открыть".
Галерея откроется в новом окне. Не бойся размеров, она откроется во всю страницу, это можно будет отредактироать. Сейчас главное скопировать адрес, из адресной строки.
7. Заключительная часть. Нам остается добавить галерею в Blogger.
Галерея добавляется через html код.
Давай подготовим его.
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="800" height="450">
<param name="allowFullScreen" value="True" />
<param name="movie" value="Yourfilename.swf" />
<param name="quality" value="high" />
<embed src="Yourfilename.swf" quality="high" allowFullScreen="true"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="800" height="450">
</object>
Выше я отделила образец кода.
Красным места, которые надо заменить.
Yourfilename.swf меняешь на скопированную адресную строку.
Например: http://lana-rabota.narod2.ru/005.swf
циферки меняешь, подгоняешь. поставь например
width=300
height=200
И так у тебя есть html код.
Его можно вставить непосредственно в html страницы или добавить отдельным гаджетом HTML/JavaScript через функцию Дизайна.
И получится у вас красивая галерея, как у меня на сайте lana-studio.ru
Надеюсь моя статья вам пригодилась.
Если захотите ею поделиться с друзьями не забудьте сослаться на мой блог ♥
Кто еще не заметил, прошу зайти ко мне в гости в студию лепки.
Мы переоделись! ☺
А пока я делала новый дизайн сайту, мне захотелось добавить флэш галерею с обучением. Что бы нажав на картинку, можно было перейти на страницу обучения.
Сначала пыталась разобраться с галереей, который предлагает Blogger, но это не то, что мне было нужно. Не стала я детально разбираться и пошла в просторы интернета искать нужную мне галерею.
Что я искала от галереи:
- Добавлять фотографии, какие я хочу
- Возможность добавления ссылки для перехода на др страницу
- Красивый, стильный внешний вид
- Возможность добавления в Blogger
ПРИСТУПИМ
1. Для начала тебе понадобится скачать программу Aneesoft 3d flash gallery.
C помощью этой программы ты и создашь свою галерею. Программа очень простая и не требует специальных навыков программирования.
2. Открываем скаченную программу и сразу можно добавлять фотографии.
☀ Совет: Используйте фотографии квадратной или прямоугольной формы. Прозрачный слой, сделанный в фотошопе не сохранится прозрачным в данной программе.
Нажимай на кнопку Add Photo и выделяй нужные файлы, можно выделить сразу несколько.
 |
| Увеличивается, при нажатии на фото |
3. Теперь можно немного корректировать фотографии, удалять их и добавлять ссылки.
Для того что бы добавить ссылку, выделите фотографию и нажмите на кнопку Add Caption.
Тебе предлагается придумать название фотографии, можно написать описание, добавить ссылку, выбрать будет ли открываться ссылка в том же окне или новом, а если поставите галочку на Apply this URL to all photos, то данная ссылка распространится на все фотографии, которые вы залили.
 |
| Увеличивается, при нажатии на фото |
☀ Совет: При добавлении ссылки, обязательно надо написать заголовок (Title).
В этой вкладке больше ничего не сделаешь. Переходим ко второму шагу, самому прикольному.
4. Балуемся, выбираем внешний вид нашей галереи.
Тебе предлагается аж три тематики:
Cool - в переводе "Прикольная" ☺
3D Shape - "Объемные формы"
3D Wall - "Объемные стены"
Выбираешь, понравившийся внешний вид и теперь можно немного его доработать, через настройки - Settings.
На этой же страничке программа показывает предпросмотр твоей галереи. Вот как ты ее видишь, так она и будет выглядеть. Т.е. все изъяны фона, которые ты видишь, надо убирать.
Можно залить обои, замостить ими фон нельзя.
Достаточно сложно подобрать размер обоев так, что бы они заполнили собой все пространство. На фото ниже, видно, что пространство заполнено не все, виден красный фон по бокам.
 |
| Увеличивается, при нажатии на фото |
Для этого выберете более или менее подходящий цвет в Background color. Иначе никак.
Я выбрала светло серый, через Custom...
Получилось лучше:
 |
| Увеличивается, при нажатии на фото |
Напоследок можно добавить музыки. Я этого не делала.
Тут всё, переходим к заключительной части - публикации.
5. Тут пришлось попотеть.
Я буду рассказывать только про то, как вставить нашу галерею в Blogger.
Сначала можно нажать play и посмотреть что у нас получилось.
Если все устраивает, то жмем слева на кнопку SWF - это значит, что ваш файл сохранится как флэш файл, с расширением *.swf
Теперь этот файл нужно сохранить на сервере в интернете так, что бы ты могла получить ссылку на данный файл обязательно в конце с названием файла. Например:
http://lana-rabota.narod2.ru/005.swf - это правильная ссылка ( в конце я вижу название своего файла 005.swf)
https://docs.google.com/leaf?id=0BzOJ0mDAeeqINmEzZTZjOGUtYTRkNy00ZDIyLThmYjItZDAxNTkzYTUxYzdk&hl=en_US - это неправильная ссылка, такой абракадабры быть не должно и нигде не вижу название своего файла 005.swf
Если ты знаешь что такое FTP, то заливай свой файл туда, должно сработать.
Если для тебя FTP просто набор букв, то я предлагаю тебе следующий вариант, но не единственный, но им воспользовалась я. Делюсь.
Тебе нужен аккаунт в почте яндекса.
Зайти в него, как если бы проверяла почту.
Сверху нажми на ссылку Народ. Ты попадешь вот на такую страничку.
Слева надо завести свой сайт, придумать ему имя, что бы можно было его редактировать. Яндекс предлагает бесплатный сервер, который как раз нам нужен.
После того как ты зарегистрировала сайт, надо нажать на кнопку Редактировать как на фото ниже.
6. Теперь нам надо добавить наш заветный файл.
Слева вверху выбираем "Управление файлами" как показано на фото ниже
Далее жмешь на кнопку Загрузить файл и выбираешь сохраненную галерею в формате *.swf
Файл появится в окне. Нажми на файл и выбери "Открыть".
Галерея откроется в новом окне. Не бойся размеров, она откроется во всю страницу, это можно будет отредактироать. Сейчас главное скопировать адрес, из адресной строки.
7. Заключительная часть. Нам остается добавить галерею в Blogger.
Галерея добавляется через html код.
Давай подготовим его.
-------------------------------------------------------------------------------
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="800" height="450">
<param name="allowFullScreen" value="True" />
<param name="movie" value="Yourfilename.swf" />
<param name="quality" value="high" />
<embed src="Yourfilename.swf" quality="high" allowFullScreen="true"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="800" height="450">
</object>
-----------------------------------------------------------------------------------
Выше я отделила образец кода.
Красным места, которые надо заменить.
Yourfilename.swf меняешь на скопированную адресную строку.
Например: http://lana-rabota.narod2.ru/005.swf
циферки меняешь, подгоняешь. поставь например
width=300
height=200
☀ Совет: Обрати внимание, что при выборе размера width и height можно полностью убрать цвет фона, который нам мешал изначально (я про него писала в п.4)
И так у тебя есть html код.
Его можно вставить непосредственно в html страницы или добавить отдельным гаджетом HTML/JavaScript через функцию Дизайна.
И получится у вас красивая галерея, как у меня на сайте lana-studio.ru
Надеюсь моя статья вам пригодилась.
Если захотите ею поделиться с друзьями не забудьте сослаться на мой блог ♥
боже мой...как ты с этим разобралась )))))) для меня это очень сложно даже по твоему мк)))))
ОтветитьУдалитья всегда любила компьютеры и мне как то дано в них разбираться )))
Удалитьна самом деле все просто, там главное скачать программу =)
если надумаешь делать, пиши, я помогу
Спасибо за интересную информацию! Надо поразбираться - пока не очень понимаю, надо ли оно мне;-)
ОтветитьУдалитьКлассно, но мне самой все равно в этом не разобраться! Надо звать мужа на подмогу ))) Спасибо за МК!!!
ОтветитьУдалитьЛанусь,ты как всегда с полезными советами!!!спасибо!!!беру на заметку :)
ОтветитьУдалитьОооо! Ланусь, мне пригодится, я люблю такие штуки! =) Пасибо!
ОтветитьУдалитьСпасибо огромное!!!! Долгое время пыталась сделать, но никак не получалось. А прочитав твою статью, я быстро всё сделала))) Еще раз огромное преогромное спасибо!!!!! :)
ОтветитьУдалить