코스모스팜 스레드

원더풀프로덕트 썸네일 크기제어

현재 사이트에서 원더풀 프로덕트 게시판을 사용중입니다.

다름이 아니라 제품등록시 썸네일의 크기나 비율이 맞지 않으면 제품이 썸네일의

상단에 붙어 css를 건들여 보아도 해결을 할수없어 질문 남깁니다.

 

상세페이지에서도 이미지의 비율이 맞지 않으면 밑으로 짤리는 일이 생기는데,

어떻게 하면될지 부탁드립니다.

 

 

사이트 : http://factos.co.kr/?page_id=83&mod=list&pageid=1&kboard_search_option%5Btree_category_1%5D%5Bkey%5D=tree_category_1&kboard_search_option%5Btree_category_1%5D%5Bvalue%5D=

무제한으로 웹사이트를 만드세요. (코스모스팜 무제한 라이센스)
무제한으로 웹사이트를 만드세요. (코스모스팜 무제한 라이센스)
  • 안녕하세요~^^

    KBoard 원더풀 제품소개 스킨 게시글 목록 페이지에서 썸네일 높이는

    썸네일 너비에 따라 자동으로 조절하고 있습니다.

    list.js 파일을 직접 수정하신 건지요?

     

    FTP로 접속해서 /wp-content/plugins/kboard/skin/wonderful-product/list.js 파일의 코드를

    아래의 코드로 교체해보시겠어요?

    /**
     * @author https://www.cosmosfarm.com/
     */
    
    jQuery(document).ready(function(){
    	kboard_wonderful_product_list_layout();
    });
    
    jQuery(window).resize(function(){
    	kboard_wonderful_product_list_layout();
    });
    
    function kboard_wonderful_product_list_layout(){
    	jQuery('#kboard-wonderful-product-list .kboard-list').each(function(){
    		var parent = jQuery(this).parent('#kboard-wonderful-product-list');
    		var width = jQuery(parent).width();
    
    		var item_width = jQuery('.kboard-list-item', this).width();
    		jQuery('.kboard-list-item .kboard-wonderful-product-thumbnail', this).css({'height':item_width+'px'});
    	});
    }

     

    본문 페이지에서 이미지가 잘리는 문제는

    직접 추가하신 아래의 코드를 지워보시겠어요?

    #kboard-wonderful-product-document .kboard-wonderful-product-wrap .kboard-wonderful-product-image-gallery div.lslide.active {
        height: 400px !Important;
        overflow: hidden !Important;
    }

     

    그래도 잘려서 표시된다면 

    /wp-content/plugins/kboard/skin/wonderful-product/list.php

    /wp-content/plugins/kboard/skin/wonderful-product/latest.php

    /wp-content/plugins/kboard/skin/wonderful-product/document.php 파일을 각각 보시면

    아래의 코드들을 확인해보실 수 있습니다.

    <?php echo kboard_resize($media_item->file_path, 200, 200)?>
    <?php echo kboard_resize($media_item->file_path, 600, 338)?>
    $content->getThumbnail(600, 600)
    $content->getThumbnail(176, 132)

    위의 코드 중에서 앞에 있는 숫자는 너비이며 뒤에 있는 숫자는 높이입니다.

    적절히 수정하신 후에도 확인해보시겠어요?

     

    추가로 원본 이미지가 작다면 페이지에서 늘려서 표시할 경우

    이미지가 흐릿하게 깨져 보일 수 있습니다.

    고맙습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
무제한으로 웹사이트를 만드세요. (코스모스팜 무제한 라이센스)