brunch

스포츠 리그 운영 사이트

워드프레스 활용 이야기

by oksambari

jQuery와 php, MySql을 막 접할 때 즈음 이걸 좀 활용해 봐야겠다 싶어서 만들기 시작한 게 좋아하는 농구용 웹 스코어보드(터치해서 기록 입력)와 이를 토대로 한 데이터 저장 및 활용을 할 수 있는 사이트이었습니다. 화면 표시는 어찌 되었든 조건을 체크해서 계산만 잘하면 구현이 되었는데 이걸 디비에 저장하고 하나의 경기 외에 전체 선수의 데이터와 팀, 나아가 리그 운영에 이르기까지 연결 고리들을 구현을 할 게 굉장히 많았던 터라 당시 혼자 힘으로는 감당이 안 되는 것이더라고요. 마침 그 때 워드프레스를 접하고 잠시 미뤄뒀던 프로젝트가 됐습니다.


몇 년 후 워드프레스 모임 뒤풀이에서 얘길 나누던 중 관련 플러그인이 있을 거 같다는 힌트를 얻어서 검색해 보니 과연 이미 잘 만들어진 플러그인이 존재를 하는 겁니다. > sportspress 그 땐 참 허무하기도 하고 기쁘기도 하고... (서론 끝)



그럼, 스포츠 리그용 사이트를 만드는 과정을 간략하게 소개해 드리겠습니다.



1. 플러그인 설치 및 옵션 세팅

sportspress는 무료 버전도 괜찮지만 더 많은 기능을 위해서는 유료 버전을 추천합니다. 설치 후 플러그인을 활성화하면 세팅을 위한 화면으로 자동 넘어가게 되며, 간단한 몇 단계의 설정만 마치면 기본적인 설정은 끝나게 됩니다.

Cap 2020-05-20 14-10-35-994.png
Cap 2020-05-20 14-11-56-012.png
Cap 2020-05-20 14-13-30-522.png
Cap 2020-05-20 14-14-24-883.png
Cap 2020-05-20 14-14-51-151.png
Cap 2020-05-20 14-15-09-635.png

과정중 농구를 선택하고 설정을 완료하면 기능을 좀 더 확장한 익스텐션을 하나 더 추가하도록 안내합니다.

Cap 2020-05-20 20-16-02-634.png (농구에 더 맞는 데이터를 입력할 수 있도록 도움)




2. (플러그인 호환) 테마의 설치

플러그인 활성화가 되면 이 플러그인과 잘 호환이 되는 테마를 설치 권장해 줍니다. 링크를 클릭해서 설치합니다. Themeforest에서는 이 플러그인과 호환이 되는 유료 테마들도 판매를 하고 있습니다. 너무 화려해서 일단 패스...

Cap 2020-05-20 20-02-05-213.png




3. 플러그인 설정

워드프레스의 포스트 타입을 토대로 이 플러그인 개발자들은 아래와 같은 연결 고리들을 만들어 놨습니다. 전체 리그나, 팀, 선수, 시즌을 한눈에 파악하면서 세팅을 할 수 있습니다.

Cap 2020-05-20 20-20-57-514.png
Cap 2020-05-20 15-32-38-313.png

데이터를 처음부터 입력하며 테스트를 하기보다는, 각종 데모 데이터를 미리 불러오면 전체적인 데이터 구조를 파악하는 데 도움이 됩니다.

Cap 2020-05-20 20-22-20-407.png
FireShot Capture 109 - Fixtures & Results – Sportspress - localhost.png

! 다가오는 일정, 지난 결과, 경기 결과 세부 페이지, 각 선수의 기록들을 링크로 순환되도록 화면을 제공할 수 있습니다. 리그와 시즌 외에 팀들을 묶어서 토너먼트를 진행할 수도 있고요.




4. 남은 할 일...

코어 데이터 구조가 완료가 되었으니, 나머지는 사이트의 디자인이나 유저의 가입 및 커뮤니티 구성에 대한 적용 등이 있습니다. 여기서부터는 일반 회원 가입형 워드프레스 사이트의 구조와 같아서 생략합니다.

Cap 2020-05-20 20-39-18-232.png



더하여 개인적으로 남은 숙제는 온라인 스코어보드로 작성한 데이터를 워드프레스 포스트 데이터 형태로 자동 저장을 하는 방법을 구현하는 것입니다. 여기까지하면 처음 마음 먹었던 사이트를 워드프레스를 통해 완성을 할 수 있게 될 거 같습니다.

Cap 2020-05-20 15-35-52-377.png
Cap 2020-05-20 20-33-15-895.png
좌: 워드프레스 기본 편집기 이용 / 우: 온라인 스코어보드




위 내용도 결국은 워드프레스의 기본 포스트 데이터 형식을 응용하여 개발을 해 놓은 것입니다. 워드프레스라서 한계가 있는 것이 아니고, 구조를 어떻게 활용하는지만 다를 뿐 워드프레스도 일반 웹사이트 개발과 크게 다르지 않을 것으로 여겨집니다. (쓸 데 없는 글이 잠시 의식이...)


워드프레스로도 스포츠 리그를 운영하는 멋진 사이트를 만들 수 있으니 혹 리그 운영 사이트가 필요하신 분이 있다면 참고해 보시길 바랍니다. 아마 농구도 더 재밌어질 그 날을 기대하며... =)


다양한 활용 사례는 여길 참고해 보세요. > https://www.themeboy.com/showcase/

keyword
매거진의 이전글오프라인 숍을 온라인 숍으로