brunch

You can make anything
by writing

C.S.Lewis

by oksambari May 20. 2020

스포츠 리그 운영 사이트

워드프레스 활용 이야기

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


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



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



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

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

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

(농구에 더 맞는 데이터를 입력할 수 있도록 도움)




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

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




3. 플러그인 설정 

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

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

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




4. 남은 할 일... 

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



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

좌: 워드프레스 기본 편집기 이용 / 우: 온라인 스코어보드




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


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


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

매거진의 이전글 오프라인 숍을 온라인 숍으로
작품 선택
키워드 선택 0 / 3 0
댓글여부
afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari