주 콘텐츠로 건너뛰기

상품명에 입력한 html 태그 노출하기

html 태그를 이용해서 특정 상품명을 눈에 띄게 할 수 있어요.

자세히 알아보기

상품명에 html 태그 사용하기

Html과 Css를 활용하여 상품명을 더 눈에 띄게 꾸밀 수 있어요.

상품명 변수에는 두 가지 종류가 있어요.

하나는 태그가 적용되는 변수이고 다른 하나는 태그가 적용되지 않는 변수예요. 

상품명에 Html 태그를 적용하려면 {$product_name_tag} 변수를 사용해 주세요.

 

Info

  • 태그를 무시하는 상품명 변수:
    <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. 어드민 관리자로 접속해 주세요.

[관리자] 상품 > 상품목록으로 이동후 '상품명'을 클릭해 주세요.
'기본정보 > 상품명'에 사용하고자 하는 태그를 넣고 저장합니다.

태그 입력 유의사항

태그의 열고 닫힘이 제대로 되지 않으면 쇼핑몰 화면에 문제가 될 수 있으니 주의해 주세요!

1.jpg

 

상품명에 태그가 적용된 모습

2.jpg

이 페이지가 도움이 되었나요?
현재 콘텐츠