• ↓
  • ↑
  • ⇑
 
Записи пользователя: Тайя, которая душит романтиков (список заголовков)
19:58 

Обрезка картинок c помощью html

Тайя, которая душит романтиков
Не говорите так быстро, я не успеваю класть х*р на ваши слова.
Шерстила тут интернеты на предмет обрезки картинок средствами html, может кому пригодится.



Итак, вот наша картинка, размером 400х400 пикселей, украшенная некрасивой надписью внизу (все примеры кликабельны). Чтобы ее убрать, потребуется следующий код:

,
где width - желаемая ширина, height - желаемая высота.

На глазок отсекаю 40px, получается:

(Поскольку убирала только по высоте, ширину не вписывала).

Результат:

Обрезать по ширине и высоте :



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

@темы: Теги оформления записи, Добавление изображений

20:18 

Просто убрать prosto

Тайя, которая душит романтиков
Не говорите так быстро, я не успеваю класть х*р на ваши слова.
Как вы все уже знаете, Prostopleer.com приказал нам долго жить, и плееры теперь живут на Pleer.com. Но не все так трагично, плееры в постах можно восстановить, достаточно в коде плеера заменить "prostopleer" на просто "pleer" пересохранить пост и плееры появятся.

До изменений


После изменений

Если плееров в посте много, автозамена ворда вам в помощь, копируете код поста, заменяете prosto на ничто, вставляете обратно в пост, занимает одну минуту))

И еще такой момент. Если вы уменьшали высоту плеера, чтобы треки не расползались, исправьте height="XXpx;" (ваше значение) на height="42px;", так как плеер подрос и со старым значением может выглядеть обрезанным .




Важный апдейт: чтобы не видеть рекламу в плеере, сразу при вставке в двух местах height="124" замените на height="42"!

Заодно о Вебораме. Если у кого-то пропали плееры с weborama.ru, замените везде в коде weborama.ru на weborama.fm и они вновь запоют.

@темы: Вставка музыки

17:10 

Оплата дайри через киви-кошелек

Тайя, которая душит романтиков
Не говорите так быстро, я не успеваю класть х*р на ваши слова.
Робокасса изменила привычный интерфейс, и в списке кошельков теперь отсутствует QIWI-кошелек. Для того, чтобы отплатить через киви, нужно выбрать другой способ оплаты -> Терминалом, затем кликнуть на значок QIWI и оплатить как обычно (через терминал или сайт qiwi.ru).


@темы: Оплата дневников

17:14 

Обтекаемые картинки

Не говорите так быстро, я не успеваю класть х*р на ваши слова.
Картинка с обтекающим ее текстом.
Картинка слева: <img src="адрес картинки" style="float: left; margin-right: 10px;"> Текст текст текст...
Картинка справа: <img src="адрес картинки" style="float: right; margin-left: 10px;"> Текст текст текст...
Margin - это отступ текста от края картинки, размер задается по вкусу.

Обтекаемые превьюшки.
Делаете превью любым доступным вам способом (про вставку превью рассказывается здесь, здесь, здесь и здесь) и затем к ссылке добавляете style="float: left; margin-right: 10px;" либо style="float: right; margin-left: 10px;".

<a href="адрес картинки"><img src="адрес картинки" width=XX style="float: left; margin-right: 10px;"></a>

Если картинка из БИ: <a href="картинка"><img src="превью" style="float: left; margin-right: 10px;"></a>

Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

[MORE=<img src="адрес картинки" width=XX style="float: right; margin-left: 10px;">]<img src="адрес картинки" style="float: right; margin-left: 10px;">[/MORE]

Из БИ: [MORE=<img src="превью" style="float: right; margin-left: 10px;">]<img src="картинка" style="float: right; margin-left: 10px;">[/MORE]

Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст тексттекст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

@темы: Теги оформления записи, Добавление изображений

17:07 

Как сделать превью картинки, размещенной в чужой библиотеке изображений

Тайя, которая душит романтиков
Не говорите так быстро, я не успеваю класть х*р на ваши слова.
Например, вы хотите разместить у себя картинку, которую кто-то уже залил к себе, или делаете перепост, но в исходном посте картинка слишком большая. В таком случае можно легко и быстро сделать превью. Чтобы понять, где размещена картинка, щелкните правой кнопкой мыши - открыть в новом окне. Картинки, залитые на дайры, имеют адрес вида http://static.diary.ru/userdir/.... Ссылка на полную картинку выглядит так: static.diary.ru/userdir/1/4/3/9/1439841/5516786.... Перед последними цифрами добавляем thumb/ и получаем превьюшку: static.diary.ru/userdir/1/4/3/9/1439841/thumb/5...

Легкий способ вставить превью
Результат:

@темы: Теги оформления записи, Добавление изображений

20:18 

Просмотр дневников в другом дизайне для Mozilla Firefox и Google Chrome

Не говорите так быстро, я не успеваю класть х*р на ваши слова.
В Мозилле и Хроме имеется возможность загрузить внешний стиль и просматривать дневники в нем (на случай, если вы не любите красные буквы на черном фоне). При включении данного стиля фон становится белым, а шрифт - черным.


Для Мозиллы.
Идем сюда и устанавливаем Stylish. В нижнем правом углу появится изображение буквы S. Заходим на дайри, жмем на S правой кнопкой мыши - Найти стили для текущего сайта. Браузер перенаправит на страницу со стилями для Diary.ru, выбираем "Diary.ru - Simple Design" - жмем Install with Stylish - Сохранить. Стиль появится в списке. Управлять стилем просто: правой кнопкой на S и ставите/снимаете галку с названия стиля, либо Вид - Стиль страницы.

По желанию, стиль можно доработать напильничком. Правой кнопкой щелкаем название стиля - Правка, начинаем подгонять стиль под себя.

font-family:Times New Roman - шрифт. Любители гладких шрифтов могут поставить Tahoma или Arial, например.
font-style: normal - стиль шрифта, нормальный. Чтобы поставить курсив, нужно заменить normal на italic.
font-size: 15px - размер шрифта. Можно уменьшить или увеличить.
font-weight: normal - ширина шрифта. Чтобы установить полужирный, меняем normal на bold.
background-color:#FFFFFF - цвет фона, по умолчанию белый. Можно поменять на тот, который нравится вам. Код цвета можно выяснить в фотошопе или тут.
color:#000000 - цвет шрифта, черный. Можно поменять на тот, который вам по вкусу.
a, .linkssection .postLinks a{color:#793939 !important;} - цвет ссылок, также можно изменить.

Если у кого-то из ваших избранных нечитабельный дизайн, можно сделать стиль конкретно для его странички. Правой кнопкой - Создать новый стиль - Для текущего URL. Вводим название стиля, теперь опять идем на страничку со стилями, жмем Show code, копируем все, что между верхней и нижней фигурной скобкой (начиная с body {...}) и вставляем в свой стиль. Правда, если зайти в комментарии, то URL изменится, и дизайн будет авторский.

Дневники с CSS полностью не будут преобразовываться, ввиду того, что код там сложнее.

Для Хрома Stylish можно скачать здесь. Затем идите на userstyles.org/styles/browse/all/http:%2F%2Fwww.... Отредактировать диз можно следующим образом: Инструменты - Расширения - Настройки - Edit - стиль открывается для редактирования.

@темы: Оформление дневника

@Дневники: секреты, тонкости и хитрости

главная