Toolset Real Estate 및 OceanWP를 사용하여 부동산 웹사이트를 구축하는 방법

부동산 웹사이트는 판매하는 주택만큼 안정적이고 신뢰할 수 있어야 합니다.

그러나 잘못된 도구 세트를 사용하는 경우 사용자가 즐겁게 사용할 수 있는 견고한 부동산 웹 사이트를 구축하는 것은 판매 중인 주택을 구축하는 것만큼 어려울 수 있습니다.

운 좋게도 Toolset Real Estate와 OceanWP를 결합하면 필요한 모든 기능을 갖춘 전문 부동산 웹사이트를 제공하는 것으로 입증되었습니다.

이 가이드에서는 다음 기능을 구축하는 방법을 보여줍니다.

• 다양한 속성 및 에이전트에 대한 사용자 정의 게시물 유형
• 욕실 수와 같은 정보를 추가하는 사용자 정의 필드
• 특징(단독 주택, 방갈로 등)에 따라 속성을 구분하는 분류법
• 동일한 구조로 속성을 표시하는 템플릿
• 속성 이미지를 표시하는 슬라이더
• 부동산 중개인을 담당 부동산과 연결하는 사후 관계
• 사용자가 자신에게 가장 적합한 부동산을 쉽게 찾을 수 있도록 검색
• 속성 및 검색 결과의 위치를 ​​​​표시하는지도
• 사용자가 자신의 부동산 목록을 제출할 수 있는 프런트 엔드 양식

이 단계를 읽으면서 수행하려면 Toolset 및 OceanWP에서 구축한 자체 무료 테스트 부동산 웹 사이트 를 사용할 수 있습니다.

Toolset Real Estate 및 OceanWP를 사용하는 이유

Toolset Real Estate는 여러 유형의 전문 웹사이트를 구축하는 데 필요한 모든 기능을 제공하는 Toolset의 일부입니다.

특히, Toolset Real Estate를 사용하면 부동산 웹사이트에 필요한 기능을 추가하기 위해 다른 플러그인이 필요하지 않습니다. 즉, 플러그인 호환성이나 수많은 플러그인으로 인해 웹사이트 속도가 느려지는지 여부에 대해 걱정할 필요가 없습니다.

한편 OceanWP는 비즈니스 웹사이트에서 가장 인기 있는 테마 중 하나입니다. OceanWP에서 운영하는 웹사이트는 더 나은 전환율, 더 빠른 로드 시간 및 향상된 SEO를 제공하므로 주택 구매자가 웹사이트를 쉽게 찾을 수 있습니다.

Toolset Real Estate와 OceanWP는 함께 원활하게 작동하므로 문제 없이 멋지게 보이는 강력한 웹 사이트를 구축할 수 있습니다.

Toolset 및 OceanWP를 사용하여 구축한 테스트 웹 사이트를 무료로 다운로드하여 실험할 수 있다는 것을 잊지 마십시오.

시작하는 데 필요한 것

Toolset으로 맞춤형 부동산 사이트를 구축할 때 다음과 같은 Toolset 플러그인이 필요합니다.

• 도구 집합 유형 – 속성 및 에이전트에 대한 사용자 지정 게시물 유형, 필드 및 분류 설정용
• 도구 집합 블록 – 사이트의 프론트 엔드 디자인(템플릿 및 속성 검색 등)
• 도구 집합 맵 – 맵에서 속성을 검색하고 표시할 수 있는 기능 추가
• 도구 집합 양식 – 에이전트가 사용자 정의 프런트 엔드 양식을 통해 속성을 관리할 수 있도록 합니다.
• 도구 집합 액세스 – 사이트 방문자, 클라이언트 및 에이전트가 액세스할 수 있는 부분을 제어하기 위해

이러한 구성 요소를 설치하고 등록했으면 부동산 웹 사이트 구축을 시작할 때입니다!

1. 사용자 정의 게시물 유형 만들기

먼저 사용자가 집을 보기 위해 어디로 가야 하는지 정확히 알 수 있도록 "집" 섹션에 대한 사용자 정의 게시물 유형을 만들어야 합니다.
1. WordPress 관리자의 도구 세트 → 대시보드 로 이동하여 새 게시물 유형 추가를 클릭합니다.

2. 이제 게시물 유형의 이름을 지정하고 관리자 메뉴에 표시할 위치에 저장해야 합니다.

3. 게시물 유형 저장을 클릭합니다.

그리고 그게 다야. 귀하의 주택 사용자 정의 포스트 유형이 준비되었습니다.

2. 사용자 정의 필드 생성

이제 사용자 정의 게시물 유형이 있으므로 일부 사용자 정의 필드를 추가해야 합니다. 우리의 사용자 정의 필드는 각 집과 그 특징을 설명하기 위해 채우고 싶은 섹션의 템플릿을 구성합니다.

