퍼스트 콘텐츠몰 리스트 스타일로 변경 문의

KBoard 퍼스트 콘텐츠몰 스킨 사용중입니다.

현재 상품 리스트가 이미지 형식으로 되어 있는데요..

그냥 리스트 형식으로 사용을 하려면 어떻게 해야할까요? 주문조회, 판매조회에서도 마찮가지로요... 섬네일 이미지가 필요없어서요..

그리고 구매자, 휴대폰번호 이메일 등의 필드가 가로로 표현할 수 있는 방법도 부탁드립니다.

그리고 옆에 있는 메뉴들 주문조회, 판매조회 리스트를 위로 올리고 화면을 full로 사용을 하려면 어떻게 해야할까요?

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    1. KBoard 퍼스트 콘텐츠몰 스킨 전체상품, 주문조회, 판매조회 페이지에서 썸네일을 안 보이게 하시려면

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드를 추가해보시겠어요?

    #kboard-first-contents-mall-list .kboard-list .kboard-list-item .kboard-list-thumbnail-wrap { display: none; }
    #kboard-first-contents-mall-list .kboard-history .kboard-list-item .kboard-list-thumbnail { display: none; }
    #kboard-first-contents-mall-list .kboard-history .kboard-list-item .kboard-list-info { margin-left: 0; }

     

    2. 구매자, 휴대폰번호 이메일 필드를 나란히 표시하시려면

    FTP로 접속해서 /wp-content/plugins/kboard/skin/사용중인코드/order.php 파일에

    아래의 코드를 찾아서

    <div class="kboard-attr-row kboard-attr-row-half">
    	<label class="attr-name" for="<?php echo $order->getFieldName('name')?>"><?php echo __('Name', 'kboard')?> <span class="required">*</span></label>
    	<div class="attr-value">
    		<input type="text" id="<?php echo $order->getFieldName('name')?>" name="<?php echo $order->getFieldName('name')?>" value="<?php echo $order->name?>">
    	</div>
    </div>
    <?php if($board->meta->first_contents_mall_use_company_name_field):?>
    <div class="kboard-attr-row kboard-attr-row-half">
    	<label class="attr-name" for="<?php echo $order->getFieldName('company_name')?>"><?php echo __('Company name', 'kboard')?></label>
    	<div class="attr-value">
    		<input type="text" id="<?php echo $order->getFieldName('company_name')?>" name="<?php echo $order->getFieldName('company_name')?>" value="<?php echo $order->company_name?>">
    	</div>
    </div>
    <?php endif?>
    <div class="kboard-attr-row">
    	<label class="attr-name" for="<?php echo $order->getFieldName('phone')?>"><?php echo __('Mobile phone', 'kboard')?> <span class="required">*</span></label>
    	<div class="attr-value">
    		<input type="text" id="<?php echo $order->getFieldName('phone')?>" name="<?php echo $order->getFieldName('phone')?>" value="<?php echo $order->phone?>">
    	</div>
    </div>
    <div class="kboard-attr-row">
    	<label class="attr-name" for="<?php echo $order->getFieldName('email')?>"><?php echo __('Email', 'kboard')?> <span class="required">*</span></label>
    	<div class="attr-value">
    		<input type="email" id="<?php echo $order->getFieldName('email')?>" name="<?php echo $order->getFieldName('email')?>" value="<?php echo $order->email?>">
    	</div>
    </div>

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

    <div class="kboard-attr-row kboard-attr-row-one-third">
    	<label class="attr-name" for="<?php echo $order->getFieldName('name')?>"><?php echo __('Name', 'kboard')?> <span class="required">*</span></label>
    	<div class="attr-value">
    		<input type="text" id="<?php echo $order->getFieldName('name')?>" name="<?php echo $order->getFieldName('name')?>" value="<?php echo $order->name?>">
    	</div>
    </div>
    <?php if($board->meta->first_contents_mall_use_company_name_field):?>
    <div class="kboard-attr-row kboard-attr-row-half">
    	<label class="attr-name" for="<?php echo $order->getFieldName('company_name')?>"><?php echo __('Company name', 'kboard')?></label>
    	<div class="attr-value">
    		<input type="text" id="<?php echo $order->getFieldName('company_name')?>" name="<?php echo $order->getFieldName('company_name')?>" value="<?php echo $order->company_name?>">
    	</div>
    </div>
    <?php endif?>
    <div class="kboard-attr-row kboard-attr-row-one-third" >
    	<label class="attr-name" for="<?php echo $order->getFieldName('phone')?>"><?php echo __('Mobile phone', 'kboard')?> <span class="required">*</span></label>
    	<div class="attr-value">
    		<input type="text" id="<?php echo $order->getFieldName('phone')?>" name="<?php echo $order->getFieldName('phone')?>" value="<?php echo $order->phone?>">
    	</div>
    </div>
    <div class="kboard-attr-row kboard-attr-row-one-third">
    	<label class="attr-name" for="<?php echo $order->getFieldName('email')?>"><?php echo __('Email', 'kboard')?> <span class="required">*</span></label>
    	<div class="attr-value">
    		<input type="email" id="<?php echo $order->getFieldName('email')?>" name="<?php echo $order->getFieldName('email')?>" value="<?php echo $order->email?>">
    	</div>
    </div>

     

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드도 추가해보세요.

    #kboard-first-contents-mall-editor .kboard-attr-row-one-third { width: 33.3333%; }
    #kboard-first-contents-mall-editor .kboard-attr-row-one-third .attr-name { width: auto; }
    #kboard-first-contents-mall-editor .kboard-attr-row-one-third .attr-value { margin-left: 85px; }
    
    @media screen and (max-width: 600px) {
    	#kboard-first-contents-mall-editor .kboard-attr-row-one-third { width: 100%; }
    }

     

    3. 사이드 메뉴를 위로 올린 후 상품 목록 영역을 full-width로 적용하시려면

    아래의 코드를 추가해보시겠어요?

    .kboard-first-contents-mall-sidebar.kboard-sidebar-left { width: 100%; }
    .kboard-first-contents-mall-content { width: 100%; }

     

    저희가 커뮤니티에서 코드를 일일이 만들어 드리기엔 현실적으로 불가능합니다.

    원하시는 모양으로 수정하시려면

    HTML과 CSS 코드에 대해서 알면 레이아웃을 편집하는 데 도움이 되실 듯합니다.

    고맙습니다.

  • 1번의 경우 알려주신대로 해보니...

    전체상품 페이지 이미지만 사이즈가 반으로 줄어들뿐 그대로 이미지가 나타나고 있습니다. 다른 페이지들도 변동없이 그대로 나타나고 있고요...

     

    어떻게 해야할까요???

  • html은 조금 아는데요.. css는 생소합니다. 미안합니다.

    제품을 구입하려니... 어쩔수 없이 문의를 많이 하게 되네요... 늘 고맙게 생각하고 있습니다.

  • 간단히 말씀을 드리자면 전체상품 페이지에서 이미지 형태가 아닌 게시판 리스트 형태로 보여지게 하고 싶은건데요..

    이미지가 안없어집니다.

  • 실제 적용하신 코드가 어떻게 되시는지요?

    실제 비회원으로도 확인 가능한 페이지 주소 알려주시면 살펴보겠습니다.

    고맙습니다.

  • http://ourenglishcafeacademy.com/index.php/sale_test/ 입니다.

  • 워드프레스 관리자 -> KBoard -> 게시판 목록 -> 게시판 선택 -> 게시판 관리 페이지에서

    "최대 첨부파일 개수" 설정을 변경해주셔야 첨부파일을 등록할 수 있습니다.

    썸네일에 파일을 등록하시면 파일을 다운로드할 수 없습니다.

     

    KBoard 퍼스트 콘텐츠몰 스킨의 전체상품 리스트 페이지의 레이아웃을 default 스킨의 모양으로 수정하는 방법은 안내드리겠습니다.

    고맙습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기