Страница 1 из 11
Модератор форума: Yuri_G 
Сообщество uCoz » Вебмастеру » Общие вопросы от вебмастеров » Как изменить размеры картинок в информере
Как изменить размеры картинок в информере
Falaut-BEST
Сообщений: 14
Репутация: 0

Сообщение # 1 | 13:44:36
Подскажите пожалуйста как изменить размеры картинок на главной странице каталог файлов, и как в информере изменить размер изображения.
Смотрите скриншоты

Добавлено (06 Янв 2017, 13:42:29)
---------------------------------------------
Вот вид материалов

<article class="short-story">
<div class="article-img"><img src="<?if($SCREEN_URL$)?>$SCREEN_URL$<?else?>$IMG_URL1$<?endif?>" alt="Постер к новости $TITLE$"></div>
<link href="https://fonts.googleapis.com/css?family=PT+Sans+Narrow" rel="stylesheet">
<?if($DATE$='Сегодня' or $DATE$='Вчера')?><div class="newgames ng-red"> Новинка </div><?endif?>
<?if($MODER_PANEL$)?><div style="float: right;">$MODER_PANEL$</div><?endif?>
<div class="short-left">
<h2><a href="$ENTRY_URL$">$TITLE$</a></h2>
<p>$MESSAGE$</p>
</div>

<div class="short-panel">
<ul class="news-info" style="margin-right: -10px;">
<li><i class="fa fa-user"></i>Автор: <a href="$PROFILE_URL$">$USERNAME$</a></li>
<li><i class="fa fa-comment"></i>Комментарии: <a href="$COMMENTS_URL$">$COMMENTS_NUM$</a></li>
<li><i class="fa fa-eye"></i>Просмотры: $READS$</li>
</ul>

<div class="right-panel">
<a class="news-like" href="javascript://" id="golike" onclick="$.get('/load/0-1-1-$ID$-3',function(data) {if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали Torrent материал!','Ошибка!',{w:270,h:60,t:8000}); else {_uWnd.alert('Вы успешно оценили!','Успешно!',{w:270,h:60,t:8000})};});"><i class="fa fa-thumbs-o-up"></i>Like</a>
<a href="$ENTRY_URL$" class="go-read" rel="nofollow">Далее<i class="fa fa-arrow-circle-o-right"></i></a>
</div>

</div>
</article>

Добавлено (06 Янв 2017, 13:44:36)
---------------------------------------------
А вот шаблон информера в правом контейнере

<div class="videoPromo-list-item ">
<div class="videoPromo-list-item-img">
<img itemprop="thumbnail" src="$IMG_URL1$">
<a href="$ENTRY_URL$"><i class="icoplay"></i></a>
</div>
<div class="videoPromo-list-item-text">
<div class="title">
<a style="font-size:11px;font-family:Arial;margin-bottom:3px"><a href="$ENTRY_URL$" title="Смотреть $TITLE$">$TITLE$</a></a>
</div>
</div>
</div>

Прикрепления: 6814704.jpg(122Kb) · 2100466.jpg(129Kb)
aleksandr_braun
Сообщений: 78
Репутация: 3

Сообщение # 2 | 02:31:48
Falaut-BEST, как вариант, указать самому в стилях вашей 3 строки
Код<img itemprop="thumbnail" src="$IMG_URL1$"> добавить параметры изображения

Код
style="width:ширина px;height:высота px;"
Falaut-BEST
Сообщений: 14
Репутация: 0

Сообщение # 3 | 13:58:10
вставил в css style="width:200 px;height:150 px;" ничего не изменилось как правильно вставить css и куда?
vova19061
Сообщений: 53
Репутация: 1

Сообщение # 4 | 14:22:21
Вот такой код для изменения картинок, вставлять в Вид материалов в нужное место <img src="$IMG_URL1$" width="155" height="140" border="0">$IMAGE1$</img>
Регулируешь параметры width="155" height="140"

Кому помог, не пожадничайте репы и подарка.
Falaut-BEST
Сообщений: 14
Репутация: 0

Сообщение # 5 | 20:00:30
подскажите а куда именно вставлять код в какую часть а то я ставлю а изображения непоказывается

<article class="short-story">
<div class="article-img"><img src="<?if($SCREEN_URL$)?>$SCREEN_URL$<?else?>$IMG_URL1$<?endif?>" alt="Постер к новости $TITLE$"></div>
<link href="https://fonts.googleapis.com/css?family=PT+Sans+Narrow" rel="stylesheet">
<?if($DATE$='Сегодня' or $DATE$='Вчера')?><div class="newgames ng-red"> Новинка </div><?endif?>
<?if($MODER_PANEL$)?><div style="float: right;">$MODER_PANEL$</div><?endif?>
<div class="short-left">
<h2><a href="$ENTRY_URL$">$TITLE$</a></h2>
<p>$MESSAGE$</p>
</div>

<div class="short-panel">
<ul class="news-info" style="margin-right: -10px;">
<li><i class="fa fa-user"></i>Автор: <a href="$PROFILE_URL$">$USERNAME$</a></li>
<li><i class="fa fa-comment"></i>Комментарии: <a href="$COMMENTS_URL$">$COMMENTS_NUM$</a></li>
<li><i class="fa fa-eye"></i>Просмотры: $READS$</li>
</ul>

