윅스 (Wix) 코딩 - 반복 레이아웃에 데이터베이스 내용 표시하기 (About Displaying Database Content in a Repeater)

윅스 (Wix) 코딩 - 반복 레이아웃에 데이터베이스 내용 표시하기 (About Displaying Database Content in a Repeater)

 

 

 

설명)

 

반복 레이아웃에 데이터베이스 콘텐츠를 표시하는 방법을 보려면 여기를 클릭합니다.

 

 

반복 레이아웃은 동일한 레이아웃을 사용하여 여러 항목을 표시하는 요소입니다. 원하는 레이아웃을 만든 다음 각 반복 레이아웃 항목은 동일한 레이아웃을 사용하여 다른 내용을 표시합니다. 반복 레이아웃 항목은 컨테이너처럼 작동합니다. 다른 요소를 첨부합니다. 하나의 반복 레이아웃 항목에 대한 변경 사항은 다른 모든 항목에 자동으로 반영됩니다.

 

반복 레이아웃을 사용하여 정적 컨텐츠를 표시할 수 있습니다. 즉, 에디터의 각 항목에 있는 각 요소의 콘텐츠를 수동으로 결정합니다.

 

반복 레이아웃 및 연결된 요소를 데이터세트에 연결하여 데이터베이스 컬렉션의 콘텐츠를 동적으로 표시할 수도 있습니다. 그러면 반복 레이아웃은 컬렉션의 각 항목에 대해 하나의 항목을 포함하며 각 반복 레이아웃 항목은 동일한 템플릿을 사용하지만 다른 내용을 표시합니다. 데이터세트 설정에서 한 번에 표시되는 항목 수를 제어합니다.

 

중요 :

반복 레이아웃에 동적 콘텐츠를 표시하려면 먼저 반복 레이아웃을 데이터세트에 연결한 다음 반복 레이아웃의 특정 요소를 데이터세트에 연결해야 합니다.

아래는 몇 가지 가능성을 보여주는 예입니다.

 

 

 

예제 )

아래 그림과 같이 모든 요리법을 컬렉션에 저장하는 요리법 사이트가 있다고 가정해보겠습니다. 여기에는 각 음식의 그림, 요리 및 제공되는 과정이 포함됩니다. 각 요리법에 대한 정보를 표시하는 동적 항목 페이지를 이미 만들었습니다.

 

 

 

 

 

 

 

이제 반복 레이아웃를 사용하여 요리법을 나열하고 방문자가 목록을 스크롤하여 관심있는 음식을 찾을 수 있습니다. 방문자가 음식의 이미지를 클릭하면 해당 항목의 동적 페이지로 이동합니다. 아래 이미지는 반복 레이아웃의 모양을 보여줍니다. 그것은 음식의 사진, 제목, 요리 및 음식이 제공되는 과정을 보여줍니다. 사진은 해당 항목의 동적 페이지로 연결됩니다.

 

 

 

 

 

반복 레이아웃 추가 및 구성 (Adding and configuring your repeater)

좋아하는 반복 레이아웃 디자인을 선택하여 우리 페이지에 추가하는 것으로 시작합니다. 더 많은 열을 포함하도록 반복 레이아웃의 너비를 늘리거나 더 적은 열을 갖도록 반복 레이아웃의 너비를 줄입니다. 한 항목의 여백을 끌어서 반복 레이아웃 항목의 크기를 변경합니다.

 

반복 레이아웃 항목에서 기존 요소를 이동하고 원하지 않는 요소를 제거합니다. 반복 레이아웃, 특히 텍스트, 이미지, 버튼, 상자, 도형, 화랑 및 표(Table)에 새 요소를 첨부할 수도 있습니다.

 

반복 레이아웃에서 한 항목의 디자인이나 위치를 변경하면 모든 항목에 자동으로 반영됩니다.

 

아래 그림은 에디터에서 반복 레이아웃가 어떻게 보이는지 보여줍니다. 반복 레이아웃 항목이 2개 밖에 없다는 것에 유의합니다. 반복 레이아웃 크기가 데이터세트에서 제어되기 때문에 더 이상 필요하지 않습니다. 두 반복 레이아웃의 항목이 모두 동일한 지에도 유의합니다.

 

 

 

팁 :