예를 들어 욕실 수, 가격 및 건물이 지어진 연도에 대한 섹션이 필요합니다.

1. 도구 집합 대시보드에서 우리가 만든 "집" 사용자 정의 게시물 유형 옆에 있는 사용자 정의 필드 추가 를 클릭합니다.

2. 원하는 사용자 정의 필드 유형을 선택할 수 있는 새 필드 추가 상자가 나타납니다. 예를 들어 "빌드 연도"에 대한 사용자 정의 필드는 숫자입니다.

3. 각 필드에 대해 정보 입력의 필수 여부와 같은 옵션을 설정해야 합니다.

4. 필드에 대한 기본 옵션을 모두 입력했으면 새 필드 추가 를 클릭하여 그룹의 다음 필드로 이동합니다. 필드 그룹에 대한 모든 필드를 추가했으면 필드 그룹 저장을 클릭합니다.

이제 "집" 게시물을 편집할 때마다 채워야 할 필드가 표시됩니다.

3. 사용자 정의 분류 만들기

사용자 지정 분류는 속성을 구분하는 좋은 방법이므로 사용자가 기준과 일치하는 속성을 쉽게 찾을 수 있습니다. 예를 들어, 임대가 아닌 판매용 주택만 보고 싶은 경우입니다.

그 예를 들어, 판매용 주택과 임대용 주택을 구별하기 위해 분류법을 만드는 방법은 다음과 같습니다.

1. 도구 집합 대시보드 의 주택 행에서 사용자 정의 분류 추가 를 클릭합니다.
2. 상자에 다음을 입력하십시오
   1. 이름 복수형: 속성 유형
   2. 단수 이름: 속성 기능
   3. 슬러그: 속성 기능
3. 분류법을 계층적 또는 평면적할지 여부를 선택합니다. 이를 위해 우리는 평평하게 유지할 것입니다.
4. 분류법을 연결하려는 게시물 유형을 선택합니다. 이 경우에는 "하우스"가 됩니다.
5. 분류 저장을 클릭합니다.

이제 "Houses" 게시물 유형을 편집하거나 생성할 때 "Property type" 분류를 생성하고 선택하여 게시물 유형에 속성을 부여할 수 있습니다.

4. 속성을 표시할 템플릿 만들기

이제 속성을 표시하는 데 필요한 핵심 구성 요소가 있지만 프로세스의 중요한 부분이 남아 있습니다. 프론트 엔드에 어떻게 표시합니까?

여기에서 각각의 집을 표시하는 데 사용할 수 있는 템플릿을 만듭니다.

단일 "집"에 대한 템플릿을 구축하기 위해 WordPress 블록 편집기와 함께 도구 집합 블록을 사용합니다.

Toolset Blocks를 사용하면 사용자 정의 필드 및 분류를 사용하여 사용자 정의 게시물 유형에 대한 템플릿을 디자인할 수 있습니다. HTML, CSS, JavaScript, PHP가 필요하지 않습니다!

1. Toolset → Dashboard로 이동하여 Houses 행에서 Create Content Template 버튼을 클릭합니다.
2. WordPress 블록 편집기를 사용하여 템플릿을 디자인하십시오.
3. 필드(정적 요소 아님)를 표시하는 템플릿의 모든 부분에 대해 도구 집합 섹션에서 블록을 선택합니다. 예를 들어, 필드를 표시할 머리글에 대해 도구 집합의 머리글 블록을 사용합니다. Toolset은 WordPress 코어 및 가장 인기 있는 타사 플러그인에서도 동적 콘텐츠를 표시하는 옵션을 추가합니다.
4. 템플릿이 표시하는 게시물의 필드를 표시해야 하는 블록에 대해 동적 소스를 활성화합니다.

다양한 방법으로 템플릿을 수정하고 스타일을 지정할 수 있습니다. 예를 들어 열에 콘텐츠를 정렬하고 템플릿의 일부를 조건부로 표시하고 관련 게시물 목록을 표시하는 등의 작업을 수행할 수 있습니다.

5. 속성 이미지를 표시하는 동적 슬라이더 만들기

슬라이더는 각각의 이미지를 여러 개 표시하여 속성을 보여줄 수 있는 좋은 방법입니다.

Toolset을 사용하면 복잡한 PHP 코딩 없이 전환 기능이 있는 복잡한 슬라이더를 쉽게 만들 수 있습니다.

1. 페이지, 게시물 또는 템플릿을 편집하거나 생성했으면 보기 블록을 삽입하고 새 보기를 생성하십시오.
2. 보기 생성 마법사에서 페이지 매김을 활성화하고 보기 루프 스타일 선택 섹션에서 형식이 지정 되지 않은 (마지막) 옵션을 선택합니다.
3. 마지막 단계에서 게시물을 표시할 게시물 유형을 선택합니다.
4. 클릭하여 마법사를 마치면 보기가 준비됩니다.

