컨텐츠 바로가기


스마트디자인 팁 상세
제목 [스마트디자인] 상품명에 입력한 html 태그를 노출하는 방법
작성자 대표 관리자 (ip:) 작성일 2017-05-25 17:02:33 조회수 4609


상품명에 입력한 html 태그를 노출하는 방법


html과 css을 사용하면, 특정 상품명을 더 눈에 띄게 할 수 있습니다.
이럴 때 상품명에 html 태그를 사용할 수 있는데요.

상품명 변수는 태그가 적용되는 변수가 있고, 아닌 변수가 있습니다.


 - 태그를 무시하는 상품명 변수: <a href="/product/detail.html{$param}">{$product_name}</a>
 - 태그가 노출되는 상품명 변수: <a href="/product/detail.html{$param}">{$product_name_tag}</a>

 


태그가 노출되는 상품명 변수를 이용해서, 상품명에 스타일을 적용해보겠습니다.


1. 스마트디자인 편집창을 엽니다.


 변경할 파일을 열어 아래와 같이 변수명을 수정합니다.

아래 부분에 붉은색 코드는 삭제하고, 파란색 코드를 추가해주세요.

    <ul class="prdList grid4">
        <li id="anchorBoxId_{$product_no}">
            <div class="thumbnail">
                <a href="{$link_product_detail}" name="anchorBoxName_{$product_no}"><img src="{$image_medium}" id="{$image_medium_id}" alt="{$seo_alt_tag}" /><span module="product_Imagestyle"><span class="prdIcon {$icon_class_name}" style="background-image:url('{$icon_url}');"></span></span></a>
                <span class="wish">{$list_wish_icon}</span>
            </div>
            <div class="description">
                <div class="icon">
                    <div class="promotion">{$soldout_icon} {$stock_icon} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</div>
                    <div class="button">
                        <div class="likeButton {$disp_likeprd_class}"><button type="button">{$disp_likeprd_icon}<strong>{$disp_likeprd_count}</strong></button></div>
                        <div class="option">{$option_preview_icon}</div> {$basket_icon} {$zoom_icon}
                    </div>
                </div>
                <strong class="name"><a href="{$link_product_detail}" class="{$product_name_display|display}"><span class="title {$product_name_title_display|display}">{$product_name_title} :</span> {$product_name}</a></strong>
                <strong class="name"><a href="{$link_product_detail}" class="{$product_name_display|display}"><span class="title {$product_name_title_display|display}">{$product_name_title} :</span> {$product_name_tag}</a></strong>
                <ul module="product_ListItem" class="spec">
                    <li class="{$item_display|display}"><strong class="title {$item_title_display|display}">{$item_title} :</strong> {$item_content}</li>
                    <li class="{$item_display|display}"><strong class="title {$item_title_display|display}">{$item_title} :</strong> {$item_content}</li>
                </ul>
            </div>
        </li>
        <li id="anchorBoxId_{$product_no}">
            <div class="thumbnail">
                <a href="{$link_product_detail}" name="anchorBoxName_{$product_no}"><img src="{$image_medium}" id="{$image_medium_id}" alt="{$seo_alt_tag}" /><span module="product_Imagestyle"><span class="prdIcon {$icon_class_name}" style="background-image:url('{$icon_url}');"></span></span></a>
                <span class="wish">{$list_wish_icon}</span>
            </div>
            <div class="description">
                <div class="icon">
                    <div class="promotion">{$soldout_icon} {$stock_icon} {$recommend_icon} {$new_icon} {$product_icons} {$pickup_icon} {$benefit_icons}</div>
                    <div class="button">
                        <div class="likeButton {$disp_likeprd_class}"><button type="button">{$disp_likeprd_icon}<strong>{$disp_likeprd_count}</strong></button></div>
                        <div class="option">{$option_preview_icon}</div> {$basket_icon} {$zoom_icon}
                    </div>
                </div>
                <strong class="name"><a href="{$link_product_detail}" class="{$product_name_display|display}"><span class="title {$product_name_title_display|display}">{$product_name_title} :</span> {$product_name}</a></strong>
                <strong class="name"><a href="{$link_product_detail}" class="{$product_name_display|display}"><span class="title {$product_name_title_display|display}">{$product_name_title} :</span> {$product_name_tag}</a></strong>
                <ul module="product_ListItem" class="spec">
                    <li class="{$item_display|display}"><strong class="title {$item_title_display|display}">{$item_title} :</strong> {$item_content}</li>
                    <li class="{$item_display|display}"><strong class="title {$item_title_display|display}">{$item_title} :</strong> {$item_content}</li>
                </ul>
            </div>
        </li>
    </ul>

 



2. 어드민 관리자로 접속합니다.

상품관리 > 상품관리 > 상품목록 > 상품명을 클릭합니다.

기본정보 > 상품명에 사용하고자 하는 태그를 넣고 저장합니다.

태그의 열고 닫힘이 제대로 되지 않으면 쇼핑몰 화면에 문제가 될 수 있으니 주의하시기 바랍니다.






-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------



     




 


상품명에 태그가 적용되었습니다.



첨부파일
목록 관리자게시 삭제 수정