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

2024. 05. 23


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


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

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


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


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

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




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


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


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

✋ 여기서 잠깐!

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

[설정법]

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

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

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




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


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

 

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


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

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


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


💌 평소 궁금했던 디자인 설정법이 있다면 알려주세요!

아임웹을 사용하거나, 고객사례를 보며 궁금했던 디자인 설정법이 있으셨다면 👉 여기에 남겨주세요. 보내주신 의견을 참고하여, 더욱 유익한 디자인 레시피를 들고 찾아올게요!





📖 오늘 내용과 연관된 아임웹 가이드



🔖 다른 레시피 보러가기




by 마케팅 소영