Question

Графа изображения! загружаешь изображение например форматом 400 на 526 - оно не выводит вообще. А тупо ломаная картинка типа. Загружаешь изображение размером 800 на 1138 выводится нормально. Если пробуешь 700 на 1120 - тоже не выводит. В чем может быть причина?

вывод такой:

<a href="$IMG_URL1$" class="zoom ulightbox"><img src="$IMG_SMALL_URL1$" alt="$ENTRY_TITLE$"/></a>

это для первого изображения

для последующих:

<?if($IMG_URL2$)?><li><a href="$IMG_URL2$" class="zoom ulightbox screen" rel="screen"><img src="$IMG_SMALL_URL2$"/></a></li><?endif?>
 

Стоят такие стили:

/* screen list
-----------------------------------------------------------------------------*/
.screen-list {
  margin: 20px -10px;
  padding: 0;
  list-style: none;
}
.screen-list:after {
  content: '';
  clear: both;
  display: table;
  width: 100%;
}
.screen-list li {
  float: left;
  width: 33%;
  padding: 10px;
  box-sizing: border-box;
}
.screen-list .screen {
  box-sizing: border-box;
  padding: 10px;
  background: #151515;
  text-align: center;
  border: 1px solid rgba(102, 102, 102, 0.3);
  display: block;
}
/* zoom
-----------------------------------------------------------------------------*/
.zoom {
  position: relative;
  display: inline-block;
}
.zoom:after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  content: "\f00e";
  font-family: FontAwesome;
  font-size: 30px;
  margin: auto;
  width: 30px;
  height: 30px;
  line-height: 30px;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  z-index: 3;
  text-shadow: 0 0 0 5px #000;
}
.zoom:hover img {
  opacity: 0.6;
}
.lte-ie-8 .zoom:hover img {
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
  filter: alpha(opacity=60);
}
.zoom:hover:after {
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}

Общие настройки поставил вообще с уменьшенного изображения: 500 на 700 до 100 на 200

Answer 1

В настройках есть размер, по который нужно уменьшить изображение, если оно большое (по умолчанию 500х500). Если загруженное изображение меньше, то уменьшенная копия не создается - отсюда ломанная ссылка. Код должен выглядеть так:

<?if($IMG_SMALL_URL1$)?>
<a href="$IMG_URL1$" class="zoom ulightbox"><img src="$IMG_SMALL_URL1$" alt="$ENTRY_TITLE$"/></a>
<?else?>
<a href="$IMG_URL1$" class="zoom ulightbox"><img src="$IMG_URL1$" alt="$ENTRY_TITLE$"/></a>
<?endif?>

 

Comments

спасибо)! теперь все понятно стало