게시물 필드 표시 및 사용자 지정 스타일 적용

1. 슬라이더에 배경을 추가할 수 있도록 컨테이너 블록을 삽입합니다. 예를 들어 슬라이드의 배경을 게시물의 추천 이미지에서 가져온 동적 이미지로 설정할 수 있습니다.
2. 도구 집합 블록을 사용하여 게시물 제목과 같은 다른 동적 필드를 슬라이더에 추가합니다.

도구 집합 슬라이더를 사용하면 게시물 필드를 표시하고 사용자 정의 스타일을 적용하는 것 외에도 보기 슬라이드를 자동으로 만들고 페이지 매김 스타일을 변경하는 것과 같은 다른 옵션을 사용하여 슬라이더를 조정할 수 있습니다.

6. 집과 에이전트를 연결하는 사후 관계를 만드십시오.

게시물 관계는 모든 웹사이트에서 중요하지만 과소평가된 부분입니다. 게시물 관계를 통해 다양한 유형의 콘텐츠를 서로 연결할 수 있습니다.

도구 집합 및 OceanWP를 사용하여 게시물 관계 생성에 대한 가이드를 확인하는 데 도움이 되는 방법에 대해 자세히 알아보세요.

부동산 웹사이트에는 주택과 부동산 중개인이 있습니다. 그들 사이에 포스트 관계를 만들어 봅시다.

게시물 관계 만들기

1. 도구 집합 → 관계 로 이동하여 상단의 새로 추가 를 클릭합니다.
2. 도구 집합 관계 마법사가 열립니다. 에이전트 및 자산의 경우 한 에이전트가 여러 자산을 담당하므로 "일대다 관계"를 원합니다.
3. 관계를 형성할 게시물 유형을 선택합니다.

4. 할당할 수 있는 게시물 수를 제한하려면 선택합니다. 예를 들어, 각 에이전트에 최대 20채의 주택만 할당되도록 할 수 있습니다.

5. 관계의 이름을 지정하십시오.

6. 관계를 검토하고 마침을 클릭합니다.

에이전트에 속성을 할당하는 방법

이제 부동산과 부동산 중개인 간의 특정 연결을 시작할 수 있습니다.

1. 관리 메뉴에서 상담원 페이지로 이동합니다.
2. 에이전트 속성이라는 페이지 하단에 새 섹션이 나타납니다. 기존 속성 연결 을 클릭한 다음 입력하여 속성 이름을 찾거나 사용 가능한 목록에서 선택합니다.

3. 업데이트 를 클릭하여 게시물을 저장합니다. 이제 에이전트 페이지를 방문하면 연결한 모든 속성이 나열됩니다. 또한 이러한 속성 페이지 중 하나를 편집하면 관계가 양쪽 끝에 표시되는 것을 볼 수 있습니다. 에이전트는 속성 페이지에도 나열됩니다.

게시물 관계를 표시하는 보기 만들기

게시물 관계 목록을 표시하는 방법에는 두 가지가 있습니다.

• 일대다 및 다대다 관계의 "다" 관련 게시물 목록을 표시합니다.
• 일대다 관계에서는 "일"쪽에 속하는 필드를 표시합니다.

많은 관련 항목 표시

이 예에서 에이전트에는 많은 속성이 있으므로 보기를 사용하여 표시합니다.

1. "에이전트" 콘텐츠 템플릿으로 이동합니다.
2. 뷰 블록을 삽입하고 새 뷰 생성
3. 필요한 게시물 유형(예: 속성)을 표시하려면 선택 하고 현재 에이전트에 속하는 속성 을 표시하는 옵션을 선택합니다.
4. 블록을 사용하여 보기의 출력을 디자인합니다. 보기가 이미 관련 게시물을 표시하도록 설정되어 있으므로 동적 콘텐츠를 표시하는 데 사용하는 블록에서 관계를 선택할 필요가 없습니다.

하나의 관련 항목 표시(상위)

1. "속성" 콘텐츠 템플릿으로 이동합니다.
2. 모든 도구 집합 블록을 사용하여 상위 정보를 표시할 수 있습니다.
3. 블록 속성에서 Post Source에서 부모를 선택합니다.
4. 표시할 필드를 선택합니다.

7. 사용자가 가장 잘 일치하는 속성을 쉽게 찾을 수 있도록 고급 검색을 추가하는 방법

고급 사용자 정의 검색은 사용자가 원하는 것을 정확하게 찾을 수 있는 가장 좋은 방법입니다. 여러 필터를 사용하여 개인 요구 사항에 따라 최상의 집을 선택할 수 있습니다.

