티스토리 뷰

FRAMER 프레이머에 도메인 연결하는 방법!

나만의 사이트를 제작하기 위해 프레이머를 많이들 사용하고 계시죠. 프레이머는 특히 호환, 인터렉티브가 뛰어나기 때문에 디자이너분들이 많이 사용하고 있습니다. 디지털 노마드로 활동하고싶다면 나만의 사이트가 필수인데요. 오늘은 디지털 노마드를 위해 프레이머에 도메인 연결하는 방법 정말 손 쉽게 알려드리겠습니다.

 

제가 앞으로 항상 강조드릴 내용인데, 디지털노마드는 잡기에 능해야 합니다. 이런건 뚝딱 만들어야 한다고요~ 앞으로 더 많은 디지털 노마드를 위한 정보를 올리도록 하겠습니다.

 

도메인 구매하는 방법, 하위도메인을 연결하는 방법은 하단 참고

 

 

 

1. 제작중인 프레이머에 접속우측 상단 설정(settings)을 클릭

 

 

 

 

2. settings 접속하여 좌측 매뉴에서 domains를 클릭

그런데 잠깐! 프레이머에서는 framer.app 무료 하위 도메인을 제공하고 있습니다. 그래서 그냥 퍼블리쉬하면 웹사이트를 만들 수 있죠. 헌데 이를 내가 갖고있는 별도의 도메인으로 연결하기 위해서는 무료 플랜에서는 불가능합니다. 아래 이미지를 보시면 mini plan 이상부터 custom domain 세팅이 가능함을 알 수 있습니다.

 

아래처럼 유료 플랜을 결제 해주신 뒤에 따라해주시면 됩니다. 저는 basic 플랜을 사용하고 있어서 문제 없이 변경 했습니다.

 

 

 

 

 

 

 

3. 좌측 매뉴바에서 domains 클릭 후 custom domain 찾기

 

 

custom domain에 결제를 하지 않았다면 위 화면처럼 비활성화 되어있습니다. 플랜을 결제 하면 아래 화면처럼 connect a domain you own을 클릭을 할 수 있도록 변경됩니다. 저곳에 구매한 도메인 주소를 입력하면 됩니다.ex)www.perbj96.com 이런식으로 말입니다. 그 후 우측 체크를 눌러주세요

 

+ 많이 하는 실수! 옆 체크가 비활성화 된다면 url주소에 '.'이 들어간 건 아닌지? '띄어쓰기'가 되어있는 것은 아닌지? 확인해보세요.

 

 

 

4. custom domain - status 값들을 가비아 dns 관리툴 > 레코드 수정에 기입

status에 적혀있는 Name, Type, Value를 가비아 DNS설정에 기입해줘야 합니다. 가비아 페이지로 이동하셔서 my가비아 > dns관리툴 > 해당되는 도메인 좌측 체크 박스 체크 후 상단 dns설정 클릭  좌측 하단에 레코드 추가 눌러서 다음 정보를 기입해줍니다.

제 경우 두 개이기 때문에 레코드 두 개 추가해줬고요. 여러분도 각자 status 에 맞게 입력해주시면 됩니다.

 

첫번째로 타입에 CNAME 선택했고, 호스트 이름에 www.two 기입, 값/위치에는 sites.framer.app. 기입해줬습니다. 제가 입력한 정보 따라하지 마시고 각자 framer에서 나온 정보에 맞게 입력해주시면됩니다.

 

두번째로 타입에 CNAME 선택했고, 호스트 이름에 two 기입, 값/위치에는 sites.framer.app. 기입해줬습니다.

 

이때 값/위치 에는 맨 마지막에 .이 들어가야합니다.

 

 

 

5. 도메인 연결 완료 및 체크

 

우측 상단에 optimized 로 최적화 되었다고 나옵니다. URL 주소를 클릭하거나 드래그 후 복사 붙여넣기로 크롬에서 켜봅니다. 내가 설정한 도메인 주소에서 내 사이트가 잘 나온다면 잘 된것입니다.

 

만약 오류가 난다면 url주소가 잘못 기입된 것은 아닌지 확인해주시고, 레코드 수정에 잘못 기입된 것은 아닌지 확인해주세요!

 

 

 


도메인 구매하는 방법👋

 

가비아 도메인 구매 하는 방법과 비용 구입후 연결

가비아도메인구매 방법과 비용 및 구입 후 세팅하는 방법! 디지털 노마드라면 꼭! 갖고 있어야 할 것이 있는데 바로 사이트입니다. 나만의 사이트! 나만의 사이트는 국내에서 아임웹이나 해외

second.perbj96.com

 

 

 

#프레이머 #프레이머도메인 #도메인연결 #framer #domain

반응형