Хак для DLE - Короткі новини у вигляді - зменшена картинка та текст поруч

Навіщо потрібен такий хак?

Подивіться на сайти новин, практично у всіх коротка новина виводиться так:

Зображення вгорі і знизу тексту.

І це не просто, якщо скажемо картинку поставити з боку, то можливі 2 проблеми (залежно від шаблонів):

1. Текст буде все одно не з верху з боку, а починатися з низу після картинки.

2. Текст буде як треба з боку з самого верху, але якщо його мало, низ рамки буде підніматися відразу до тексту, а сама картинка вийде з рамки.

Ось ці дві проблеми ми і вирішимо в цій статті.

Як зробити маленьку картинку з боку в короткій новині в DLE?

Для цього звичайно потрібно буде правити ваш шаблон, який можна змінити з адмінки або скачав-закачав по фтп на сервер ваші потрібні файли.

Так, для виведення короткої новини використовується файл шаблонуshortstory.tpl

У ньому знаходимо код, що відповідає за виведення новини:

У вашому шаблоні замістьmaincont може бути написаний інший клас, але кодбуде точно, по ньому і орієнтуємося.

Далі змінюємо назву класуmaincont (у вас може бути інше) дописавши до нього _short, тобто. буде виглядати так maincont_short і всередину коду між

вписуємо цей код

приводимо до вигляду

У результаті має вийти таке

У цьому коді ми поки що зробили висновок маленької картинки.

Весь код пояснювати не буду, скажу тільки що назву класу ми поміняли для того, щоб наші зміни не поширювалися і на повну новину, а в кодіw можна вказувати розмір картинок, що виводяться.

Як зробити що б картинку з боку оптикав текст у DLE?

Відкриваємо файл, знаходимотам наш старий стильmaincont

У мене це рядок

Він якраз вказує інформацію про картинку (про це говорить слово img)

У ньому нічого міняти не будемо, адже він ще використовується і в повній новині.

Копіюємо весь рядок і вписуємо відразу нижче під цим і вже в копії робимо зміни (міняємо назву на нове наше і додаємо кілька рядків), має вийти так:

З назвою все зрозуміло, а в кінці ми дописали, що картинка буде розташовуватися зліва, а текст від картинки в 10 пікселях з права.

Як зробити щоб при виведенні короткої новини з великою картинкою і маленьким текстом, картинка не вилазила б за краї в DLE?

Це робиться дуже просто, дивіться попередню нашу редагуванняstyle.css

Ще трохи нижче дописуємо

.maincont_short - це наш новий клас, якщо у вас він інший, не забудьте вказати свій.

height: 210px; - це висота рамки де розміщується коротка новина (має бути трохи більше висоти картинки вказаної в шаблоні (див. текст вище)

overflow: hidden; - ховаємо весь зайвий текст

Ось і все, справа зроблена, шаблон став не схожим на інші.

---