<div class="right-panel">
<a class="news-like" href="javascript://" id="golike" onclick="$.get('/load/0-1-1-$ID$-3',function(data) {if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали Torrent материал!','Ошибка!',{w:270,h:60,t:8000}); else {_uWnd.alert('Вы успешно оценили!','Успешно!',{w:270,h:60,t:8000})};});"><i class="fa fa-thumbs-o-up"></i>Like</a>
<a href="$ENTRY_URL$" class="go-read" rel="nofollow">Далее<i class="fa fa-arrow-circle-o-right"></i></a>
</div>

</div>
</article>
Sonor
Сообщений: 236
Репутация: 503

Сообщение # 6 | 21:55:24
Для вида материалов у вас прописаны стили в styles.css (папка style):
Код
.article-img {
float: left;
background: #eee;
width: 150px;
text-align: center;
border: 1px solid #ECECEC;
padding: 5px;
margin: 0 10px 0 0;
}

.article-img img {
    width: 150px;
    height: 150px;
}

.short-left h2,
.short-left h1 {
border-bottom: 1px dotted #D3D3D3;
padding: 2px 0;
margin-left: 172px;

там и меняйте ширину (и height: 150px; лучше вообще удалить), например, так:
Код
.article-img {
float: left;
background: #eee;
width: 190px;
text-align: center;
border: 1px solid #ECECEC;
padding: 5px;
margin: 0 10px 0 0;
}
.article-img img {
width: 190px;
}
.short-left h2,
.short-left h1 {
border-bottom: 1px dotted #D3D3D3;
padding: 2px 0;
margin-left: 212px;

и это:
Код
.short-panel {
border-top: 1px dotted #D5D5D5;
margin-top: 5px;
padding-top: 11px;
}

можно изменить на:
Код
.short-panel {
border-top: 1px dotted #D5D5D5;
margin: 5px 0 0 212px;
padding-top: 11px;
}

и из системной CSS удалите style="width:500px;height:150px;"

Falaut-BEST
Сообщений: 14
Репутация: 0

Сообщение # 7 | 01:04:55
Sonor, извените а вы можете прописать в css нужный размер и скинуть сюда файл style а то у меня не получается
Sonor
Сообщений: 236
Репутация: 503

Сообщение # 8 | 02:43:08
Какие размеры считаются у вас нужными, неизвестно. В примере были увеличены ширина и отступы на 40px:
изменённый styles.css
оригинальный styles.css

Falaut-BEST
Сообщений: 14
Репутация: 0

Сообщение # 9 | 11:26:51
я очень благодарен вам за помощ вы просто АС в своем деле

Добавлено (08 Янв 2017, 11:26:51)
---------------------------------------------
скажите пожалуйста а как вот ето изменить до нужных размеров http://forum.ucoz.ru/_fr/888/2100466.jpg

Sonor
Сообщений: 236
Репутация: 503

Сообщение # 10 | 22:42:18
Во-первых, нужно исправить сам код информера.
Эту часть:
Код
<a style="font-size:11px;font-family:Arial;margin-bottom:3px"><a href="$ENTRY_URL$" title="Смотреть $TITLE$">$TITLE$</a></a>

измените на:
Код
<a style="font-size:11px;font-family:Arial;margin-bottom:3px;" href="$ENTRY_URL$" title="Смотреть $TITLE$">$TITLE$</a>

Далее, стили информера в системной CSS (управление дизайном - таблица стилей). Если нужны изображения в «полный рост», то можно так:
Код
.videoPromo-list-item {width:100%;max-width:235px;height:68px;line-height:69px;position:relative;display:inline-block;*zoom:1;*display:inline;overflow:hidden;margin-right:10px;margin-bottom:1px;vertical-align:top;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px}

изменить на:
Код
.videoPromo-list-item {overflow:hidden;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}

---
Код
.videoPromo-list-item-text {display:inline-block;*zoom:1;*display:inline;margin:5px 5px 5px 112px;vertical-align:middle;line-height:normal}

изменить на:
Код
.videoPromo-list-item-text {margin:5px 5px 5px 112px;}

---
Код
.videoPromo-list-item-img {width:100px;height:50px;position:absolute;top:5px;left:5px;overflow:hidden;font-size:0}

изменить на:
Код
.videoPromo-list-item-img {float:left;width:100px;padding:5px;}

Falaut-BEST
Сообщений: 14
Репутация: 0

Сообщение # 11 | 23:31:45
я дико извеняюсь а можно попроще а то не все понимаю, можно в 2 словах что в css а что в информер, вы можете сами сделать и скинуть файл, и ещо чтобы не в полный рост а чтобы всю картинку было выдно а не половину и размер тот самый.
Очень прошу помогите
Sonor
Сообщений: 236
Репутация: 503

Сообщение # 12 | 00:12:13
Информер

CSS
Изменено: css
Оригинал (управление дизайном - таблица стилей): css

Falaut-BEST
Сообщений: 14
Репутация: 0

Сообщение # 13 | 01:26:00
Ууура спасибо добрый человек очень помог hands

Добавлено (09 Янв 2017, 01:26:00)
---------------------------------------------
Можно ваши контакты Vk или что то другое

Сообщество uCoz » Вебмастеру » Общие вопросы от вебмастеров » Как изменить размеры картинок в информере
Страница 1 из 11
Поиск: