เทมเพลตโปรแกรมสะสมคะแนน

Loyalty Pass รองรับการแสดงผลเทมเพลต หากไม่ได้กำหนดเทมเพลตไว้ ระบบจะใช้เทมเพลตเริ่มต้น

คำอธิบายเทมเพลต

เทมเพลตบัตรจะกำหนดที่ระดับคลาสและใช้เพื่อแสดงออบเจ็กต์ที่เชื่อมโยงกับคลาส เทมเพลตจะกำหนดช่องที่จะแสดงในส่วนต่างๆ ของบัตร

เทมเพลตแบ่งออกเป็นส่วนต่างๆ ต่อไปนี้

Android

ภาพรวมเทมเพลต

เว็บไซต์

ภาพรวมเทมเพลต

ชื่อการ์ด

Android

องค์ประกอบชื่อการ์ด ชื่อการ์ดเริ่มต้น
  1. class.programLogo
  2. class.localizedIssuerName
    หรือ class.issuerName
  3. class.localizedProgramName
    หรือ class.programName
  4. class.hexBackgroundColor

ชื่อการ์ดโลโก้แบบกว้าง
  1. class.wideProgramLogo
  2. class.localizedProgramName
    หรือ class.programName
  3. class.hexBackgroundColor

เว็บไซต์

องค์ประกอบชื่อการ์ด
  1. class.programLogo
  2. class.localizedIssuerName
    หรือ class.issuerName
  3. class.localizedProgramName
    หรือ class.programName
  4. class.hexBackgroundColor

ส่วนชื่อบัตรแสดงโลโก้ ชื่อผู้ออกบัตร และชื่อโปรแกรม การอ้างอิงช่องที่ใช้ในการป้อนข้อมูลและตำแหน่งจะเปลี่ยนแปลงไม่ได้

เมื่อตั้งค่าช่องโลโก้แบบกว้างแล้ว ในอุปกรณ์ Android ระบบจะแทนที่ส่วนหัวเทมเพลตเริ่มต้นที่มีโลโก้และชื่อผู้ออกใบรับรองด้วยโลโก้แบบกว้าง

โปรดปฏิบัติตาม หลักเกณฑ์เกี่ยวกับรูปภาพโลโก้แบบกว้างเมื่อสร้างโลโก้ส่วนหัวแบบกว้างเพื่อให้แสดงรูปภาพบนบัตรได้อย่างเหมาะสมที่สุด

เทมเพลตการ์ด

Android

ภาพรวมเทมเพลต

เว็บไซต์

ภาพรวมเทมเพลต

ส่วนเทมเพลตการ์ดจะใช้เพื่อแสดงแถวเพิ่มเติม แถวเหล่านี้อาจมีช่องข้อมูลที่มีโครงสร้างแบบข้อความหรือช่องโมดูลข้อความก็ได้

คุณระบุจำนวนแถวที่กำหนดจำนวนออบเจ็กต์ในรายการ class.classTemplateInfo.cardTemplateOverride.cardRowTemplateInfos[] ได้ รายการนี้ต้องมีองค์ประกอบอย่างน้อย 1 รายการ และเราขอแนะนำให้ใช้องค์ประกอบไม่เกิน 2 รายการ แต่ละองค์ประกอบต้องเป็นประเภทใดประเภทหนึ่งต่อไปนี้

  • oneItem ซึ่งยอมรับ 1 รายการ:
    • item
  • twoItems ซึ่งยอมรับ 2 รายการ ได้แก่
    • startItem
    • endItem
  • threeItems ซึ่งยอมรับ 3 รายการ ได้แก่
    • startItem
    • middleItem
    • endItem

คุณกำหนดแต่ละรายการได้ว่าเป็นตัวเลือกช่องเดียว (.firstValue), ตัวเลือกช่อง 2 ตัวเลือก (.firstValue และ .secondValue) หรือรายการที่กำหนดไว้ล่วงหน้า (.predefinedItem) ระบบจะแสดงทั้งค่าของช่องที่เลือกและป้ายกำกับที่เกี่ยวข้อง เมื่อคุณกำหนดตัวเลือกช่อง 2 รายการ ค่าของช่องที่เลือกจะแสดงโดยมีตัวคั่น "/" ป้ายกำกับของช่องที่เลือกก็เช่นเดียวกัน รายการที่กำหนดล่วงหน้าจะใช้เพื่อกำหนดการแสดงผลที่ซับซ้อนมากขึ้น

ตัวอย่างโค้ดต่อไปนี้แสดงวิธีลบล้างส่วนแถวการ์ดของเทมเพลตการ์ดเพื่อระบุ 2 แถว โดยแต่ละแถวจะมี 3 รายการ โดยแต่ละช่องอ้างอิงช่องที่กำหนดเอง textModuleData ระดับคลาส 6 ช่องและส่วนหัวเป็นป้ายกำกับ ดังนี้

