버튼페이지가 디자이너가 뭐야?

오픈카톡에서 승인받기

버튼페이지 이동하기

"복잡한 코딩 없이, 나만의 멋진 버튼 페이지를 만들어요!"

안녕하세요! 블로그나 웹사이트에 방문자들이 쉽게 찾을 수 있는 링크를 모아두고 싶으셨나요? '버튼페이지 디자이너'는 누구나 쉽고 간편하게 멋진 버튼 페이지를 만들 수 있도록 도와주는 프로그램입니다. 이 가이드는 '버튼페이지 디자이너'를 처음 사용하시는 분들을 위한 필수 안내서예요. 프로그램 설치부터 가장 먼저 알아두면 좋은 기본 설정과 사용법을 쉽고 친절하게 알려드릴게요. 자, 그럼 시작해 볼까요?

프로그램 다운로드하기

1

'버튼페이지 디자이너'는 무엇인가요?

'버튼페이지 디자이너'는 여러분의 블로그나 웹사이트에 필요한 다양한 링크들을 깔끔하고 보기 좋은 버튼 형태로 만들어주는 프로그램입니다. 복잡한 코딩 지식 없이도 몇 번의 클릭만으로 전문적인 디자인의 버튼 페이지를 완성할 수 있어요. 여러 개의 카테고리로 나누어 버튼을 관리하는 '탭 모드'와 하나의 페이지에 모든 버튼을 보여주는 '단일 모드'를 지원하여 여러분의 필요에 맞춰 활용할 수 있습니다.

🎯 핵심 포인트

'버튼페이지 디자이너'의 가장 큰 장점은 '누구나 쉽게' 사용할 수 있다는 점입니다. 코딩 걱정 없이 여러분의 아이디어를 바로 현실로 만들어 보세요. 시간 절약은 물론, 방문자들에게 편리함을 제공할 수 있습니다.

2

차근차근 따라하기: 프로그램 시작과 기본 설정

먼저, 다운로드하신 '버튼페이지 디자이너' 폴더를 열어주세요. 그 안에 있는 '버튼페이지 디자이너.exe' 파일을 찾아 더블클릭하시면 프로그램이 바로 실행됩니다. 설치 과정 없이 편리하게 이용할 수 있어요!

다운로드 폴더에서 '버튼페이지 디자이너.exe' 파일을 찾아 더블클릭하여 프로그램을 실행합니다.

프로그램을 실행하면 가장 먼저 '⚙️ 모드 선택' 부분이 보일 거예요. 여기서 여러분이 만들고자 하는 페이지의 형태를 선택할 수 있습니다.

• 📁 탭 모드

  여러 개의 카테고리(탭)로 나누어 버튼을 정리하고 싶을 때 선택합니다. 예를 들어 '쇼핑 링크', '유튜브 채널', '추천 사이트' 등으로 구분할 수 있어요.

• 📄 단일 모드

  하나의 페이지에 모든 버튼을 한눈에 보여주고 싶을 때 선택합니다. 간단한 링크 모음 페이지를 만들 때 유용합니다.

원하는 모드를 선택하면 그에 맞는 작업 환경으로 전환됩니다. 언제든지 '📁 탭 모드' 또는 '📄 단일 모드' 버튼을 클릭하여 모드를 변경할 수 있습니다.

프로그램 상단의 '모드 선택' 영역에서 '탭 모드' 또는 '단일 모드'를 클릭하여 전환할 수 있습니다.

🎯 핵심 포인트

'탭 모드'는 복잡한 내용 정리할 때, '단일 모드'는 간결한 링크 모음 만들 때 편리해요! 이 둘은 언제든지 전환 가능하며, 각 모드에서 만든 내용은 서로 영향을 주지 않고 독립적으로 저장됩니다.

여러분이 만든 버튼 정보들은 프로그램 종료 시 자동으로 저장되지 않으므로, 작업 중간중간 '💾 프로젝트 저장' 버튼을 눌러 소중한 결과물을 꼭 저장해 주세요. 나중에 다시 작업하고 싶을 때는 '📂 프로젝트 불러오기' 버튼을 이용하면 됩니다.

프로그램 하단에 있는 '프로젝트 저장' 및 '프로젝트 불러오기' 버튼을 사용하세요.

⚠️ 주의사항

프로그램을 업데이트하거나 다른 컴퓨터로 옮길 때는 `modern_tabs.json` 파일을 함께 옮겨야 해요! 이 파일 안에 여러분의 소중한 버튼 정보들이 모두 저장되어 있답니다.

