스타일 섹션을 사용하여 밴드 웹사이트 디자인을 사용자 지정하는 방법
게시 됨: 2021-10-13 스타일 섹션은 사이트의 콘텐츠를 강조하는 동시에 자신의 예술적 브랜드와 일관성을 유지하는 데 도움이 되는 정말 강력한 도구입니다. 사이트를 매력적으로 유지하기 위해 더 많은 이미지, 색상 및 레이아웃 옵션을 포함할 수 있는 많은 기회를 제공합니다.
섹션은 한 페이지 웹사이트에서 특히 유용할 수 있지만, 추가하는 기능에 주의를 기울이고 차별화하려는 웹사이트의 모든 페이지에 확실히 적용될 수 있습니다.
효과적인 약력, 훌륭한 음악 페이지 및 EPK와 같이 밴드 웹 사이트 디자인이 철저하고 전문적인지 확인하기 위해 포함해야 할 많은 측면이 있습니다. 음악 웹사이트를 만들고 주요 콘텐츠가 준비되면 좀 더 깊이 파고들어 일부 섹션을 사용자 지정하여 스타일에 맞는 웹사이트를 만들 수 있습니다.
훌륭한 웹사이트 디자인의 핵심은 사이트 방문자의 시선이 페이지를 따라 움직이도록 하는 것입니다. 색상, 질감 및 움직임의 변화는 사용자 정의 섹션 스타일을 통해 모두 달성할 수 있는 이 작업에 도움이 될 수 있습니다. 여기에서 생각해야 할 측면이 너무 많으며 다음과 같은 궁금증이 생길 수 있습니다. 너무 복잡하지 않으면서 콘텐츠를 돋보이게 하는 밴드 웹사이트 디자인을 만들 수 있습니까?
예! 핵심은 단색 구성표를 만들고 사이트 전체에서 사용할 수 있는 멋진 질감 이미지를 찾는 것입니다. 다음은 스타일이 지정된 섹션이 있는 아름다운 사이트를 만들기 위해 따라야 할 단계에 대한 안내입니다!
콘텐츠 구성
섹션은 본질적으로 기능을 추가할 수 있는 페이지의 공간 블록입니다. 섹션을 사용하여 항목을 범주별로 나누거나 페이지의 특정 기능을 강조하는 것이 좋습니다.
예를 들어, 스타일이 지정된 섹션을 사용하여 메일링 리스트 등록 기능에 주의를 환기시키거나 섹션을 3개의 열로 분할하여 홈 페이지에 멋진 클릭 유도문안을 위한 3개의 이미지 및 텍스트 기능을 추가할 수 있습니다. 이것은 아래의 예에서 볼 수 있습니다.
제어판의 모든 페이지에 섹션을 추가하는 것은 매우 간단합니다. "콘텐츠 편집"에서 페이지 레이아웃 위로 마우스를 이동합니다. 기존 섹션 위 또는 아래에 파란색 "+섹션 추가" 버튼이 표시됩니다.
새 섹션을 추가하려면 해당 버튼을 클릭하세요!
섹션의 왼쪽 상단에 있는 "열 편집" 버튼을 클릭하여 여기에서 각 개별 섹션의 열을 조정할 수도 있습니다. 왼쪽 또는 오른쪽 사이드바에 대한 몇 가지 비대칭 옵션과 함께 1, 2, 3개의 열 중에서 선택할 수 있습니다.
섹션 스타일 사용자 정의
좀 더 예술적인 감각을 위해 테마 편집 탭에서 최대 3개의 개별 섹션 스타일을 설정하십시오. 섹션 스타일은 섹션 배경과 텍스트, 링크 및 버튼 색상을 사용자 정의하는 곳입니다. 여기에서 사이트 섹션의 톤을 실제로 설정할 수 있습니다. 섹션 간에 고대비 색상을 설정하거나 더 미묘한 색상 차이를 선택할 수 있습니다.
나머지 밴드 웹사이트 템플릿 디자인 옵션과 마찬가지로 제어판의 "테마 편집" 탭에서 섹션 스타일을 조정합니다.
왼쪽의 테마 편집기 옵션에서 '섹션 스타일 1', '섹션 스타일 2' 및 '섹션 스타일 3' 옵션까지 아래로 스크롤하여 색상 설정을 선택하고 모든 것이 올바르게 설정되면 ' 저장'을 클릭하여 변경 사항을 적용합니다.
섹션 속성 설정
테마 편집 탭에서 섹션 스타일을 설정했으면 콘텐츠 편집 탭으로 돌아가 사이트의 섹션에 다른 속성을 적용할 수 있습니다. 섹션 위로 마우스를 가져간 다음 해당 섹션의 왼쪽 상단 모서리에 있는 "섹션 편집"을 클릭합니다. 조정할 수 있는 속성은 섹션 색상(설정한 섹션 스타일에서 가져옴), 배경 이미지 및 스크롤 효과, 섹션 패딩입니다.