Python

 {
   ... //Rest of class
   "textModulesData": [
        {
            "header": "Label 1",
            "body": "Some info 1",
            "id": "myfield1"
        },
        {
            "header": "Label 2",
            "body": "Some info 2",
            "id": "myfield2"
        },
        {
            "header": "Label 3",
            "body": "Some info 3",
            "id": "myfield3"
        },
        {
            "header": "Label 4",
            "body": "Some info 4",
            "id": "myfield4"
        },
        {
            "header": "Label 5",
            "body": "Some info 5",
            "id": "myfield5"
        },
        {
            "header": "Label 6",
            "body": "Some info 6",
            "id": "myfield6"
        }
    ],
   "classTemplateInfo": {
        "cardTemplateOverride": {
            "cardRowTemplateInfos": [{
                "threeItems": {
                    "startItem": {
                        "firstValue": {
                            "fields": [{
                                "fieldPath": "class.textModulesData['myfield1']"
                            }]
                        }
                    },
                    "middleItem": {
                        "firstValue": {
                            "fields": [{
                                "fieldPath": "class.textModulesData['myfield2']"
                            }]
                        }
                    },
                    "endItem": {
                        "firstValue": {
                            "fields": [{
                                "fieldPath": "class.textModulesData['myfield3']"
                            }]
                        }
                    },
                }
            },{
                "threeItems": {
                    "startItem": {
                        "firstValue": {
                            "fields": [{
                                "fieldPath": "class.textModulesData['myfield4']"
                            }]
                        }
                    },
                    "middleItem": {
                        "firstValue": {
                            "fields": [{
                                "fieldPath": "class.textModulesData['myfield5']"
                            }]
                        }
                    },
                    "endItem": {
                        "firstValue": {
                            "fields": [{
                                "fieldPath": "class.textModulesData['myfield6']"
                            }]
                        }
                    },
                }
            }]
        }
    }
}
    

Java

// Rest of class
  .setTextModulesData((new ArrayList<TextModuleData>() {
    {
      add((new TextModuleData()).setHeader("Label 1")
        .setBody("Some info 1")
        .setId("myfield1"));
      add((new TextModuleData()).setHeader("Label 2")
        .setBody("Some info 1")
        .setId("myfield2"));
      add((new TextModuleData()).setHeader("Label 3")
        .setBody("Some info 3")
        .setId("myfield3"));
      add((new TextModuleData()).setHeader("Label 4")
        .setBody("Some info 4")
        .setId("myfield4"));
      add((new TextModuleData()).setHeader("Label 5")
        .setBody("Some info 5")
        .setId("myfield5"));
      add((new TextModuleData()).setHeader("Label 6")
        .setBody("Some info 5")
        .setId("myfield6"));
    }
  }))
  .setClassTemplateInfo((new ClassTemplateInfo())
    .setCardTemplateOverride((new CardTemplateOverride())
      .setCardRowTemplateInfos(new ArrayList<CardRowTemplateInfo>() {
        {
          add((new CardRowTemplateInfo()).setThreeItems((new CardRowThreeItems())
            .setStartItem((new TemplateItem()).setFirstValue((new FieldSelector()).setFields(new ArrayList<FieldReference>(){
              {
                add((new FieldReference()).setFieldPath("class.textModulesData['myfield1']"));
              }
            })))
            .setMiddleItem((new TemplateItem()).setFirstValue((new FieldSelector()).setFields(new ArrayList<FieldReference>(){
              {
                add((new FieldReference()).setFieldPath("class.textModulesData['myfield2']"));
              }
            })))
            .setEndItem((new TemplateItem()).setFirstValue((new FieldSelector()).setFields(new ArrayList<FieldReference>(){
              {
                add((new FieldReference()).setFieldPath("class.textModulesData['myfield3']"));
              }
            })))
          ));
          add((new CardRowTemplateInfo()).setThreeItems((new CardRowThreeItems())
            .setStartItem((new TemplateItem()).setFirstValue((new FieldSelector()).setFields(new ArrayList<FieldReference>(){
              {
                add((new FieldReference()).setFieldPath("class.textModulesData['myfield4']"));
              }
            })))
            .setMiddleItem((new TemplateItem()).setFirstValue((new FieldSelector()).setFields(new ArrayList<FieldReference>(){
              {
                add((new FieldReference()).setFieldPath("class.textModulesData['myfield5']"));
              }
            })))
            .setEndItem((new TemplateItem()).setFirstValue((new FieldSelector()).setFields(new ArrayList<FieldReference>(){
              {
                add((new FieldReference()).setFieldPath("class.textModulesData['myfield6']"));
              }
            })))
          ));
          }
  })))
    

PHP

