디자인 모드 조작법 기초

그리드 시스템 이해하기

왼쪽 이미지와 오른쪽 이미지 중 어떤 것이 정리가 잘 되어 보이고 컨텐츠가 잘 보이나요?거의 모든 사람은 오른쪽을 택할 것입니다. 이는 간단한 그리드 시스템의 예시입니다.

그리드 시스템은 제일 처음 건축에서 개발단계에서 구획을 나눌 때 사용되었고 그후 타이포그래피에서 활용되다가 1930년경 신문잡지등에서 기사, 사진 등 각 컨텐츠등을 효율적으로 구성하기 위해사용되었습니다.

캠페이너스에도 레이아웃을 쉽고 빠르게 구성할 수 있도록 그리드 시스템이 도입되어 있습니다. 캠페이너스로 제작된 사이트는 12칼럼 그리드 구조로 만들어지며 객체의 이동이나 크기 조정은 전체 폭의 1/12(약 8.33%) 만큼씩 조정됩니다.

얼핏 과도하게 제한되는 것 같지만 대부분의 상황에서 적절한 레이아웃을 만들 수 있는 시스템입니다.

드래그로 요소 이동

디자인 모드에서 가장 많이 쓰이는 것 중 하나는 드래그입니다. 위젯을 원하는 위치로 이동을 시킬때 사용합니다.

대상을 좌/우로 이동시키는 것 뿐 아니라 상/하로도 이동시킬 수 있습니다.

참고: 위젯이 하나만 있을 땐 이동할 수 없습니다. 좌우로 이동할 때 같은 선상에 위젯이 하나만 있을 때도 이동할 수 없습니다.

드래그로 요소 크기 조정

위젯과 위젯 사이를 드래그하면 크기를 조정할 수 있습니다.

이미지 위젯, 지도 위젯, 여백 위젯과 같은 일부 위젯은 이미지 하단 가장자리를 드래그하여 크기 조정이 가능합니다. 어떠한 크기로 조정하더라도 비율은 자동으로 유지됩니다.

참고: 이동과 마찬가지로 좌우 크기 조정은 위젯이 단독으로 존재할 때 사용할 수 없습니다. 하나의 위젯을 단독으로 작게 표현하고자 할 땐 여백 위젯을 추가하여 조정하시면 됩니다.

수직 크기 조정은 그리드 단위가 아닌 픽셀 단위로 세밀하게 조정할 수 있습니다.

마우스 오른쪽 버튼

디자인 모드를 완벽하게 사용하려면 마우스 오른쪽 버튼을 사용하셔야 합니다. 각 위젯이나 섹션,상단 및 하단은 마우스 오른쪽 버튼을 눌러 설정화면에 진입하거나 각종 옵션을 빠르게 사용 할 수 있습니다.

참고: 각 위젯이나 섹션 오른쪽 상단에서  ⓘ 아이콘을 눌러도 같은 효과를 낼 수 있지만 편의성 측면에서 마우스 오른쪽 버튼 사용을 권장합니다.

복사 및 붙여넣기

컴퓨터의 파일 관리자에서 파일을 복사, 붙여넣기 하듯 위젯이나 섹션의 복사 및 붙여넣기가 지원됩 니다. 복사를 원하는 위젯이나 섹션에 마우스를 올린 후 오른쪽 버튼을 이용해 복사를 누른 후 같은 페이지 뿐 아니라 다른 페이지에도 붙여넣을 수 있습니다. (복사 및 붙여넣기는 단축키로는 지원하 지 않습니다)

즉시 저장

디자인 모드는 대부분의 설정이 즉시 저장됩니다. 따로 저장 버튼을 누르지 않아도 됩니다. 예를 들어 이미지 설명을 변경하고 바로 닫기를 눌러도 반영됩니다. 이는 불필요한 과정 없이 최대한 빠르게 원하는 결과물을 만들 수 있도록 의도된 것입니다.