프로모션·이벤트 강조하는 상단 메뉴 구성법 📣 | 1분 디자인 레시피

2024. 05. 23

blog cover image


😮 버튼 하나로, 주목도를 확 높일 수 있다고?!


온라인 쇼핑몰 프로모션을 홍보할 때 배너나 팝업 창을 주로 활용하시나요? 그것보다 더 간단하면서도 효과적인 방법이 있습니다. 바로 웹사이트 상단 메뉴에 프로모션 페이지로 이동하는 ‘버튼’을 추가하는 건데요. 그럼 방문자가 어떤 페이지를 확인하든 프로모션 내용을 눈에 확 띄게 강조할 수 있죠.

여러분들의 이해를 돕기 위해, 가족을 위한 건강 먹거리를 만드는 브랜드 <파파공방>의 웹사이트 사례로 상단 메뉴에 페이지 이동 버튼 추가하는 법을 1분 안에 소개합니다. 파파공방은 상단에 프로모션 페이지로 이동하는 버튼을 추가해, 자연스럽게 랜딩을 유도하고 있는데요.


파파공방의 디자인 레시피, 지금 알아볼까요?👩‍🍳


📌이런 분이라면 특히 주목해 주세요!

  • 이벤트, 프로모션, 행사 등을 현재 진행 중이거나, 진행 예정인 분
  • 메인 페이지에서부터 특정한 행동을 유도하고 싶은 분
  • 방문 고객에게 알리고 싶은 이벤트, 제품, 콘텐츠 등이 있는 분




STEP 1
디자인 모드에 접속 후, 상단에 마우스 우클릭. [상단설정] 메뉴로 이동해 주세요.


STEP 2
우측 [+] 버튼 클릭. [링크/버튼] 위젯을 추가한 뒤 [설정] 메뉴로 들어가 주세요.


STEP 3
형태를 ‘버튼’으로 바꾼 뒤, 원하는 문구와 스타일로 디자인하고, 버튼 클릭 시 이동될 링크까지 연결해 주면 끝이에요!

✋ 여기서 잠깐!

이벤트 페이지를 새롭게 만들 예정이라면, 페이지 세팅 후 해당 메뉴를 숨김 처리하여야 합니다.

[설정법]

  1. 디자인모드 좌측 상단 [☰(메뉴 관리)] 클릭
  2. ‘상단 메뉴’ 항목 오른쪽 [+] 버튼 클릭 (새 메뉴 추가)
  3. (새 메뉴 페이지 세팅 완료 후) 디자인모드 좌측 상단 [☰(메뉴 관리) > 새 메뉴 오른쪽 [i(메뉴 설정)]] 버튼 클릭
  4. 옵션 탭에 ‘상단 숨김’ 기능 체크

🤔 버튼 내 폰트는 어떻게 변경하나요?

디자인모드 상단 [톱니바퀴(공통 디자인 설정)] 버튼 클릭. 텍스트 항목의 ‘본문 한/중/일’의 글꼴을 변경해 주세요.




다른 브랜드들은 이 기능을 어떻게 활용했을까요?


🔎 룸투어 (by SOSIC)
상단 메뉴에 [지금 신청가능한 에피소드] 버튼을 추가하여, 곧 진행할 프로그램을 홍보했어요.

 

🔎 모닝글로리 다이렉트
상단 메뉴에 [청첩장주문 필독서] 버튼을 추가하여, 주문 방법을 안내했어요.


상단 메뉴에 페이지 이동 버튼 추가하기, 이런 용도로도 활용할 수 있어요!

  • 특정 상품/카테고리로 이동하는 버튼 (ex. 신제품, 새로운 라인업…)
  • 진행 중인 ‘브랜드 캠페인/행사’ 페이지로 이동하는 버튼
    •  Coming Soon 소식을 알리기 위한 홍보 장치로도 활용할 수 있어요.
  • CTA 버튼 (ex. Contact 페이지 이동, 이메일 발송, 전화 연결…)


우리 브랜드만의 감도 높은 웹사이트, 쉽고 빠르게 만들어 보세요!


아임웹은 웹사이트, 온라인 쇼핑몰 제작을 고민하는 여러분들을 위해 70여 종의 템플릿을 무료로 제공하고 있어요. 조금만 수정해도 꽤 그럴듯한 웹사이트가 완성되죠! 마음에 드는 템플릿을 발견했다면, 지금 바로 가볍게 만들어 보세요👇





레시피 사례로 소개한 파파공방을 비롯해 룸투어 (by SOSIC)모닝글로리 다이렉트는 아임웹과 함께 성장하는 브랜드입니다.



by 마케팅 소영