// Rest of class
    $textModulesData1 = new Google_Service_Walletobjects_TextModuleData();
    $textModulesData1->setBody("Some info 1");
    $textModulesData1->setHeader("Label 1");
    $textModulesData1->setId("myfield1");

    $textModulesData2 = new Google_Service_Walletobjects_TextModuleData();
    $textModulesData2->setBody("Some info 2");
    $textModulesData2->setHeader("Label 2");
    $textModulesData2->setId("myfield2");

    $textModulesData3 = new Google_Service_Walletobjects_TextModuleData();
    $textModulesData3->setBody("Some info 3");
    $textModulesData3->setHeader("Label 3");
    $textModulesData3->setId("myfield3");

    $textModulesData4 = new Google_Service_Walletobjects_TextModuleData();
    $textModulesData4->setBody("Some info 4");
    $textModulesData4->setHeader("Label 4");
    $textModulesData4->setId("myfield4");

    $textModulesData5 = new Google_Service_Walletobjects_TextModuleData();
    $textModulesData5->setBody("Some info 5");
    $textModulesData5->setHeader("Label 5");
    $textModulesData5->setId("myfield5");

    $textModulesData6 = new Google_Service_Walletobjects_TextModuleData();
    $textModulesData6->setBody("Some info 6");
    $textModulesData6->setHeader("Label 6");
    $textModulesData6->setId("myfield6");

    $textModulesDatas = array($textModulesData1, $textModulesData2, $textModulesData3,
                  $textModulesData4, $textModulesData5, $textModulesData6);

    $startItemField = new Google_Service_Walletobjects_FieldReference();
    $startItemField->setFieldPath("class.textModulesData['myfield1']");

    $startItemFirstValue = new Google_Service_Walletobjects_FieldSelector();
    $startItemFirstValue->setFields(array($startItemField));

    $startItem = new Google_Service_Walletobjects_TemplateItem();
    $startItem->setFirstValue($startItemFirstValue);

    $middleItemField = new Google_Service_Walletobjects_FieldReference();
    $middleItemField->setFieldPath("class.textModulesData['myfield2']");

    $middleItemFirstValue = new Google_Service_Walletobjects_FieldSelector();
    $middleItemFirstValue->setFields(array($middleItemField));

    $middleItem = new Google_Service_Walletobjects_TemplateItem();
    $middleItem->setFirstValue($middleItemFirstValue);

    $endItemField = new Google_Service_Walletobjects_FieldReference();
    $endItemField->setFieldPath("class.textModulesData['myfield3']");

    $endItemFirstValue = new Google_Service_Walletobjects_FieldSelector();
    $endItemFirstValue->setFields(array($endItemField));

    $endItem = new Google_Service_Walletobjects_TemplateItem();
    $endItem->setFirstValue($endItemFirstValue);

    $cardRowTemplate = new Google_Service_Walletobjects_CardRowThreeItems();
    $cardRowTemplate->setStartItem($startItem);
    $cardRowTemplate->setMiddleItem($middleItem);
    $cardRowTemplate->setEndItem($endItem);

    $cardRowTemplateInfo1 = new Google_Service_Walletobjects_CardRowTemplateInfo();
    $cardRowTemplateInfo1->setThreeItems($cardRowTemplate);

    $startItemField2 = new Google_Service_Walletobjects_FieldReference();
    $startItemField2->setFieldPath("class.textModulesData['myfield4']");

    $startItemFirstValue2 = new Google_Service_Walletobjects_FieldSelector();
    $startItemFirstValue2->setFields(array($startItemField2));

    $startItem2 = new Google_Service_Walletobjects_TemplateItem();
    $startItem2->setFirstValue($startItemFirstValue2);

    $middleItemField2 = new Google_Service_Walletobjects_FieldReference();
    $middleItemField2->setFieldPath("class.textModulesData['myfield5']");

    $middleItemFirstValue2 = new Google_Service_Walletobjects_FieldSelector();
    $middleItemFirstValue2->setFields(array($middleItemField2));

    $middleItem2 = new Google_Service_Walletobjects_TemplateItem();
    $middleItem2->setFirstValue($middleItemFirstValue2);

    $endItemField2 = new Google_Service_Walletobjects_FieldReference();
    $endItemField2->setFieldPath("class.textModulesData['myfield6']");

    $endItemFirstValue2 = new Google_Service_Walletobjects_FieldSelector();
    $endItemFirstValue2->setFields(array($endItemField2));

    $endItem2 = new Google_Service_Walletobjects_TemplateItem();
    $endItem2->setFirstValue($endItemFirstValue2);

    $cardRowTemplate2 = new Google_Service_Walletobjects_CardRowThreeItems();
    $cardRowTemplate2->setStartItem($startItem2);
    $cardRowTemplate2->setMiddleItem($middleItem2);
    $cardRowTemplate2->setEndItem($endItem2);

    $cardRowTemplateInfo2 = new Google_Service_Walletobjects_CardRowTemplateInfo();
    $cardRowTemplateInfo2->setThreeItems($cardRowTemplate2);

    $cardTemplateOverride = new Google_Service_Walletobjects_CardTemplateOverride();
    $cardTemplateOverride->setCardRowTemplateInfos(array($cardRowTemplateInfo1,
                  $cardRowTemplateInfo2));

    $classTemplateInfo = new Google_Service_Walletobjects_ClassTemplateInfo();
    $classTemplateInfo->setCardTemplateOverride($cardTemplateOverride);

    $payload->setTextModulesData($textModulesDatas);
    $payload->setClassTemplateInfo($classTemplateInfo);
    

โค้ดจะสร้างบัตรผ่านโดยใช้รูปแบบส่วนเทมเพลตโค้ดต่อไปนี้

ตัวอย่างการลบล้างป้ายกํากับ

หากรายการว่างเปล่า สินค้านั้นจะไม่แสดง ดูรายละเอียดเพิ่มเติมได้ที่การอ้างอิงช่อง หากรายการทั้งหมดในแถวว่างเปล่า แถวนั้นจะไม่แสดง หากบางรายการในแถวว่างเปล่า รายการที่ไม่ว่างจะจัดเรียงใหม่และแสดงเป็นแถวที่มีรายการน้อยลง

หากคุณไม่ได้ลบล้างเทมเพลตการ์ด ระบบจะใช้จำนวนแถวเริ่มต้น จำนวนรายการเริ่มต้น และการอ้างอิงช่องที่เป็นค่าเริ่มต้น ดูรายละเอียดเพิ่มเติมได้ที่เทมเพลตเริ่มต้น

