OpenCart : 인라인 스타일 제거

Question

카테고리 페이지에서 내 CSS 스타일은 플랫폼에서 생성 된 인라인 스타일에 의해 무시됩니다. 관리 영역에서 설정> 시스템 - 이미지 [탭] 아래에 이미지의 크기를 조정할 수있는 옵션이 있습니다. 예를 들어, 나는 같은 영향을 얻기 위해, 400 X 400 제품 이미지 목록 크기 크기를 조정할하지만 이렇게 같은 URL을 생성하기 때문에이 응답에 대한 스타일이 불가능합니다 :

http://localhost/THEME/image/cache/data/demo/w1-**400x400.jpg** 

코드 생성한다 이

<img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" class="" /></a> 

가 어떻게이 크기를 생성하지 Opencart을 중지 않는 루트/catelog /보기/테마/템플릿/제품/category.tpl에? 어떤 아이디어?

도움을 주셔서 감사합니다.

Answer 1

기본적으로 OpenCart CSS 파일은 카테고리 페이지의 이미지 너비와 높이에 CSS 속성을 설정하지 않으므로 문제는 CSS 규칙을 재정의하는 인라인 스타일이 아닙니다.

OpenCart는 관리자가 설정 한 내용에 따라 이미지의 크기를 자동으로 조정합니다 (귀하의 경우 400x400). CSS 규칙이 없으므로 표시되는 크기는 이미지 크기가됩니다. ,

1. 을 기본 CSS 파일에서 .product-list .image img을 찾아 백분율 값으로 width 및 height 태그를 추가 :
   당신이 중 하나를 다음으로 시도 할 수 있습니다를 해결하려면. 반응 형 사이트를 얻으려고한다고 언급 했으므로 다양한 화면 크기에 대해 별도의 CSS 파일이 필요할 수 있습니다. 문제는 400x400 픽셀로 이미지의 크기를 조정했지만 CSS 정의가 이미지를 더 큰 크기로 확대 (600x600 픽셀이라고 가정)하면 저해상도처럼 보이는 픽셀 화 된 이미지를 얻게된다는 것입니다. 이 문제를 해결하려면 두 번째 옵션을 살펴보십시오.

2. OpenCart는 성능을 향상시키고 대역폭에 을 저장하기 위해 이미지의 크기를 조정합니다. 컨트롤러 파일에서 카탈로그/컨트롤러/제품/category.php, 라인 (213)의 주위에 당신은 다음 줄이 표시됩니다

   $image = $this->model_tool_image->resize($result['image'], $this->config->get('config_image_product_width'), 
   

   을 $ this-> config-> 수 ('config_image_product_height'));

   이것은 OpenCart가 관리자 설정에서 정의한 크기로 이미지의 크기를 조정하도록 지시하는 코드입니다. 의 응답 너비와 높이가 필요하면 사용자 기기 ( )를 사용하여 MobileDetect http://mobiledetect.net/과 같은 opensource 패키지 을 감지하고 사용 된 기기에 따라 크기 조정 치수를 조정할 수 있습니다.

   • 동적으로 크기를 조정하면 원본 이미지가 요청한 크기보다 크다는 가정하에 이미지가 픽셀 화되지 않으며 동시에 성능을 높이고 대역폭을 절약 할 수 있습니다.

희망이 있습니다.