Вы не зарегистрированы

Авторизация



Для любознательных - как сделано оформление?

Фото пользователя Елена Александровна Пономарева
Submitted by Елена Александровна Пономарева on чт, 05/07/2012 - 20:33

У пользователей сайта, которые создают сообщества, иногда возникает вопрос: как сделать заголовки разделов более творческими? По умолчанию, вводя в поле заголовка название, мы получаем голубенькие буквы определенного размера и шрифта. А хочется креатива! Что ж, пожалуйста!

Сразу скажу, что создавала лишь сообщества-конструкторы. Не знаю, работает ли это в шаблоне. Специалисты говорят, что "да". Но не знаю, не пробовала.

Суть в том, что "Поле заголовка поддерживает html-тэги, поэтому в нем может размещаться, например, изображение, веб-ссылка и т.д. Максимальная длина поля - 255 знаков". (Пункт 15.1 инструкции)

Итак, мы создали сообщество-конструктор. Настраиваем контент.

Шаг 1. Придумываем творческие заголовки для наших разделов. 

В принципе, это может быть и текст, с собственным цветом, шрифтом. 

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

 

   Или так     

Оба приведенных варианта для раздела "Наши опросы" созданы с помощью PowerPoint.

Алгоритм одинаковый.

а) взяли картинку/фотографию

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

 

в) Выделили фото и надпись левой кнопкой мыши, выбрали во вкладке "Упорядочить": "Группировать". При этом оба объекта стали единым целым.

г) Сохранили полученный объект как рисунок. (Правая кнопка мыши: "сохранить как рисунок").

 

Шаг 2. Загружаем рисунок на сайт. Получаем HTML-код.

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

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

Далее используем опцию в браузере - показать HTML-код.

Если Вы работаете в Google Chrome, то жмем правой кнопкой мыши на рисунке, выбираем "Просмотр кода элемента". А дальше копируем открывшийся код.

 

 

Теперь у нас в буфере обмена содержится HTML-код картинки.

Для первого заголовка, например, он выглядит так: 

<img alt="" src="/sites/default/files/ckeditor/271040/images/006.jpg" style="width: 324px; height: 220px" />

Далее картинка на странице нам не нужна, после окончания работы ее можно смело удалить. Причем на сайте, в папке с Вашими картинками, она останется.

Если Вы работаете в Internet Explorer, это менее удобно, поскольку в этом браузере открывается код не отдельного элемента, а целой страницы. Если Вы не знакомы в языком HTML, то увидеть его сразу сложно.

 

 

Шаг 3. Настраиваем контент в сообществе. 

В раскрывающемся списке "Выберите действие" выбираем "Настройка отображаемого контента"

 

 

 

Если раздел новый, жмем "просмотры" и сначала выбираем тип контента:

 

 

Если редактируем уже созданный сразу открывается такая вкладка:

 

 

 

Все! Творческого Вам настроения!

 

 


»  Размещено в сообществах:   
Любимой гимназии посвящается