หลังจากกำหนดรูปภาพหลักแล้ว รูปภาพนี้อาจปรากฏหลังแถวแรก หากมีหลายแถวในรายการ cardRowTemplateInfos หรือเหนือแถว (หากมีเพียงแถวเดียว)

บาร์โค้ดของบัตร

Android

องค์ประกอบบาร์โค้ดของบัตร
  1. class.classTemplateInfo
      .cardBarcodeSectionDetails
      .firstTopDetail
  2. class.classTemplateInfo
      .cardBarcodeSectionDetails
      .secondTopDetail
  3. object.barcode.type และ object.barcode.value
    หรือ object.accountId
  4. object.barcode.alternateText
    หรือ object.accountId
    หรือ object.barcode.value
  5. class.classTemplateInfo
      .cardBarcodeSectionDetails
      .firstBottomDetail
  6. object.heroImage
    หรือ class.heroImage

เว็บไซต์

องค์ประกอบบาร์โค้ดของบัตร
  1. class.classTemplateInfo
      .cardBarcodeSectionDetails
      .firstTopDetail
  2. class.classTemplateInfo
      .cardBarcodeSectionDetails
      .secondTopDetail
  3. object.barcode.type และ object.barcode.value
    หรือ object.accountId
  4. object.barcode.alternateText
    หรือ object.accountId
    หรือ object.barcode.value
  5. class.classTemplateInfo
      .cardBarcodeSectionDetails
      .firstBottomDetail

ส่วนบาร์โค้ดของบัตรใช้เพื่อแสดงข้อความหรือรูปภาพเพิ่มเติมด้านบนและด้านล่างบาร์โค้ด ช่องในส่วนนี้ไม่จำเป็นต้องดำเนินการใดๆ

มีตัวเลือกช่อง 3 ช่องที่ใช้กำหนดช่อง 2 ช่องที่อยู่เคียงข้างกันที่ด้านบนและด้านล่างบาร์โค้ดได้ ซึ่งจะแสดงโดยไม่มีป้ายกำกับและเป็นช่องข้อมูลที่มีโครงสร้างแบบข้อความ ช่องโมดูลข้อความ หรือช่องโมดูลรูปภาพก็ได้ หากใช้รูปภาพ รูปภาพเหล่านี้ควรเป็นไปตามหลักเกณฑ์การใช้แบรนด์

บาร์โค้ดจะกำหนดโดยประเภทและค่า ดูรายการประเภทบาร์โค้ดที่รองรับได้ที่ข้อมูลอ้างอิง นอกจากนี้ ข้อความยังแสดงอยู่ใต้บาร์โค้ดได้อีกด้วย ข้อความนี้จะช่วยให้สแกนบาร์โค้ดได้ง่ายขึ้น รวมถึงการใช้งานอื่นๆ

ตัวอย่างรหัสต่อไปนี้แสดงวิธีลบล้างส่วนบาร์โค้ดของบัตรเพื่อแสดงรูปภาพเหนือบาร์โค้ด

Python

#... rest of class
    "imageModulesData": [
        {
            "mainImage": {
                "sourceUri": {
                    "uri":  "http://farm4.staticflickr.com/3738/12440799783_3dc3c20606_b.jpg",
                    "description": "Coffee"
                }
            },
            "Id": "myimage"
        }
    ],
    "classTemplateInfo": {
        "cardBarcodeSectionDetails": {
            "firstTopDetail": {
                "fieldSelector": {
                    "fields": [
                        {
                        "fieldPath": "class.imageModulesData['myimage'].mainImage"
                        }
                    ]
                }
            }
        }
    }
}
    

Java

//... rest of class
  .setImageModulesData((new ArrayList<ImageModuleData>() {
    {
      add((new ImageModuleData())
        .setId("myimage")
        .setMainImage((new Image()).setSourceUri((new ImageUri()).setDescription("Coffee beans")
          .setUri("http://farm4.staticflickr.com/3738/12440799783_3dc3c20606_b.jpg"))));
        }
      }))
      .setClassTemplateInfo((new ClassTemplateInfo())
        .setCardBarcodeSectionDetails((new CardBarcodeSectionDetails())
          .setFirstTopDetail((new BarcodeSectionDetail())
            .setFieldSelector((new FieldSelector())
              .setFields((new ArrayList<FieldReference>(){
                {
                  add((new FieldReference()).setFieldPath("class.imageModulesData['myimage'].mainImage"));
                }
            })))))
      }
    

PHP

//... rest of class
    $imageUri = new Google_Service_Walletobjects_ImageUri();
    $imageUri->setUri("https://farm8.staticflickr.com/7340/11177041185_a61a7f2139_o.jpg");
    $imageUri->setDescription("Baconrista flights image");
    $image = new Google_Service_Walletobjects_Image();
    $image->setSourceUri($imageUri);
    $imageModulesData = new Google_Service_Walletobjects_ImageModuleData();
    $imageModulesData->setMainImage($image);
            $imageModulesData->setId("myimage");

    $cardBarcodeFieldReference = new Google_Service_Walletobjects_FieldReference();
    $cardBarcodeFieldReference->setFieldPath("class.imageModulesData['myimage'].mainImage");

    $cardBarcodeFieldSelector = new Google_Service_Walletobjects_FieldSelector();
    $cardBarcodeFieldSelector->setFields(array($cardBarcodeFieldReference));

    $cardBarcodeDetail = new Google_Service_Walletobjects_BarcodeSectionDetail();
    $cardBarcodeDetail->setFieldSelector($cardBarcodeFieldSelector);

    $cardBarcodeSectionDetails = new Google_Service_Walletobjects_CardBarcodeSectionDetails();
    $cardBarcodeSectionDetails->setFirstTopDetail($cardBarcodeDetail);

    $classTemplateInfo = new Google_Service_Walletobjects_ClassTemplateInfo();
    $classTemplateInfo->setCardBarcodeSectionDetails($cardBarcodeSectionDetails);

    $payload->setClassTemplateInfo($classTemplateInfo);
            $payload->setImageModuleData($imageModulesData);
    

