워드프레스 아바다 퓨전빌더 엘리먼트 - 3. 버튼

이번엔 워드프레스 퓨전빌더 엘리먼트의 세번째에 있는

버튼에 대해 파해쳐보자

기존 TEST 페이지에 엘리먼트를 추가해주고,

"버튼"을 선택

이건 솔직히 테스트를 안해보더라도 어떤 기능인지 감이 잡힌다..

그래서 간단히 설명해보도록 하겠다

버튼을 클릭했을때 현재 워드프레스의 다른 페이지로 이동할 것인지

아니면 외부 홈페이지도 상관없고 URL과 버튼에 표기될 이름을 정해준다

_self는 현재페이지에서 이동

_blank는 새탭, 새페이지를 열어서 이동

기본적인 설정은 여기까지가 끝인데.. 모달 팝업이라..

얼마전에 팝업메이커라는 플러그인을 설치해서 로그인창을 만들었었는데..

굳이 새로운 플러그인을 추가할 필요없이 퓨전빌더에서도 지원하는건가..

엘리먼트 항목에도 있던데, 요것도 나중에 다뤄보도록 하겠다ㅠㅠ

---

이제 버튼의 디자인을 바꿔보는데 기본적인 색상은 좀 그닥이다..

사용자정의로 자신의 홈페이지 배경과 어울리는 색상을 찾아서 바꾸는게 좋을듯

녹색 / 오렌지 / 파랑 / 빨강 / 핑크 / 짙은회색

---

3D는 뭔가 좀 옛날 홈페이지같은 촌스러운 느낌이고..

그냥 평면이 나아보이는듯

---

말 그대로 버튼의 사이즈를 정하는것인데 이건 따로 사용자정의로 크기조절을 못하는게 아쉽다

이미지삽입처럼 가로세로길이 편집메뉴가 있으면 좋을텐데

아마 버튼추가속성 설정에서 HTML태그를 넣어줘야하는듯(?)

Small / Medium / Large / X-Large

---

버튼의 폭은 현재 칼럼에서 좌우를 꽉 채울건지

기본사이즈로 보여질것인지 정하는 부분이다

---

이건 말로 설명하는것보단 그냥 아래 버튼의 예시와 비교하면 더 이해가 빠르다

와인아이콘 / 하트아이콘(아이콘우측) / 볼륨아이콘(아이콘분리선)

---

마지막으로 애니메니션 설정인데..

버튼 애니메이션은 알림, 경고 엘리먼트와 달리

마우스 오버시에 동적인 표현을 보여줄거라 기대했지만..

이것또한 페이지 첫 로딩시에만 표현되고 그 후엔 똑같다..

TEST페이지에서 6종류의 애니메이션을 골라 적용해보았다