Итак, планировал разметку шаблона, очень хотелось попробовать размещение картинок слева, а текст справа. Это немного снизит размер и скорость загрузки страницы т.к. все картинки одного размера. Но столкнулся с небольшой проблемой – текст прилипал к размещенной картинке слева и ни в какую не хотел отступать от нее!
На статике я бы назначил для картинок класс в CSS наподобие:
<img src="url" class"imr"/>И в файл стилей CSS бы добавил:
.imr{margin-right:10px;}где imr – любое слово. Я просто сократил прямое назначение этого кода – image margin right
Можно конечно и присвоить id:
<div id="imr">
<img src="url"/>
</div>и в CSS добавить:
#imr img{margin-right:10px;}Но в таком случае, все картинки попадающие под него будут принимать отступ справа. Собственно это единственный выход для автоматизации на таких CMS как DLE
Полазив по сети, думая что все это настраивается в админке ничего толкового не нашел. И тут вспомнил что я знаю HTML и шаблон написан не на языке, придуманном создателями скрипта, а именно на HTML
Все что нужно было сделать, так это добавить одну строчку в файл стилей, отсюда подробнее:
Правим шаблон
Открываем файл shortstory.tpl в корне вашего шаблона и ищем вот этот код:
{short-story}Далее, игнорируя все что уже есть мы добавляем стиль вот такой строчкой:
<div id="sstory">{short-story}</div>Как бы абсурдно не выглядело то, что я предлагаю – оно поможет. Если вы разбираетесь в CSS, то просто допишите стиль отступа для картинок в свои стили формирования короткой новости.
Правим файл стилей
Открываем файл стилей, обычно это style.css в папке css в корне шаблона. Либо же ищите свой!
Находим там любое свободное место и добавляем небольшой кусочек кода:
#sstory img{margin-right:10px;}Все! Заменяете обновленный файл стилей и наслаждайтесь. Для понимания того что мы сделали в файле стилей советую вам почитать про язык CSS
А сделали мы вот что – мы сделали отдельный класс для короткой новости, но то, что мы добавили в файл стилей, ни как не повлияет на отображение уже существующего варианта оформления на вашем сайте.
Если расшифровать, то мы:
Заставили все картинки в короткой новости сделать отступ справа от себя на 10 пикселей
Я в принципе поддерживаю.
Хорошая новость!
А для полной как можно сделать?
Чтоб так же 10 пикселей отступ был?
Спасибо.
Так же само открыв файл fullstory.tpl
Спасибо, статья действительно очень помогла
Здравствуйте, автор этой статьи вы просто молодец, столько всего перерыл и нигде толком ответ на этот вопрос не нашел, но в этой статье так все подробно и легко что у меня получилось с первого раза спасибо!
Спасибо, старался. очень часто описыаю свои проблемы и они становятся полезными кому нибудь)