섹션에 선택적 제목을 추가하고 이 제목의 정당성을 원하는 대로 조정할 수도 있습니다. 이 제목은 "메뉴에 표시" 스위치를 "켜기"로 전환하면 하위 메뉴 항목으로 추가할 수도 있습니다. 이것은 특정 페이지에 상당히 많은 콘텐츠가 있고 이 모든 콘텐츠에 더 쉽게 액세스할 수 있는 방법을 제공하려는 경우에 사용됩니다.
섹션 색상을 변경하려면 "섹션 색상"을 클릭한 다음 드롭다운 메뉴에서 섹션 스타일을 선택합니다.
섹션 패딩을 변경하려면 "섹션 패딩"을 클릭하고 없음, 작게, 중간, 크게 또는 매우 크게 중에서 선택합니다. 패딩은 섹션에서 콘텐츠의 상단과 하단에 더 많은 간격을 제공하고 세련된 모양을 위해 공백을 만들 수 있습니다.
이러한 모든 변경 사항을 저장하려면 "저장"을 클릭하십시오. 여기에 많은 가능성이 있기 때문에 아래 배경 이미지 옵션에 대해 자세히 설명하겠습니다!
배경 이미지 추가
섹션 배경 기능의 가능성은 추가된 질감, 깊이 및 개인 스타일로 무한합니다. 이론적으로 사이트의 모든 섹션에 배경 이미지를 설정하여 단색 블록 없이 완전히 이미지 기반이 되도록 할 수 있습니다. 이것은 매우 시각적인 사이트를 만들고자 한다면 정말 강력한 조치입니다.
이 작업을 수행할 때 응집력을 염두에 두는 것이 중요합니다. 이 모든 이미지가 유사한 색상 팔레트 내에 있고 세부 사항이 많지 않은지 확인하고 싶을 것입니다. 다음은 하늘과 구름의 다양한 이미지를 사용하여 만든 사이트의 예입니다. 하늘을 위한 진혼곡
섹션에 배경 이미지를 추가하려면 "섹션 편집"을 다시 클릭한 다음 "배경 이미지"를 클릭합니다. 여기에서 "이미지 추가"를 클릭하고 새 이미지를 업로드하거나 이미지 선택기에서 이미지를 선택합니다. "적용"을 클릭하십시오. 그런 다음 필요에 따라 이미지를 자르고 확대하고 저장을 클릭할 수 있습니다.
여기에서 이미지 투명도를 설정할 수 있습니다. 섹션의 내용에 따라 이미지 투명도를 낮은 비율(20% 미만)로 유지할 수 있습니다. 그러나 이미지가 여기의 내용에 방해가 되지 않는다면 꽤 올릴 수 있습니다. 여기 내 예에서는 투명도를 70%로 설정했습니다. 다른 섹션 스타일을 선택하여 색상 배경을 선택한 이미지와 결합할 수도 있습니다.
다음으로 스크롤 효과를 설정합니다. 이것을 생략하도록 선택할 수 있지만 아주 멋진 몇 가지 옵션이 있습니다. 시차 스크롤 효과는 배경 이미지가 페이지 자체와 약간 다른 속도로 스크롤되므로 깔끔한 3차원 효과를 제공합니다. 고정 스크롤 효과는 이미지를 배경에 고정하고 나머지 콘텐츠는 이미지를 가로질러 스크롤합니다. 필요에 따라 이것들을 가지고 놀 수 있습니다. 다시 "저장"을 클릭하여 이러한 변경 사항을 적용합니다.
사용자 정의 섹션 스타일로 재미있게 플레이하십시오!
이 예제에서 알 수 있듯이 섹션에서 제공하는 스타일 및 레이아웃 옵션은 작업하는 것이 매우 재미있습니다. 아름다운 음악 웹사이트를 쉽게 디자인할 수 있습니다. 당사 웹사이트 템플릿 중 많은 부분이 미리 제작된 스타일 섹션과 함께 제공되어 시작하는 데 도움이 되며 모두 모바일에서도 사용할 수 있습니다. 이 게시물을 통해 이 모든 가능성을 시도해 볼 수 있는 자신감을 얻었으면 합니다!
업데이트 및 유지 관리가 쉬운 전문적인 모바일 지원 웹 사이트를 몇 분 만에 디자인하십시오. 지금 Bandzoogle로 밴드 웹사이트를 만드세요!