>Меняем дизайн ЖЖ.Текстовый урок со скр

Пятница, 13 Ноября 2015 г. 07:34 + в цитатник

Цитата сообщения jzayka

Прочитать целиком В свой цитатник или сообщество!

Меняем дизайн ЖЖ.Текстовый урок со скриншотами.

Меня попросили помочь с оформлением дизайна ЖЖ.
В прошлом году делала, теперь , как оказалось, все позабыла.
Начала вспоминать.

На Ютубе попался на глаза видеоурок,который выложила отдельным ПОСТОМ.
Спасибо автору урока,все восстановилось в памяти после просмотра.
И у меня потянулась рука написать текстовый урок со скриншотами.

Итак,делаем(меняем) дизайн ЖЖ ..
Для этого будем использовать Генератор дизайнов,который открываем по этой ссылке
http://lj.yoksel.ru/
и Инструкцию "Как установить дизайн?" ,
http://lj.yoksel.ru/how_install.php
в которую будем периодически подглядывать.
Я открыла в браузере ..не закрываю.. )))

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

Идем по ссылке на главную страницу LIVEJOURNAL
http://www.livejournal.com/

Входим в свой аккаунт

открылась главная страница журнала

С правой стороны рядом с ником жмем на
треугольничек и в выпавышем списке выбираем "Настройки"

Нас перекинуло на страницу Настройки просмотра.

Открылась страница-Жмем-Выбор фона.
Пишем в окошко Unstyled и жмем-Найти

Открылось окно с возможным количеством вариантов.
Оно может быть разным.Мне предложено 6..у вас может быть 3,4,5..
Но рабочий только один Expressive
Почему?,.. ответ можно почитать в инструкции...(ссылка в начале урока)

Находим вариант Expressive . Жмем -Применить дизайн.

Прокручиваем страничку вниз до Выбора макета.
Выбираем из двух,которые выделены на скрине..
Почему именно из этих двух?.. тоже можно почитать в инструкции.

Поднимаемся вверх на этой же страничке.
И справа жмем-Настройте свой стиль.

Перешли на страницу Настроить стиль журнала
Слева находим строку Custom CSS-Жмем на нее

На открывшейся страничке прокрутим немножко вниз и видим такое окно.Посмотрели.
!!!Не закрываем!!!

================
Открываем Генератор дизайнов У меня открыта вкладка в браузере.
Или переходим по ссылке
http://lj.yoksel.ru/

Смотрим и выбираем понравившийся дизайн.
Я покажу на примере 043
Жмем на него, окрылось окно с шаблоном дизайна,в котором будем менять составляющие

Выбираем вкладку Фоны.
Посмотрите скрин,пройдитесь по вкладкам..)))
По умолчанию-цвет черный.

Рассмотрим вариант фона с картинкой.
Для этого используем адрес картинки в таком виде
http://fotki.yandex.ru/get/6733/132542321.1/0_1065e8_f8f88d29_L.jpg

Есть вариант выбора .Нажмите на Выбрать картинку,вы увидите много разных пестрых фонов.
Не будем на этом останавливаться..Будем использовать свою.

1.Итак,меняем фон..У меня приготовлена картинка.Копируем адрес,вставляем в окошко.
Вот ее адрес
//img-fotki.yandex.ru/get/6839/132542321.1/0_1065d4_518a8b10_orig.jpg
Фон поменялся на картинку,адрес которой я вставила в окошко.

2.Поменяем цвет фона ленты-по умолчанию белый
Жмем левой кнопкой мыши по окошку,откроется генератор цветов.
Выбираем цвет,жмем ОК.

3.Для цвета фона рамок я использовала картинку(можно просто выбрать цвет),вставила вместо того,что по умолчанию, ее адрес
//img-fotki.yandex.ru/get/6733/132542321.1/0_1065e8_f8f88d29_L.jpg

4.Вкладка-Ширина
Поэксперментируйте.Я поменяла только толщину рамки

5.Вкладка Шрифты.Все оставила по умолчанию..Вы можете экспрементировать )))
Поиграйте со значениями,выбором шрифта..)))

====================
Теперь приступаем к самому основному,..установке дизайна..)))
Жмем на окошко- Получить код..

..вот наш код

Жмем правой кнопкой мыши -Выделить все-Копировать..
Идем в эту вкладку,мы ее открыли раньше.У меня она открыта.

Выделить все,очистить и вставить код,который мы скопировали

Жмем -Сохранить изменения.Обязательное условие!!!

переходим на главную страничку своего журнала

смотрим результат

Вот таким образом можно изменять дизайн.

Если возникнут вопросы,пишите в комментариях

Серия сообщений "**ЖЖ-дизайн":

Часть 1 - Пробный дизайн для ЖЖ "Желтая роза"
Часть 2 - Дизайн для ЖЖ -2 ШТ
Часть 3 - Как изменить дизайн в ЖЖ.Видеоурок
Часть 4 - как создать блог Живой Журнал(ЖЖ)
Часть 5 - Меняем дизайн ЖЖ.Текстовый урок со скриншотами.