รหัสจะสร้างบัตรโดยใช้รูปแบบส่วนบาร์โค้ดต่อไปนี้

ตัวอย่างการลบล้างบาร์โค้ดของบัตร

หากคุณไม่ลบล้างส่วนบาร์โค้ด ระบบจะใช้ช่องบาร์โค้ดเริ่มต้น ดูข้อมูลเพิ่มเติมได้ที่เทมเพลตเริ่มต้น

เทมเพลตรายละเอียด

Android

ส่วนเทมเพลตรายละเอียด
  • class.classTemplateInfo.detailsTemplateOverride
      .detailsItemInfos[0].item
  • class.classTemplateInfo.detailsTemplateOverride
      .detailsItemInfos[1].item
  • class.classTemplateInfo.detailsTemplateOverride
      .detailsItemInfos[2].item
  • class.classTemplateInfo.detailsTemplateOverride
      .detailsItemInfos[3].item
  • ...

เว็บไซต์

ส่วนเทมเพลตรายละเอียด
  • class.classTemplateInfo.detailsTemplateOverride
      .detailsItemInfos[0].item
  • class.classTemplateInfo.detailsTemplateOverride
      .detailsItemInfos[1].item
  • class.classTemplateInfo.detailsTemplateOverride
      .detailsItemInfos[2].item
  • class.classTemplateInfo.detailsTemplateOverride
      .detailsItemInfos[3].item
  • ...

ส่วนเทมเพลตรายละเอียดคือลิสต์รายการ class.classTemplateInfo.detailsTemplateOverride.detailsItemInfos[] รายการอาจมีช่องข้อมูลที่มีโครงสร้าง ช่องโมดูลข้อความ ช่องโมดูลลิงก์ ช่องโมดูลรูปภาพ หรือข้อความประเภทใดก็ได้

คุณกำหนดแต่ละรายการได้ว่าเป็นตัวเลือกช่องเดียว (.firstValue), ตัวเลือกช่อง 2 รายการ (.firstValue และ .secondValue) หรือรายการที่กำหนดไว้ล่วงหน้า (.predefinedItem) ระบบจะแสดงทั้งค่าของช่องที่เลือกและป้ายกำกับที่เกี่ยวข้อง เมื่อคุณกำหนดตัวเลือกช่อง 2 รายการ ค่าของช่องที่เลือกจะแสดงด้วยตัวคั่น "/" ป้ายกำกับของช่องที่เลือกก็เช่นเดียวกัน รายการที่กำหนดล่วงหน้าจะใช้เพื่อกำหนดการแสดงผลที่ซับซ้อนมากขึ้น ช่องโมดูลรูปภาพจะแสดงผลที่ความกว้างเต็มหน้าจอโดยไม่มีป้ายกำกับ

ตัวอย่างโค้ดต่อไปนี้แสดงวิธีลบล้างส่วนรายละเอียดของบัตรเพื่อแสดงช่อง linksModuleData เพียงช่องเดียวพร้อมป้ายกำกับ

Python

//... rest of class
   "linksModuleData": {
        "uris": [
            {
                "uri": "http://maps.google.com/",
                "description": "Nearby Locations",
                "id":"mylink"
            }
        ]
    },
   "classTemplateInfo": {
        "detailsTemplateOverride": {
            "detailsItemInfos": [
                {
                    "item":{
                        "firstValue": {
                            "fields": [{
                                "fieldPath": "class.linksModuleData.uris['mylink']"
                            }]
                        }
                    }
                }
            ]
        }
     }
//... rest of class
    

