KBoard로 만든 견적 폼
점심 시간을 활용하여 KBoard를 활용한 견적요청서 양식을 대강 마무리했습니다. (바쁜 와중에 이렇게 여유를 부리는 이유는 무엇일까요?)
고객이 입력하는 양식에는 다음과 같이 필드를 추가했고 우리나라 현실에 맞게 우편번호 검색란도 추가했습니다. 그리고 날짜를 지정할 수 있는 날짜 선택기(datepicker)도 간단한 jQuery로 구현했습니다.
그리고 가장 마음에 드는 것은 네이버 스마트 에디터를 추가하여 사진을 마음대로 추가할 수 있도록 했고 서식도 기본 에디터에 비해 더 편리하게 지정할 수 있습니다.
고객이 견적요청서를 제출하면 자동으로 비밀글이 되도록 설정했습니다.
양식을 제출한 후에 표시되는 본문을 보면:
위와 같이 출력 부분을 표로 재작성했습니다. 이 작업은 document.php 파일을 수정하면 됩니다.
참고
여러 가지 복합적인 항목이 구현되어 있네요. 이와 같이 만드시려면 다음의 글들을 참고하시기 바랍니다. (이렇게 만들다 보면 케이보드의 소스가 매우 복잡하게 수정되네요...)
- 워드프레스에 우편번호 검색창 추가하기
- 워드프레스에 jQuery 날짜 선택기 추가하기
- jQuery 날짜 선택기에서 두 번째 날짜가 첫 번째 날짜 이후에 선택되도록 하기
- KBoard에 네이버 스마트 에디터 추가하기
- KBoard에 “New” 라벨 추가하기
- KBoard에 새로운 텍스트 필드/목록 필드 추가하기
- 상위 항목의 옵션에 따라 하위 옵션 표시하기
- KBoard에 이용약관 동의 폼 추가 추가하기
- 폰트 Awesome을 사용하여 아이콘 추가하기
- 폼 필드 미리 채우기
추가 기능
처음 KBoard를 개조하여 견적서 양식을 만든 지 2개월 정도 지났네요. 처음 버전이 많이 미흡하여 몇 가지 테스트 기능을 추가했고 레이아웃도 나름대로 바꾸어보았습니다. 시간이 될 때 수정하는 방법을 정리하여 올려보겠습니다.
마치며
KBoard는 꽤 괜찮은 워드프레스 게시판 플러그인 같습니다. 약간의 PHP 지식과 CSS 지식이 있으면 쉽게 원하는 모양으로 변경이 가능한 유연성을 보여줍니다.
여기에서 소스를 다운로드받을 수 있습니다.
온라인 예약 플러그인이 필요한 경우 이 글을 확인해보시기 바랍니다.
안녕하세요? 견적서 폼이 케이보드랑 연동된 것 찾다가 방문하게 되었습니디. 지금도 활용이 가능한지요? 저도 자료 좀 받고 싶습니다.
안녕하세요, 김인형님. 이 글은 너무 오래되어 더 이상 자료를 이용할 수 없습니다. 대신 Contact Form 7 플러그인이나 Quform 등의 플러그인과 케이보드를 연동할 수 있습니다. 다음 글에 소소를 공개했으니 응용하여 적용해보시기 바랍니다.
https://www.thewordcracker.com/intermediate/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%BB%A8%ED%83%9D%ED%8A%B8-%ED%8F%BC-7%EA%B3%BC-%EC%BC%80%EC%9D%B4%EB%B3%B4%EB%93%9C-%EC%97%B0%EB%8F%99%ED%95%98%EA%B8%B0-%EC%86%8C%EC%8A%A4/
안녕하세요
안녕하세요?
날짜 선택기는 https://www.thewordcracker.com/kboard-download/kboard-quote-request-form-bootstrap-skin/ 글에 자세히 나와 있습니다.
그리고 2단으로 된 레이아웃은 코드를 변경하셔야 할 것 같습니다.
동일한 내용을 메일로도 보내드리겠습니다.
그럼, 즐거운 하루 되시기 바랍니다.
좋은 정보 감사합니다.
스킨 소스 파일은 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에서 다운로드가 가능합니다.
저도 소스를 얻고 실습니다. 주문양식 사용시 주소부분이 막혀서 고민중에 있습니다. ㅠㅠ 구글링중 오아시스를 발견한 느낌입니다.
메일로 보내드렸으니 확인바랍니다. 그럼, 즐거운 하루 보내세요^^
안녕하세요? 현재 업데이트된 스킨 소스를 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보실 수 있습니다. (나머지도 정리가 되는 대로 소스를 올릴 예정입니다.)
그럼, 즐거운 한 주 되시기 바랍니다.
안녕하세요! 찾다찾다 여기까지 왔는데 진심으로 유용한 정보가 많네요.
혹시 견적서양식 폼을 사용해 볼 수 있을까요. 깔끔하게 정리하신것 같아요~
안녕하세요? 제 블로그를 방문해주셔서 감사합니다.
테스트용으로 KBoard의 기본 레이아웃에 새로운 필드를 추가한 버전을 보내드릴 수 있습니다(참고: https://www.thewordcracker.com/quoterequestformv1/?mod=editor ). 기타 기능이나 레이아웃은 직접 수정하셔야 합니다. 특히 함수나 jQuery 관련 부분은 테마 함수를 수정해야 하기 때문에 기능에서 빠져 있습니다. 레이아웃은 원하는 레이아웃의 폼(양식)을 이용하여 수정이 가능합니다. (이 부분은 HTML에 대한 지식이 있으면 가능하고, 시간이 조금 소요되는 부분이지 어려운 부분은 아닙니다.)
테스트 버전(https://www.thewordcracker.com/quoterequestformv1/?mod=editor )을 원하시면 알려주시기 바랍니다.
예 가능하시면 보내주시면 감사하겠습니다~~^^
메일로 보내드렸으니 확인하시기 바랍니다. 그럼, 즐거운 하루 보내시기 바랍니다^^
안녕하세요?
현재 업데이트된 스킨 소스 파일을 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보실 수 있습니다. 나머지도 정리가 되는 대로 소스를 올릴 예정입니다.
그럼, 즐거운 한 주 되시기 바랍니다.
레이아웃이 정말 마음에 드네요 저도 한번 사용해 볼 수 있을까요?
안녕하세요?
현재 레이아웃은 정리가 되지 않았고요, 테스트용으로 기존 레이아웃에 새로운 필드를 추가한 버전을 보내드릴 수 있습니다(참고: https://www.thewordcracker.com/quoterequestformv1/?mod=editor ). 레이아웃은 원하는 등록 폼의 Html 소스와 CSS 코드를 사용하여 수정할 수 있습니다.
안녕하세요? 현재 코드를 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보시기 바랍니다. (나머지도 정리가 되는 대로 소스를 올릴 예정입니다.)
그럼, 즐거운 한 주 되시기 바랍니다.
와...능력자시네요 저도 한번 해볼수있을까요?
안녕하세요?
메일로 보내드렸습니다.
그리고 다음 페이지에서 케이보드를 활용한 다른 응용 예도 볼 수 있습니다:
https://www.thewordcracker.com/greenskin/?mod=editor
https://www.thewordcracker.com/whitepink/?mod=editor
즐거운 주말 되시기 바랍니다.
안녕하세요?
현재 업데이트된 스킨 소스 파일을 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보실 수 있습니다. 나머지도 정리가 되는 대로 소스를 올릴 예정입니다.
그럼, 즐거운 한 주 되시기 바랍니다.
안녕하세요?
저도 님께서 만드신 견적서게시판을 꼭 사용해 보고 싶습니다.
메일로 부탁 드립니다.
감사합니다.
안녕하세요?
메일로 보내드렸습니다. 새벽에 댓글을 올려주셨네요. 아마 우리나라가 아닌가 봅니다.
테스트해보시고 문제가 있으면 여기에 댓글로 알려주시기 바랍니다.
그럼, 즐거운 하루되세요^^
안녕하세요?
현재 업데이트된 스킨 소스 파일을 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보실 수 있습니다. 나머지도 정리가 되는 대로 소스를 올릴 예정입니다.
그럼, 즐거운 한 주 되시기 바랍니다.
안녕하세요 와... 대단하시네요 ^^
저도 정말 필요한 스킨인데 부탁좀 드려도 될까요?
꼭좀 부탁좀 드릴게요
안녕하세요?
제 블로그를 방문해주셔서 감사합니다.
이번주 금요일쯤에 일부를 수정하려고 생각 중에 있습니다. 금요일에 수정된 버전을 보내드리겠습니다. 그럼, 즐거운 하루 보내시기 바랍니다.
와 빠르고 친절한 답변 감사합니다 ^^
워드프레스로 이것저것 만져보고 있는데 재밌기도하고 어렵기도 하고 그러네요 ^^
여기 자주 찾아와서 배워야 겠어요
좋은 하루 되세요 ^^
안녕하세요?
요청하신 파일을 메일로 보내드렸습니다.
(일부 수정을 하려고 했는데 시간이 여의치 않아서 이전 버전을 그대로 보내드립니다.)
jQuery 관련 기능은 별도의 작업이 필요하기 때문에 소스에서 누락되어 있습니다.
그럼, 즐거운 주말되세요.
안녕하세요?
현재 업데이트된 스킨 소스 파일을 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보실 수 있습니다. 나머지도 정리가 되는 대로 소스를 올릴 예정입니다.
그럼, 즐거운 한 주 되시기 바랍니다.
안녕하세요?
현재 업데이트된 스킨 소스 파일을 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보실 수 있습니다. 나머지도 정리가 되는 대로 소스를 올릴 예정입니다.
그럼, 즐거운 한 주 되시기 바랍니다.
안녕하세요! 저도 이것저것 테스트중에 원하는 양식인데요. 저도 테스트해보고 피드백을 드리고싶습니다!
안녕하세요? 메일로 보내드렸으니 확인해보시기 바랍니다.
안녕하세요?
현재 업데이트된 스킨 소스 파일을 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보실 수 있습니다. 나머지도 정리가 되는 대로 소스를 올릴 예정입니다.
그럼, 즐거운 한 주 되시기 바랍니다.
견적요청서 양식 스킨 좀 얻을 수 없나요?
정말 필요한 스킨이네요
안녕하세요?
아래에 이메일 주소를 알려주시면 정리되는 대로 보내드리도록 하겠습니다.
참고로, 여러 가지 기능(특히 jQuery를 추가해야 하는 날짜 선택기)이 들어가 있기 때문에 추가 설정을 해줘야 제대로 작동합니다. 그리고 필드도 임의로 만든 것이기 때문에 필드를 사이트에 맞게 추가/삭제해야 할 것 같습니다. 또 하나는 CSS를 통해 레이아웃 조정 작업도 테마에 맞게 해주어야 합니다.
안녕하세요?
소스 파일을 메일로 보내드렸습니다.
적용해보시고, 혹시 문제가 있으면 알려주세요.
그럼, 즐거운 하루 되시기 바랍니다.
테스트. 코멘트 영역을 탭으로...
안녕하세요?
현재 업데이트된 스킨 소스 파일을 정리하여 https://www.thewordcracker.com/specificarea/kboard-skin-download/ 페이지에 올렸습니다. 살펴보시고 원하는 양식을 다운로드하여 테스트해보실 수 있습니다. 나머지도 정리가 되는 대로 소스를 올릴 예정입니다.
그럼, 즐거운 한 주 되시기 바랍니다.