[javascript]카페24 쇼핑몰 디자인 수정 - 상품상세페이지 특정요소 감추기

[javascript]카페24 쇼핑몰 디자인 수정 - 상품상세페이지 특정요소 감추기

 

 

[javascript]카페24 쇼핑몰 디자인 수정 - 상품상세페이지 특정요소 감추기

 

카페24 쇼핑몰을 운영하다 보면 마케팅 영역에 따라 특정 요소를 감춰야 하는 경우가 생긴다. 

 

카페24 쇼핑몰 솔루션에서는 해당 기능을 지원하지 않기 때문에 

 

jquery를 이용해서 해당 기능을 구현했다. 

 

jquery 특성상 로딩에 시간이 걸리기 때문에 완벽하게 처리가 되지는 않지만 

 

어느정도 처리가 되므로 원하는 기능구현에 문제는 없어 보인다. 

 

처리방식은 현재페이지의 URL을 확인하고 URL안에 특정 키워드가 포함되있으면

 

해당 영역을 숨김처리하도록 했다. 

 

var aUrl = window.location.href;

$(function(){
	function urlCk(){
		var burl = window.location.href;
		var str = "cafe_mkt=ue_tistory";
		if (burl.indexOf(str) !=-1)
		{
			$('.xans-product-detaildesign > table tr:nth-child(4)').css('display','none');
		}
	}
	urlCk();
});

카페24쇼핑몰 상세페이지의 최대혜택가를 tistory라는 키워드를 가지고 접근하게 되면 해당영역을 감추도록

 

처리를 해주었다. 

 

그런데 키워드를 가지고 접속한 후 다른곳으로 이동하게 되면 키값을 가지고 가지 않는 문제가 발생된다. 

 

이럴땐 보통 쿠키를 사용해서 해당 브라우저에서 이동을 할 경우에도 값을 유지해주면 간단하게 처리할 수 있다. 

 

var aUrl = window.location.href;
var tCookie = document.cookie;

$(function(){
	function urlCk(){
		var burl = window.location.href;
		var str = "cafe_mkt=ue_tistory";
		var str2 = "tistory";
		if (burl.indexOf(str) !=-1)
		{
			$('.xans-product-detaildesign > table tr:nth-child(4)').css('display','none');
			document.cookie = "tCookies=tistory";
		} else {
			if(tCookie.indexOf(str2) !=-1){
				$('.xans-product-detaildesign > table tr:nth-child(4)').css('display','none');
			}
        }
	}
	urlCk();
});

최종적으로 작성한 스크립트는 위와 같다. 

 

- 정리 - 

1. javascript 현재 url 가져오기 : window.location.href

2. javascript  현재 쿠키 확인하기 : document.cookie

3. 현재 url 에 특정 키워드가 있는지 확인 : indexOf(str)

4. 만약 키워드가 있으면 원하는 영역 감추기 , 쿠키 생성하기

5. 키워드가 없는데 쿠키가 있으면 해당영역 감추기