[NEW] 웹 디자인의 인터랙티브 서클: 코딩 없이 Elementor에서 생성하는 방법
게시 됨: 2021-12-29텍스트가 많은 웹사이트는 보기에 좋지 않을 수 있습니다. 웹 사이트가 너무 많은 텍스트와 적은 시각적 구성 요소로 구성된 경우 Essential Addons의 대화형 원 을 사용하고 매력적인 원형 패턴으로 콘텐츠를 표시할 수 있습니다. 이 놀라운 위젯을 사용하여 최소한의 공간에 많은 콘텐츠를 표시하는 방법에 대해 자세히 알아보겠습니다.
웹사이트에 대화형 서클 위젯이 필요한 이유는 무엇입니까?
웹 디자이너에게 웹 사이트를 보다 인터랙티브하고 동시에 사용자의 입장에서 편리하게 만드는 것은 어려운 일입니다. 웹사이트에 텍스트 기반 콘텐츠가 많이 포함되어 있으면 올바른 방식으로 제공하기가 더 어려워집니다.
연구에 따르면 거의 38%의 사람들 이 매력적이지 않은 디자인 레이아웃이 있는 웹사이트의 참여를 중단합니다. 이 경우 웹사이트의 트래픽도 웹사이트 디자인에 따라 달라집니다. WordPress 웹 사이트에서 Essential Addons의 대화형 서클 위젯을 사용하여 텍스트 기반 콘텐츠를 효과적으로 디자인할 때 얻을 수 있는 모든 이점을 살펴보겠습니다.
웹사이트 콘텐츠의 애니메이션 프레젠테이션
웹사이트에 텍스트 기반 콘텐츠가 많이 포함되어 있어도 방문자를 끌어들이고 쉽게 확인할 수 있도록 매력적인 방식으로 제공할 수 있습니다. 웹사이트 자료를 표시하는 데 일반적으로 다른 패턴이 있으므로 약간의 움직임이 방문자의 관심을 끄는 데 도움이 될 수 있습니다. Essential Addons 의 Interactive Circle 위젯을 사용하면 애니메이션 패턴으로 텍스트 기반 콘텐츠를 선보이고 섹션을 더 매력적으로 보이게 할 수 있습니다.
귀하의 웹사이트를 위한 인터랙티브 및 반응형 디자인
반응형 디자인이 없으면 사용자가 검색 엔진에서 웹사이트를 찾거나 콘텐츠를 읽거나 웹사이트를 탐색하는 것이 어려울 수 있습니다. 레이아웃 결함, 이미지 불량, 텍스트가 너무 작거나 인포그래픽이 너무 많아 웹사이트가 어수선해 보이기 때문일 수 있습니다. 데스크탑이나 랩탑 컴퓨터를 사용하는 경우 모서리를 클릭하고 끌어 이 창의 크기를 조정할 수 있습니다.
Essential 애드온의 대화형 원형 위젯을 사용하면 웹사이트를 위한 동적 디자인을 더 쉽게 만들 수 있습니다 . 웹사이트 방문자가 웹사이트에 액세스하는 데 사용하는 장치의 종류에 관계없이 이 위젯을 사용하여 텍스트 기반 콘텐츠를 표시하면 디자인이 손상되지 않습니다.
아름다운 웹사이트를 만드는 인터랙티브 서클 위젯
이 위젯을 사용하여 텍스트 기반 콘텐츠를 매력적인 원형 동작으로 표시하여 웹사이트 사용자의 관심을 끌 수 있습니다. 예를 들어 콘텐츠 메뉴를 제공하려는 경우 대화형 서클을 사용하여 공간을 절약하면서 콘텐츠를 표시할 수 있습니다. 이런 식으로 간단한 텍스트 기반 콘텐츠가 더 매력적으로 보일 것입니다. Essential Addons 플러그인으로 Interactive Circle 위젯을 얼마나 쉽게 시작할 수 있는지 알아보겠습니다.
필수 애드온으로 인터랙티브 서클을 사용하는 데 필요한 것들
Elementor : Interactive Circle Widget을 사용하려면 먼저 Elementor를 설치하고 활성화해야 시작할 수 있습니다.
Elementor용 필수 애드온 : 'Interactive Circle' 위젯을 사용하려면 웹사이트에서 Elementor용 필수 애드온을 설치하고 활성화 해야 합니다 .
1단계: 필수 애드온 대화형 서클 위젯 활성화
Essential Addons 의 'Interactive Circle ' 위젯 을 사용하여 웹사이트를 보다 인터랙티브하고 매력적으로 만들어 봅시다 . 이 플러그인의 최신 버전을 사용하고 있는지 확인하기만 하면 됩니다.
Interactive Circle 위젯은 Elementor에서 활성화되어야 합니다. WordPress 대시보드의 Essential Addons Elements로 이동하여 ' Interactive Circle ' 위젯이 켜져 있는지 확인하세요. 변경 사항이 저장되었는지 확인하려면 ' 설정 저장 ' 버튼을 클릭하십시오.
Elementor 의 'Elements' 탭에서 ' Interactive Circle ' 위젯을 찾으 세요. 텍스트 기반 콘텐츠를 표시하려는 위치에 요소를 끌어다 놓습니다.
2단계: 콘텐츠 설정 사용자 지정 시작
이 위젯을 사용하면 기본 콘텐츠를 사용자 정의하고 자신의 콘텐츠를 추가할 수 있습니다. 일반 탭의 옵션에서 레이아웃을 설정할 수 있습니다. Interactive Circle 위젯은 미리 준비된 4개의 레이아웃 과 함께 제공됩니다 . 레이아웃을 사용해 보고 어떤 것이 텍스트 기반 콘텐츠에 가장 적합한지 확인하십시오.
EA Interactive Circle 위젯의 버튼에 아이콘을 표시할지 아니면 텍스트를 표시할지 선택할 수도 있습니다. 아이콘과 텍스트를 숨기거나 표시하려면 '버튼' 설정에서 각각 ' 아이콘 표시 ' 및 ' 텍스트 표시' 옵션을 토글합니다. 이 위젯은 많은 사용자 정의에 매우 편리합니다. 옵션에서 선택하고 원하는 대로 원형 메뉴를 만들 수 있습니다.
이 위젯을 사용하는 가장 중요한 부분은 자신의 콘텐츠를 제공하고 필요에 따라 더 많은 순환 옵션을 추가할 수 있다는 것입니다. '콘텐츠' 설정 에서 EA Interactive Circle 위젯으로 표시할 항목 수를 추가할 수 있습니다 . 새 항목을 추가 하려면 ' + 항목 추가 ' 버튼을 클릭하기만 하면 됩니다. 같은 방법으로 설정에서 항목을 제거하거나 복사할 수 있습니다. 그러나 디자인을 위해 한 번에 최대 8개의 옵션만 추가할 수 있습니다. 그렇지 않으면 시퀀스가 깨집니다.
'버튼 ', '컨텐츠 ', '스타일 '의 세 가지 탭이 있습니다 . 항목에 대한 아이콘을 추가하고 '버튼' 탭의 ' 짧은 제목 ' 입력 필드에서 제목을 편집할 수 있습니다. 마찬가지로 '콘텐츠' 탭에서 항목에 콘텐츠를 추가하고 '스타일' 탭 에서 항목에 배경색을 추가할 수 있습니다 .
' 추가 설정 ' 옵션에서 추가 설정 옵션을 받아 EA Interactive Circle 위젯을 보다 동적으로 만들 수 있습니다. ' 마우스 이벤트 ' 옵션 에서 '클릭' 과 '호버' 상호작용 중에서 선택할 수 있습니다 . 또한 ' 추가 설정 ' 옵션을 사용하여 세련되고 눈길을 끄는 애니메이션을 추가 할 수도 있습니다 . 아래 그림과 같이 선택할 수 있는 세 가지 애니메이션 스타일이 있습니다.
3단계: 대화형 텍스트 기반 콘텐츠 스타일 지정
EA Interactive Circle 위젯에는 다양한 스타일 옵션이 있습니다. 이 옵션은 모든 사람의 대화형 서클 측면에서 큰 차이를 만들 수 있습니다. 배경색, 텍스트 패턴 또는 색상, 원 너비, 패딩 또는 병합을 변경하여 모양을 변경할 수 있습니다.
' 항목 ' 설정에서 EA Interactive Circle의 각 항목에 대한 타이포그래피를 변경할 수 있습니다. 각 항목의 너비와 아이콘 크기도 조정할 수 있습니다. 배경색, 텍스트 색상, 아이콘 색상 및 기타 여러 가지를 변경할 수도 있습니다.
대화형 서클의 모양에 만족하면 이제 페이지를 게시할 수 있습니다. 이 주제에 대해 만든 Elementor 대화형 서클을 살펴보세요.
보시다시피, Elementor용 Essential Addons를 사용하면 멋진 Interactive Circle을 만들고 웹 페이지를 매우 단순한 방식으로 더욱 매혹적인 방식으로 바꿀 수 있습니다.
마지막으로, 우리는 지속적인 개선의 가치를 굳게 믿습니다. 이를 염두에 두고 우리는 Elementor 업데이트를 위한 환상적인 새로운 Essential Addons 를 제공하기 위해 열심히 노력하고 있으므로 Elementor로 훨씬 더 나은 웹사이트 디자인 경험을 할 수 있습니다.
그래서, 당신은 무엇을 잃을 필요가 있습니까? 가능한 한 빨리 Essential Addons 5.0으로 업데이트하여 Interactive Circle 위젯을 포함한 모든 새로운 고급 위젯과 확장 기능을 활용하십시오.
직접 사용해 보고 질문이 있는 경우 지원 팀 에 문의하세요 . 최신 Elementor 애드온, 웹 디자인 튜토리얼, 팁 및 트릭 등에 대한 자세한 내용은 블로그를 구독 하거나 친근한 Facebook 커뮤니티 에 가입하세요.