큰 요소를 추가할 때는 먼저 페이지에 추가하고 크기를 조정합니다. 그런 다음 반복 레이아웃 영역으로 드래그합니다. 'Attach to item'가 표시되면 요소를 첨부시킬 수 있습니다.

 

 

 

 

반복 레이아웃를 데이터세트에 연결하기 (Connecting your repeater to a dataset)

동적 컨텐츠를 표시하려면 repeater를 데이터 세트에 연결해야합니다.

 

반복 레이아웃가 데이터세트에 연결되면 연결된 컬렉션에서 정보를 검색할 수 있습니다. 또한 표시할 항목 수와 일치하도록 크기를 조정합니다. 데이터세트 설정 패널의 "Number of items to display" 입력란(필드)에서 이 값을 제어할 수 있습니다.

 

 

 

반복 레이아웃의 요소를 데이터세트에 연결하기 (Connecting elements in your repeater to a dataset)

다음으로 첨부된 요소를 데이터세트에 연결합니다. 한 항목의 템플릿을 변경하면 자동으로 모든 항목에 반영됩니다. 따라서 하나의 반복 레이아웃 항목에서만 작업해야 합니다.

 

텍스트 또는 기타 요소가 각 반복 레이아웃 항목에 동일한 내용을 표시하게 하려면 단순히 데이터세트에 연결하지 않습니다. 각 항목에서 동일한 라벨을 유지하려고 한다고 가정해보겠습니다. 텍스트 요소에 텍스트를 입력한 다음 데이터세트에 연결하지 않은 상태로 둘 수 있습니다.

 

위의 예에서 이미지 요소는 컬렉션의 사진 입력란(필드)에 연결되어 있으며 해당 요리법의 동적 항목 페이지로 연결됩니다. <Name of Dish>, <course> 및 <Cuisine> 텍스트 요소는 컬렉션의 일치하는 입력란(필드)에 연결되므로 동적 내용을 표시할 수 있습니다. "Cuisine :"텍스트 요소는 데이터세트에 연결되어있지 않으므로 각 텍스트 항목이 각 반복 레이아웃 항목에 표시됩니다.

 

 

 

 

반복 레이아웃 항목의 배경 이미지 변경하기 (Changing the background image of repeater items)

반복 레이아웃 항목의 배경 이미지를 데이터세트의 이미지 입력란(필드)에 연결하여 각 항목에 다른 배경 이미지를 표시할 수 있습니다. 아래 그림은 Recipes 컬렉션의 사진 필드에 배경 이미지가 연결되었을 때 우리 반복 레이아웃가 어떻게 보이는지 보여줍니다. 요리법 이름과 요리법의 동적 아이템 페이지로 연결되는 버튼을 추가했습니다.

 

 

 

반복 레이아웃 탐색하기 (Navigating through a repeater)

반복 레이아웃이 기본적으로 표시하는 항목 수는 반복 레이아웃에 연결된 데이터세트의 데이터세트 설정에 의해 제어됩니다. 이것을 반복 레이아웃 페이지라고 부릅니다.

 

방문자가 반복 레이아웃에서 더 많은 항목을 볼 수 있도록 페이지에 탐색 버튼을 추가하고 데이터세트에 연결할 수 있습니다. 자세한 내용은  버튼 연결 패널로 작업을 참조합니다.

 

 

 

 

하나 이상의 컬렉션에서 정보 표시하기 (Displaying information from more than one collection)

반복 레이아웃은 참조 입력란(필드)이 있는 컬렉션의 관련 항목이나 다른 데이터세트로 하나의 데이터세트를 필터링한 상황에서도 관련 항목을 표시할 수 있습니다. 이를 통해 각 반복 레이아웃 항목이 "마스터" 역할을 하는 "마스터 세부 정보" 프리젠테이션을 만들 수 있습니다. 마스터 - 세부 정보 페이지를 만드는 방법에 대한 설명은 윅스 (Wix) 코딩 - 표(Table) 또는 갤러리에 데이터베이스 내용 표시하기 (About Displaying Database Content in a Table or Gallery)를 참조합니다.

 

 

연관된 토픽)

 

 

윅스 홈페이지 만들기 101

윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index

윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index

 

출처 :

https://support.wix.com/en/article/about-displaying-database-content-in-a-repeater