버튼 만들기가 완성되었다면, 이제 블로그나 웹사이트에 적용할 HTML 코드를 생성할 차례입니다. 프로그램 하단에 있는 '🌐 HTML 생성' 버튼을 클릭하여 HTML 파일을 저장하고, '📋 소스 복사' 버튼으로 코드를 바로 복사할 수 있습니다. '👁️ 미리보기' 버튼을 누르면 완성된 페이지가 어떻게 보이는지 웹 브라우저로 바로 확인할 수 있어요. 저장된 HTML 파일들이 있는 폴더를 열어보고 싶다면 '📁 HTML 열기' 버튼을 이용하세요.

생성된 HTML 파일을 관리하는 다양한 기능들이 하단에 모여 있습니다.

📝 메모

HTML 생성 시 프로그램이 자동으로 'html'이라는 폴더를 만들고 그 안에 파일을 저장해 줍니다. 이 폴더에서 모든 생성 파일을 편리하게 관리할 수 있어요.

혹시 기존에 만들어 두었던 HTML 파일이 있다면, '📥 HTML 불러오기' 기능을 사용하여 프로그램으로 가져올 수 있습니다. 단일 HTML 파일을 가져오거나, 여러 개의 탭으로 구성된 폴더 전체를 가져올 수도 있어, 이전에 작업했던 내용을 다시 편집할 때 매우 편리합니다.

기존 HTML 파일이나 폴더를 불러와서 내용을 다시 편집할 수 있습니다.

자세한 버튼 만들기 가이드 보러 가기

3

알아두면 유용한 숨은 기능 (Pro-tips)

• 1. 입력 창에서 Ctrl+Enter로 확인하기

  프로그램의 모든 입력 창(예: 탭 이름 변경, 타이틀 추가 등)에서는 단순히 Enter 키를 누르면 줄바꿈이 되지만, Ctrl 키를 누른 상태에서 Enter 키를 누르면 바로 '확인' 버튼을 누른 것과 같은 동작을 합니다. 여러 줄을 입력할 때 편리하고, 입력 완료 시 빠르게 다음 단계로 넘어갈 수 있어요.

• 2. 나만의 아이콘 이미지 사용하기

  버튼 오른쪽의 아이콘은 단순히 이모지뿐만 아니라, 여러분의 컴퓨터에 있는 로컬 이미지 파일도 사용할 수 있습니다. '📁 로컬 파일 선택' 버튼을 눌러 원하는 이미지 파일을 지정해 보세요. 나만의 개성을 담은 버튼을 만들 수 있답니다!

• 3. 버튼 목록을 더블클릭하여 바로 수정하기

  만들어둔 버튼이나 중간 타이틀 목록에서 수정하고 싶은 항목을 더블클릭하면, 바로 편집 모드로 진입합니다. '수정' 버튼을 찾아 누르는 번거로움 없이 빠르게 내용을 변경할 수 있어요.

4

자주 묻는 질문 (Q&A)

Q. 프로그램을 실행했는데 아무것도 뜨지 않아요!

A. 대부분의 경우, 실행 파일(.exe)이 손상되었거나 바이러스 차단 프로그램에 의해 실행이 막힌 경우입니다. 프로그램을 다시 다운로드하여 시도해 보시고, 그래도 안 된다면 잠시 백신 프로그램을 끄고 다시 실행해 보세요. 문제가 계속되면 공식 문의 채널을 이용해 주시기 바랍니다.

Q. 만든 버튼 페이지를 제 블로그에 어떻게 넣나요?

A. '🌐 HTML 생성' 버튼으로 파일을 저장하거나, '📋 소스 복사' 버튼으로 HTML 코드를 복사한 뒤, 여러분의 블로그 플랫폼(티스토리, 네이버 블로그 등)의 'HTML 모드' 또는 '소스 편집' 기능으로 붙여넣기 하시면 됩니다. 자세한 방법은 각 블로그 플랫폼의 가이드를 참고해 주세요. (예: 티스토리 - 글쓰기 화면 우측 상단 '기본 모드' -> 'HTML')

Q. 로컬 이미지 아이콘이 미리보기에서는 잘 나오는데, 블로그에 붙여넣으니 깨져서 보여요.

A. 로컬 이미지는 여러분의 컴퓨터에만 저장되어 있기 때문에 가상 공간에 저장해두고 블로그스팟에서  버튼 페이지 소스를 넣으시면 자동으로 변환해서 아이콘 이미지가 보여집니다 

그러나 티스토리,워드는 이런기능이  없기때문에 로컬 아이콘을 사용하지 마시고 이모지로 추가하시면 얼마든지 편하게 사용하실수 있습니다

이제 '버튼페이지 디자이너'의 기본적인 사용법을 익히셨을 거예요. 이 프로그램은 여러분의 블로그나 웹사이트를 더욱 풍성하고 편리하게 만들어 줄 강력한 도구가 될 것입니다. 주저하지 마시고 지금 바로 여러분만의 멋진 버튼 페이지를 만들어 보세요! 다음 가이드에서는 탭과 버튼을 더욱 상세하게 디자인하는 방법을 알려드릴게요!