Java

 //... rest of class
  .setLinksModuleData((new ArrayList<LinksModuleData>() {
    {
      add((new LinksModuleData()).setDescription("Nearby Locations")
        .setUri("http://maps.google.com/")
        .setId("mylink"));
      }))
      .setClassTemplateInfo((new ClassTemplateInfo())
        .setDetailsTemplateOverride((new DetailsTemplateOverride())
          .setDetailsItemInfos(new ArrayList<DetailsItemInfo>(){
            {
              add((new DetailsItemInfo())
                .setItem((new TemplateItem()).setFirstValue((new FieldSelector()).setFields(new ArrayList<FieldReference>(){
                  {
                    add((new FieldReference()).setFieldPath("class.linksModuleData.uris['mylink']"));
                  }
                }))));
              }
            }))
//... rest of class
    

PHP



    //... rest of class building
    $locationUri = new Google_Service_Walletobjects_Uri();
    $locationUri->setUri("http://maps.google.com/");
    $locationUri->setDescription("Nearby Locations");
    $locationUri->setId("mylink");

    $linksModuleData = new Google_Service_Walletobjects_LinksModuleData();
    $linksModuleData->setUris(array($locationUri));

    $detailItemFieldReference = new Google_Service_Walletobjects_FieldReference();
    $detailItemFieldReference->setFieldPath("class.linksModuleData.uris['mylink']");
    $detailItemFieldSelector = new Google_Service_Walletobjects_FieldSelector();
    $detailItemFieldSelector->setFields(array($detailItemFieldReference));

    $detailItem = new Google_Service_Walletobjects_TemplateItem();
    $detailItem->setFirstValue($detailItemFieldSelector);

    $detailsItemInfo = new Google_Service_Walletobjects_DetailsItemInfo();
    $detailsItemInfo->setItem($detailItem);

    $cardDetailsTemplateOverride = new Google_Service_Walletobjects_DetailsTemplateOverride();
    $cardDetailsTemplateOverride->setDetailsItemInfos(array($detailsItemInfo));

    $classTemplateInfo = new Google_Service_Walletobjects_ClassTemplateInfo();
    $classTemplateInfo->setDetailsTemplateOverride($cardDetailsTemplateOverride);

    $payload->setClassTemplateInfo($classTemplateInfo);
    $payload->setLinksModuleData($linksModuleData);
    //... rest of class
    

โค้ดจะสร้างบัตรผ่านที่มีรูปแบบส่วนรายละเอียดต่อไปนี้

ตัวอย่างการลบล้างรายละเอียด

หากรายการว่างเปล่า สินค้านั้นจะไม่แสดง ดูรายละเอียดเพิ่มเติมได้ที่การอ้างอิงช่อง

หากคุณไม่ได้ลบล้างเทมเพลตรายละเอียด ระบบจะแสดงรายการช่องอ้างอิงเริ่มต้นตามลำดับที่เป็นค่าเริ่มต้น ดูข้อมูลเพิ่มเติมได้ที่เทมเพลตเริ่มต้น

แสดงรายการเทมเพลต

แสดงรายการองค์ประกอบเทมเพลต
  1. class.classTemplateInfo.listTemplateOverride
      .firstRowOption.fieldOption.fields[]
  2. class.classTemplateInfo.listTemplateOverride
      .secondRowOption.fields[]
  3. class.programLogo
  4. class.hexBackgroundColor

ส่วนเทมเพลตรายการใช้เพื่อเลือกช่องที่จะแสดงในมุมมอง "บัตร" ของแอป Google Wallet โดยบัตรจะแสดงในรายการโดยมีโลโก้ สีพื้นหลัง และแถว 3 แถว

ตัวอย่างโค้ดต่อไปนี้แสดงวิธีลบล้างเทมเพลตรายการของบัตรเพื่อแสดงช่องวันที่หมดอายุของออบเจ็กต์ของบัตรรายการเดียวในแถวแรกของเทมเพลตรายการ

Python


#... rest of class definition
   "classTemplateInfo": {
        "listTemplateOverride":{
            "firstRowOption": {
                "fieldOption":{
                    "fields": [{
                        "fieldPath": "object.validTimeInterval.end"
                    }]
                }
            }
        }
   }
}
    

Java

//... rest of class
  .setClassTemplateInfo((new ClassTemplateInfo())
    .setListTemplateOverride((new ListTemplateOverride())
      .setFirstRowOption((new FirstRowOption())
        .setFieldOption((new FieldSelector()).setFields(new ArrayList<FieldReference>(){
          {
            add((new FieldReference()).setFieldPath("object.validTimeInterval.end"));
          }
        }))))
//... rest of class
    

PHP

    //... rest of class
    $fieldReference = new Google_Service_Walletobjects_FieldReference();
    $fieldReference->setFieldPath("object.validTimeInterval.end");

    $fieldOption = new Google_Service_Walletobjects_FieldSelector();
    $fieldOption->setFields(array($fieldReference));

    $firstRowOption = new Google_Service_Walletobjects_FirstRowOption();
    $firstRowOption->setFieldOption($fieldOption);

    $listTemplateOverride = new Google_Service_Walletobjects_ListTemplateOverride();
    $listTemplateOverride->setFirstRowOption($firstRowOption);

    $classTemplateInfo = new Google_Service_Walletobjects_ClassTemplateInfo();
    $classTemplateInfo->setListTemplateOverride($listTemplateOverride);

    $payload->setClassTemplateInfo($classTemplateInfo);
    //... rest of class
    

โค้ดจะสร้างบัตรผ่านที่มีการแปลเทมเพลตรายการต่อไปนี้

ตัวอย่างการลบล้างรายการ

คุณกำหนดแถวทั้ง 3 แถวได้ด้วยตัวเลือกฟิลด์ ช่องดังกล่าวจะแสดงโดยไม่มีป้ายกำกับ

ป้ายกำกับ

ช่อง Structured Data ทุกช่องจะมีป้ายกำกับที่ Google ให้ไว้ Google จะรับผิดชอบในการแปลป้ายกำกับแต่ละป้ายเป็นภาษาที่รองรับทั้งหมด

คุณปรับแต่งป้ายกำกับเหล่านี้บางรายการได้โดยใช้ช่อง class.custom<name_of_the_field>Label ช่องใดช่องหนึ่ง เมื่อปรับแต่งป้ายกำกับ คุณจะต้องใส่คำแปลสำหรับป้ายกำกับเฉพาะในทุกภาษาที่คุณต้องการรองรับ

การอ้างอิงช่อง

ระบบจะใช้การอ้างอิงช่องในส่วนต่างๆ ของเทมเพลตที่มีแบบฟอร์ม class.classTemplateInfo.*.fields[] การอ้างอิงช่องมีรายการเส้นทางไปยังช่องข้อมูลที่มีโครงสร้าง ช่องโมดูลข้อความ ช่องโมดูลลิงก์ ช่องโมดูลรูปภาพ หรือข้อความ

เส้นทางบางประเภทไม่ได้รับอนุญาตในการอ้างอิงฟิลด์บางรายการ เช่น การอ้างอิงช่องบางช่องอนุญาตเฉพาะเส้นทางไปยังช่องข้อมูลที่มีโครงสร้างแบบข้อความหรือช่องโมดูลข้อความ ช่องที่มีโครงสร้างแบบข้อความคือช่องข้อมูลที่มีโครงสร้างของประเภทสตริง สตริงที่แปลแล้ว วันที่ หรือเงิน

รายการนี้สามารถใช้เพื่อติดตั้งใช้งานตรรกะสำรอง ซึ่งหมายความว่าหากเส้นทางแรกในรายการเปลี่ยนเป็นช่องว่าง ระบบจะประเมินเส้นทางถัดไป ตรรกะสํารองจะมุ่งเป้าไปที่ช่องข้อมูลที่มีโครงสร้างแบบข้อความหรือช่องโมดูลข้อความเป็นหลัก อย่ารวมช่องประเภทต่างๆ ไว้ในรายการเดียวกัน โปรดใช้ตรรกะสำรองอย่างระมัดระวัง และเฉพาะในบางสถานการณ์เมื่อคุณคาดหวังรูปแบบของช่องที่สอดคล้องกันซึ่งมีอยู่ในออบเจ็กต์บางรายการเท่านั้น โดยส่วนใหญ่แล้ว การสร้างชั้นเรียนแยกสำหรับ Use Case แยกต่างหากจะเป็นเรื่องที่ง่ายกว่า

หากเส้นทางทั้งหมดในรายการอ้างอิงช่องแก้ไขเป็นช่องว่าง รายการที่ใช้การอ้างอิงช่องจะไม่แสดงขึ้น หากต้องการให้รายการที่ใช้การอ้างอิงช่องปรากฏเสมอ ให้ตรวจสอบว่าเส้นทางอย่างน้อย 1 เส้นทางว่างเปล่า เราขอแนะนำให้ตั้งค่าช่องเป็นสัญลักษณ์พิเศษ เช่น "-" เพื่อแสดงค่า Null แม้ว่าบางช่องจะอนุญาตให้ใช้สตริงที่มีเพียงเว้นวรรคก็ตาม

หากต้องการอ้างอิงช่องที่มีในรายการ คุณใช้ดัชนีของช่องนั้นในรายการได้ หรือในกรณีส่วนใหญ่ คุณจะใช้รหัสอ้างอิงได้ รายการของลิสต์ที่อ้างอิงด้วยรหัสได้จะมีช่อง .id เราขอแนะนำให้คุณใช้รหัสอ้างอิงแทนดัชนีของช่องในรายการหากมี

ลองดูตัวอย่างวิธีอ้างอิงช่องที่มีในรายการ

  • object.imageModulesData[0].id = my-first-id
  • object.imageModulesData[1].id = my-second-id
  • class.detailsTemplateOverride.detailsItemInfos[0].item.firstValue.fields[0].fieldPath = object.imageModulesData[‘my-second-id’]
  • class.detailsTemplateOverride.detailsItemInfos[1].item.firstValue.fields[0].fieldPath = object.imageModulesData[0]

ในกรณีนี้ รายการแรกในส่วนรายละเอียดของบัตรคือรูปภาพที่ 2 ที่ประกาศในออบเจ็กต์ ในขณะที่รายการที่ 2 ในส่วนรายละเอียดของบัตรจะเป็นรูปภาพแรกที่ประกาศในออบเจ็กต์

เทมเพลตเริ่มต้น

Android

องค์ประกอบเทมเพลตเริ่มต้น
  1. class.programLogo
  2. class.localizedIssuerName
    หรือ class.issuerName
  3. class.localizedProgramName
    หรือ class.programName
  4. POINTS
    หรือ object.loyaltyPoints.localizedLabel
    หรือ object.loyaltyPoints.label
  5. object.loyaltyPoints.balance
  6. รางวัล
    หรือobject.secondaryLoyaltyPoints.localizedLabel
    หรือobject.secondaryLoyaltyPoints.label
  7. object.secondaryLoyaltyPoints.balance
  8. object.barcode.type และ object.barcode.value
    หรือ object.accountId
  9. object.barcode.alternateText
    หรือ object.accountId
    หรือ object.barcode.value
  10. object.heroImage
    หรือ class.heroImage
  11. class.hexBackgroundColor
  12. ชื่อสมาชิก
    หรือ class.localizedAccountNameLabel
    หรือ class.accountNameLabel
  13. object.accountName
  14. รหัสสมาชิก
    หรือ class.localizedAccountIdLabel
    หรือ class.accountIdLabel
  15. object.accountId
  16. ระดับรางวัล
    หรือclass.localizedRewardsTierLabel
    หรือclass.rewardsTierLabel
  17. class.localizedRewardsTier
    หรือ class.rewardsTier
  18. รางวัลระดับที่ 2
    หรือclass.localizedSecondaryRewardsTierLabel
    หรือclass.secondaryRewardsTierLabel
  19. class.localizedSecondaryRewardsTier
    หรือ class.secondaryRewardsTier
  20. class.imageModulesData[0].mainImage
  21. object.imageModulesData[0].mainImage
  22. class.messages[].header
  23. class.messages[].body
  24. object.messages[].header
  25. object.messages[].body
  26. class.textModulesData[0..9].header
  27. class.textModulesData[0..9].body
  28. object.textModulesData[0..9].header
  29. object.textModulesData[0..9].body
  30. class.linksModuleData.uris[].description
  31. object.linksModuleData.uris[].description
  32. class.homepageUri

เว็บไซต์

องค์ประกอบเทมเพลตเริ่มต้น
  1. class.programLogo
  2. class.localizedIssuerName
    หรือ class.issuerName
  3. class.localizedProgramName
    หรือ class.programName
  4. POINTS
    หรือ object.loyaltyPoints.localizedLabel
    หรือ object.loyaltyPoints.label
  5. object.loyaltyPoints.balance
  6. รางวัล
    หรือobject.secondaryLoyaltyPoints.localizedLabel
    หรือobject.secondaryLoyaltyPoints.label
  7. object.secondaryLoyaltyPoints.balance
  8. object.barcode.type และ object.barcode.value
    หรือ object.accountId
  9. object.barcode.alternateText
    หรือ object.accountId
    หรือ object.barcode.value
  10. object.heroImage
    หรือ class.heroImage
  11. class.hexBackgroundColor
  12. ชื่อสมาชิก
    หรือ class.localizedAccountNameLabel
    หรือ class.accountNameLabel
  13. object.accountName
  14. รหัสสมาชิก
    หรือ class.localizedAccountIdLabel
    หรือ class.accountIdLabel
  15. object.accountId
  16. ระดับรางวัล
    หรือclass.localizedRewardsTierLabel
    หรือclass.rewardsTierLabel
  17. class.localizedRewardsTier
    หรือ class.rewardsTier
  18. รางวัลระดับที่ 2
    หรือclass.localizedSecondaryRewardsTierLabel
    หรือclass.secondaryRewardsTierLabel
  19. class.localizedSecondaryRewardsTier
    หรือ class.secondaryRewardsTier
  20. class.imageModulesData[0].mainImage
  21. object.imageModulesData[0].mainImage
  22. class.messages[].header
  23. class.messages[].body
  24. object.messages[].header
  25. object.messages[].body
  26. class.textModulesData[0..9].header
  27. class.textModulesData[0..9].body
  28. object.textModulesData[0..9].header
  29. object.textModulesData[0..9].body
  30. class.linksModuleData.uris[].description
  31. object.linksModuleData.uris[].description
  32. class.homepageUri

สำหรับช่องโมดูลรูปภาพ เราจะแสดงช่องโมดูลรูปภาพเพียงช่องเดียวจากคลาสและอีกช่องเดียวเท่านั้นจากออบเจ็กต์ หากคุณต้องการช่องโมดูลรูปภาพมากกว่า 1 ช่องในระดับใดระดับหนึ่ง ให้ลบล้างเทมเพลตเริ่มต้น

สำหรับช่องโมดูลข้อความ เราจะแสดงช่องโมดูลข้อความสูงสุด 20 ช่องจากคลาสและ 20 ช่องของโมดูลข้อความจากออบเจ็กต์เท่านั้น ช่องดังกล่าวจะแสดงในลำดับเดียวกันกับที่กำหนดไว้ในอาร์เรย์ หากต้องการช่องโมดูลข้อความมากกว่า 20 ช่องในระดับใดระดับหนึ่ง ให้ลบล้างเทมเพลตเริ่มต้น

สำหรับข้อความ เราจะแสดงข้อความจากคลาสได้สูงสุด 20 ข้อความจากคลาสและ 20 ข้อความจากออบเจ็กต์เท่านั้น เราไม่รับประกันลำดับของข้อความ หากต้องการข้อความมากกว่า 20 ข้อความในระดับใดระดับหนึ่ง หรือการรับประกันคำสั่งซื้อใดๆ ให้ลบล้างเทมเพลตเริ่มต้น

ส่วนฟิลด์โมดูลลิงก์ ไม่มีการจำกัดจำนวน URI ที่คุณสามารถกำหนดได้ Uris จะถูกจัดกลุ่มตามลำดับต่อไปนี้สำหรับแต่ละระดับ (คลาสหรือออบเจ็กต์)

  1. พิกัดแผนที่
  2. หมายเลขโทรศัพท์
  3. อีเมล
  4. หน้าเว็บ

สำหรับแต่ละกลุ่ม URI จะแสดงในลำดับเดียวกันกับที่กำหนดในอาร์เรย์ หากต้องการลําดับอื่น ให้ลบล้างเทมเพลตเริ่มต้น

องค์ประกอบเทมเพลตรายการเริ่มต้น
  1. class.localizedIssuerName
    หรือ class.issuerName
  2. class.localizedProgramName
    หรือ class.programName
  3. class.programLogo
  4. class.hexBackgroundColor