주소 (Address)를 구글맵 (Google Maps) iFrame 으로 변환 jQuery

때로는 텍스트 베이스의 주소만 가지고 주소변환을 통해 구글맵을 표시해 주고 싶을 때가 있습니다. 그런 경우 간단히 사용할 수 있는 코드를 공유합니다.

1. HTML Part

<span class="need_to_convert">
NSW, Australia
</span>

먼저 위와 같이 주소를 wrapping 한 부분이 필요하고요,

2. jQuery Part

jQuery(document).ready(function($) {
	$("span.need_to_convert").each(function(){ 
		var embed_iframe = '<iframe width="400" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?q=' + encodeURIComponent( $(this).text() ) + '&amp;output=embed"></iframe>';
	});

	$(this).html(embed_iframe);
});

저는 한 페이지에 여러개가 있을 경우를 대비해 jQuery를 이용해 Wrapper 의 클래스(need_to_convert)로 싸그리 찾아서 구글맵(Google Mpas) iFrame 으로 변환해 주었습니다.

실제로 위의 코드를 적용한 페이지입니다. -> 클릭

워드프레스 우커머스 – 장바구니 버튼 이름 변경 방법

오늘은 워드프레스(WordPress) 온라인 쇼핑몰 플러그인(Plugin)인 우커머스(WooCommerce)의 장바구니(카트) 버튼 이름을 변경하는 방법을 설명하겠습니다.

상품 아카이브 페이지의 장바구니 버튼명 변경 방법

활성화된 테마 폴더 밑의 functions.php 파일을 사용하시는 에디터툴로 엽니다.

우커머스(WooCommerce) 버전 2.1 이하

add_filter( 'add_to_cart_text', 'my_archive_custom_cart_button_text' );
function my_archive_custom_cart_button_text() {
 
        return __( 'My Button Text', 'woocommerce' );
 
}

우커머스(WooCommerce) 버전 2.1 이상

add_filter( 'woocommerce_product_add_to_cart_text', 'my_archive_custom_cart_button_text' );
function my_archive_custom_cart_button_text() {
 
        return __( 'My Button Text', 'woocommerce' );
 
}

상품 디테일(싱글) 페이지의 장바구니 버튼이름 변경 방법

활성화된 테마 폴더 밑의 functions.php 파일을 사용하시는 에디터툴로 엽니다.

우커머스(WooCommerce) 버전 2.1 이하

add_filter( 'add_to_cart_text', 'my_custom_cart_button_text' );    // < 2.1
function my_custom_cart_button_text() {
 
        return __( 'My Button Text', 'woocommerce' );
 
}

우커머스(WooCommerce) 버전 2.1 이상

add_filter( 'woocommerce_product_single_add_to_cart_text', 'my_custom_cart_button_text' );    // 2.1 +
function my_custom_cart_button_text() {
 
        return __( 'My Button Text', 'woocommerce' );
 
}

상품 아카이브 페이지의 장바구니 상품타입에 따라 버튼이름 변경 방법

활성화된 테마 폴더 밑의 functions.php 파일을 사용하시는 에디터툴로 엽니다.

add_filter( 'woocommerce_product_add_to_cart_text' , 'my_woocommerce_product_add_to_cart_text' );
function my_woocommerce_product_add_to_cart_text() {
	global $product;
	
	$product_type = $product->product_type;
	
	switch ( $product_type ) {
		case 'external':
			return __( 'Buy product', 'woocommerce' );
		break;
		case 'grouped':
			return __( 'View products', 'woocommerce' );
		break;
		case 'simple':
			return __( 'Add to cart', 'woocommerce' );
		break;
		case 'variable':
			return __( 'Select options', 'woocommerce' );
		break;
		default:
			return __( 'Read more', 'woocommerce' );
	}
	
}

오늘은 워드프레스(WordPress)의 장점이라 할 수 있는 기능중의 하나인 필터기능으로 우커머스(WooCommerce)의 장바구니 버튼명을 변경하는 방법에 대해 소개하였습니다. 다음번에도 유용한 팁을 좋은 포스팅으로 찾아뵙겠습니다 ^-^

연관글: 우커머스(WooCommerce) – 페이팔 결제 버튼 텍스트 변경 방법