1. 페이지에 보기 블록을 삽입하여 시작하십시오.
2. 보기 생성 마법사에서 검색 옵션을 활성화합니다.

3. 다음 페이지에서 이 보기에 표시할 콘텐츠 선택에서 "속성"을 선택합니다 .

4. 보기 생성 마법사를 마치면 보기의 편집 영역에 보기 검색 섹션이 있습니다. 사용 가능한 버튼을 사용하여 사용자 정의 검색 필드를 추가하거나 제출 및 재설정 버튼을 삽입하거나 다른 블록을 추가하십시오.

예를 들어 검색 필드 추가 를 클릭 하고 필드 선택 드롭다운을 사용할 수 있습니다. 사용자가 검색할 수 있는 콘텐츠 유형을 선택하고 다음 을 클릭합니다.

5. 이제 오른쪽 사이드바를 사용하여 이 검색 필드에 대한 옵션을 조정할 수 있습니다. 여기에는 기본 필드 설정, 레이블 및 스타일 옵션이 포함됩니다.

6. 이제 결과가 표시될 섹션을 만들 준비가 되었습니다. 편집기의 보기 루프 영역에 블록을 추가하여 이를 수행합니다.

7. 블록 추가 를 클릭합니다.

8. 검색 결과의 일부로 사용할 블록을 선택합니다. 예를 들어, 제목 블록을 사용하여 검색 결과에 속성 제목을 표시할 수 있습니다.

8. 부동산의 위치를 ​​​​표시하는지도 표시

지도는 사용자가 부동산의 정확한 위치를 즉시 이해하도록 돕는 훌륭한 방법입니다.

1. 지도 만들기를 시작하려면 지도를 표시할 페이지나 템플릿으로 이동합니다. 도구 집합 맵 블록을 삽입합니다. API 키를 설정해야 하는 경우 Google에서 설정 방법에 대한 자세한 지침을 제공합니다.
2. 마커 섹션의 소스에서 동적 소스 를 활성화합니다.
3. 게시물 소스 드롭다운에서 "현재 속성"을 선택합니다. 그런 다음 소스 드롭다운에서 지도에 표시할 주소가 포함된 사용자 정의 필드를 선택합니다.

9. 사용자가 자신의 콘텐츠를 제출할 수 있는 프런트 엔드 양식 작성

마지막으로 사용자가 부동산 웹사이트에 광고하기 위해 자신의 목록을 제공하기를 원할 수 있습니다. 이를 수행하는 가장 쉬운 방법 중 하나는 작성하려는 모든 필드가 포함된 프런트 엔드의 양식을 사용하는 것입니다.

Toolset의 끌어서 놓기 편집기 덕분에 양식 생성이 이보다 더 간단할 수 없습니다.

1. 도구 집합 → 게시 양식으로 이동하고 새로 추가를 클릭합니다.
2. 양식 마법사에서 계속 을 클릭하고 양식 이름을 입력하십시오.
3. 다음을 포함하여 양식에 대한 설정을 편집합니다.
   1. 제출물을 추가할 게시물 유형
   2. 제출된 게시물의 상태
   3. 사용자가 양식을 제출한 후 표시되는 내용(아래에서 수행한 것처럼 메시지를 추가할 수도 있음)

4. 이제 끌어서 놓기 편집기에 도달하여 어떤 필드를 어디로 이동할지 결정할 수 있습니다. 여기에서 CSS 편집기 및 JS 편집기 필드를 사용하여 양식의 스타일을 지정할 수도 있습니다. 추가할 수 있는 추가 요소도 많이 있습니다.

5. 다음 페이지에서 사용자나 편집자가 어느 단계에서나 수신할 이메일 알림을 추가할 수 있습니다. 아래에 목록이 게시될 때 사용자에게 보낼 이메일을 추가했습니다.

6. 마침 을 클릭하면 이제 양식을 표시할 준비가 되었습니다.

7. 양식을 표시하려면 양식을 추가하려는 페이지로 이동하여 도구 집합 양식 블록을 추가하고 드롭다운 목록에 대해 방금 생성한 양식을 선택하기만 하면 됩니다.

다음 단계

자신의 부동산 웹사이트를 구축하기 위한 이 9가지 주요 단계를 완료했다면 Toolset의 부동산 온라인 과정을 수강하여 사이트를 더욱 인상적으로 만들 수 있습니다.

이해하기 쉬운 모듈은 유용한 비디오로 가득 찬 포괄적인 단계별 가이드를 구성하여 놀라운 부동산 웹 사이트를 구축하기 위해 알아야 할 모든 것을 알려줍니다.

부동산 웹 사이트를 구축한 경험은 무엇입니까? 댓글로 알려주세요!