ข้ามการนำทาง

Home » โครงการที่เกี่ยวข้อง » WPML GraphQL – เพิ่มฟังก์ชันหลายภาษาให้กับโครงร่าง WPGraphQL

WPML GraphQL – เพิ่มฟังก์ชันหลายภาษาให้กับโครงร่าง WPGraphQL

WPML GraphQL ช่วยให้คุณสามารถสอบถาม กรอง และดึงเนื้อหาเฉพาะภาษาและการแปลจากสคีมา WPGraphQL

คุณสมบัติที่สำคัญ

กรองเนื้อหาตามภาษา รวมถึงโพสต์ อนุกรมวิธาน ความคิดเห็น เมนู และรายการเมนู

ขยาย WPGraphQL ด้วยฟิลด์ภาษาเพื่อดึงข้อมูลเฉพาะจากปลั๊กอิน WPML

สอบถามข้อมูลในภาษาที่ติดตั้งทั้งหมดหรือเน้นเฉพาะภาษาที่เจาะจง

ในหน้านี้:

ปลั๊กอินที่จำเป็น

ในการเริ่มต้น ให้ติดตั้งและเปิดใช้งานปลั๊กอินต่อไปนี้:

หากต้องการรวมฟิลด์หลายภาษาจากปลั๊กอิน ACF ในสคีมา WPGraphQL ให้ติดตั้งด้วย:

คุณสามารถทำอะไรได้บ้างด้วย WPML GraphQL ?

WPML GraphQL รวมเข้ากับ WPGraphQL เพื่อให้คุณสามารถค้นหาเนื้อหาหลายภาษาที่สร้างด้วย WPML ได้

จาก GraphQL → GraphQL IDE คุณสามารถใช้ Query Composer เพื่อ:

  • รับข้อมูลภาษาสำหรับเนื้อหาใด ๆ ที่คุณสอบถาม
  • เข้าถึงการแปลสำหรับโพสต์ อนุกรมวิธาน และความคิดเห็น
  • กรองคำถามของคุณตามภาษา
  • ค้นหาโพสต์เฉพาะในภาษาต่างๆ โดยใช้ ID หรือสลัก

ตัวอย่างเช่น ตามที่แสดงในภาพด้านล่าง คุณสามารถดึงรายการโพสต์ทั้งหมดในไซต์ของคุณขึ้นมาได้อย่างง่ายดาย พร้อมด้วยรหัสภาษา สลัก URI และรายละเอียดสำหรับการแปล

การใช้เขตข้อมูลภาษาในตัวเขียนคิวรีเพื่อดึงข้อมูลโพสต์ในทุกภาษา

ด้านล่างนี้ เราจะใช้ไซต์ทดสอบหลายภาษาเพื่อแสดงให้คุณเห็นวิธีการใช้ WPML GraphQL เพื่อค้นหาเนื้อหาและการแปล

การสืบค้นภาษาและข้อมูลการแปล

ด้วย WPML GraphQL คุณสามารถใช้ฟิลด์ ภาษา และ การแปล ในแบบสอบถามของคุณได้:

  • การ language ฟิลด์นี้ช่วยให้คุณค้นหารายละเอียดต่างๆ เช่น รหัสภาษา, URL ธงชาติ, ชื่อพื้นเมือง, ชื่อที่แปล และ URL โฮมเพจสำหรับประเภทโพสต์, อนุกรมวิธาน, เมนู, รายการเมนู และความคิดเห็น
  • การ languageCode ฟิลด์จะได้รับรหัสภาษาสำหรับโพสต์ เงื่อนไขทางอนุกรมวิธาน เมนู รายการเมนู และความคิดเห็นโดยไม่มีรายละเอียดภาษาเพิ่มเติม
  • การ translations ฟิลด์ดึงข้อมูลการแปลสำหรับประเภทโพสต์และเงื่อนไขทางอนุกรมวิธาน

เมื่อคุณสอบถามความคิดเห็นlanguage และlanguageCode ฟิลด์ที่ตรงกับภาษาของโพสต์ที่พวกเขาเป็นสมาชิกอยู่

นี่คือตัวอย่างของแบบสอบถามที่ดึงโพสต์พร้อมรายละเอียดที่เกี่ยวข้อง รวมถึงสลักโพสต์, URI, รหัสภาษา, หมวดหมู่ และการแปลใดๆ ที่มีอยู่:

query Posts{
  posts(where: {language: "en"}) {
    nodes {
      slug
      uri
      language {
        code
      }
      categories {
        nodes {
          name
        }
      }
      translations {
        slug
        uri
        language {
          code
        }
        categories {
          nodes {
            name
          }
        }
      }
    }
  }
}

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

{
  "data": {
    "posts": {
      "nodes": [
        {
          "slug": "bye-world",
          "uri": "/2023/05/18/bye-world/",
          "language": {
            "code": "en"
          },
          "categories": {
            "nodes": [
              {
                "name": "End of the day"
              },
              {
                "name": "Greetings"
              }
            ]
          },
          "translations": [
            {
              "slug": "adios-mundo",
              "uri": "/es/2023/05/18/adios-mundo/",
              "language": {
                "code": "es"
              },
              "categories": {
                "nodes": [
                  {
                    "name": "Fin del día"
                  },
                  {
                    "name": "Saludos"
                  }
                ]
              }
            },
            {
              "slug": "tchau-mundo",
              "uri": "/pt-pt/2023/05/18/tchau-mundo/",
              "language": {
                "code": "pt-pt"
              },
              "categories": {
                "nodes": [
                  {
                    "name": "Fim do dia"
                  },
                  {
                    "name": "Saudações"
                  }
                ]
              }
            }
          ]
        },
        {
          "slug": "hello-world",
          "uri": "/2018/07/05/hello-world/",
          "language": {
            "code": "en"
          },
          "categories": {
            "nodes": [
              {
                "name": "Greetings"
              },
              {
                "name": "Start of the day"
              }
            ]
          },
          "translations": [
            {
              "slug": "hola-mundo",
              "uri": "/es/2018/07/05/hola-mundo/",
              "language": {
                "code": "es"
              },
              "categories": {
                "nodes": [
                  {
                    "name": "Inicio del día"
                  },
                  {
                    "name": "Saludos"
                  }
                ]
              }
            },
            {
              "slug": "ola-mundo",
              "uri": "/pt-pt/2018/07/05/ola-mundo/",
              "language": {
                "code": "pt-pt"
              },
              "categories": {
                "nodes": [
                  {
                    "name": "Começo do dia"
                  },
                  {
                    "name": "Saudações"
                  }
                ]
              }
            }
          ]
        }
      ]
    }
  }
}

การกรองภาษา

WPML GraphQL ช่วยให้คุณสามารถใช้ตัวกรอง ภาษา เพื่อ:

  • กรองโพสต์ คำศัพท์ทางอนุกรมวิธาน เมนู รายการเมนู หรือความคิดเห็นตามภาษาเฉพาะ
  • ดึงข้อมูลเนื้อหาในภาษาใดภาษาหนึ่งโดยตั้งค่าตัวกรองให้เหมาะสม
  • รับเนื้อหาทั้งหมดโดยไม่คำนึงถึงภาษาโดยตั้งค่าตัวกรองเป็น ทั้งหมด

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

นี่คือตัวอย่างของแบบสอบถามที่ดึงข้อมูลโพสต์เป็นภาษาสเปน รวมถึงสลัก URI และหมวดหมู่ที่เชื่อมต่อกัน:

query PostsES{
  posts(where: {language: "es"}) {
    nodes {
      slug
      uri
      categories {
        nodes {
          name
        }
      }
    }
  }
}

นี่คือสิ่งที่แบบสอบถามส่งคืน:

{
  "data": {
    "posts": {
      "nodes": [
        {
          "slug": "adios-mundo",
          "uri": "/es/2023/05/18/adios-mundo/",
          "categories": {
            "nodes": [
              {
                "name": "Fin del día"
              },
              {
                "name": "Saludos"
              }
            ]
          }
        },
        {
          "slug": "hola-mundo",
          "uri": "/es/2018/07/05/hola-mundo/",
          "categories": {
            "nodes": [
              {
                "name": "Inicio del día"
              },
              {
                "name": "Saludos"
              }
            ]
          }
        }
      ]
    }
  }
}

การค้นหาโพสต์เฉพาะข้ามภาษา

ด้วย WPMLGraphQL คุณยังสามารถค้นหาโพสต์แต่ละรายการในภาษาใดก็ได้โดยใช้ ID โพสต์หรือสลัก

ตัวอย่างเช่น หากคุณมีโพสต์ที่มีชื่อว่า ¡Hola mundo! (คำแปลภาษาสเปนของคำว่า Hello world !) พร้อมด้วย slug ของคำว่า hola-mundo และ ID โพสต์เป็น 2 คุณสามารถใช้คิวรีต่อไปนี้เพื่อดึงข้อมูลโพสต์ดังกล่าวได้:

query PostBySlug {
  post(id: "hola-mundo", idType: SLUG) {
    title
    slug
    uri
  }
}

query PostById {
  post(id: "2", idType: DATABASE_ID) {
    title
    slug
    uri
  }
}

ทั้งสองแบบสอบถามจะส่งคืนข้อมูลโพสต์อย่างถูกต้อง รวมถึงหัวเรื่อง สลัก และ URI สำหรับโพสต์ ¡Hola mundo! 

{
  "data": {
    "post": {
      "title": "¡Hola mundo!",
      "slug": "hola-mundo",
      "uri": "/es/2018/07/05/hola-mundo/"
    }
  }
}

การสืบค้นข้อมูลจากภาษาที่ติดตั้ง

WPML GraphQL มีแบบสอบถามสองแบบสำหรับการเข้าถึงข้อมูลเกี่ยวกับภาษาที่ติดตั้งบนเว็บไซต์ของคุณ:

  • การสอบถาม ภาษา จะเรียกค้นภาษาที่ลงทะเบียนทั้งหมดพร้อมกับข้อมูลที่เกี่ยวข้องสำหรับแต่ละภาษา
  • แบบสอบถาม defaultLanguage จะดึงข้อมูลเกี่ยวกับชุดภาษาเริ่มต้นบนเว็บไซต์ของคุณ

คำถามเหล่านี้อาจมีประโยชน์หากคุณต้องการสร้างฟีเจอร์ต่างๆ เช่น ตัวเปลี่ยนภาษา

ตัวอย่างเช่น หากต้องการรับข้อมูลสำหรับภาษาที่ติดตั้งทั้งหมด คุณสามารถรันแบบสอบถามต่อไปนี้:

query Languages {
  languages {
    code
    country_flag_url
    default_locale
    native_name
    translated_name
    url
  }
}

แบบสอบถามข้างต้นให้ผลลัพธ์ต่อไปนี้:

{
  "data": {
    "languages": [
      {
        "code": "en",
        "country_flag_url": "http://site.com/wp-content/plugins/sitepress-multilingual-cms-release/res/flags/en.svg",
        "default_locale": "en_US",
        "native_name": "English",
        "translated_name": "English",
        "url": "http://site.com"
      },
      {
        "code": "es",
        "country_flag_url": "http://site.com/wp-content/plugins/sitepress-multilingual-cms-release/res/flags/es.svg",
        "default_locale": "es_ES",
        "native_name": "Español",
        "translated_name": "Spanish",
        "url": "http://site.com/es/"
      },
      {
        "code": "it",
        "country_flag_url": "http://site.com/wp-content/plugins/sitepress-multilingual-cms-release/res/flags/it.svg",
        "default_locale": "it_IT",
        "native_name": "Italiano",
        "translated_name": "Italian",
        "url": "http://site.com/it/"
      }
    ]
  }
}

การใช้ WPML GraphQL กับ Gatsby และ ACF

Gatsby ช่วยให้คุณสามารถดึงข้อมูลจาก WordPress และด้วย WPML GraphQL คุณสามารถให้บริการเนื้อหาหลายภาษาและข้อมูลเฉพาะภาษาบนไซต์ Gatsby ของคุณได้

หากคุณใช้ WP GraphQL ร่วมกับปลั๊กอิน ACF, WPML GraphQL และ ACF Multilingual จะขยายฟังก์ชันนี้ ช่วยให้คุณสามารถสอบถามข้อมูลฟิลด์ที่กำหนดเองในภาษาต่างๆ ได้

ตัวอย่างเช่น สมมติว่าคุณติดตั้ง Gatsby พร้อมด้วย แพ็กเกจเสริม gatsby-source-graphql และไซต์ WordPress ของคุณมี WPML (โดยมีภาษาสเปนเป็นภาษารอง) และติดตั้ง ACF ไว้

คุณสามารถเรียกค้นโพสต์หลายภาษาพร้อมด้วยหัวเรื่อง รหัสภาษา และฟิลด์ ACF ที่กำหนดเองใน Gatsby ได้โดยใช้แบบสอบถาม GraphQL ง่ายๆ

export const doQuery = graphql`
  {
    wordpress {
      posts(where: {language: "en"}) {
        nodes {
          title
          language {
            code
          }
          postfields{
            subtitle
          }
          translations {
            title
            language {
              code
            }
            postfields{
              subtitle
            }
          }
        }
      }
    }
  }
`;

เริ่มต้นใช้งาน WPML GraphQL

หากต้องการใช้ WPML GraphQL คุณต้องมีแผน WPML Multilingual CMS หรือ WPML Multilingual Agency ทั้งสองแผนให้สิทธิ์เข้าถึงปลั๊กอิน WPML และส่วนเสริมเพิ่มเติมมากมาย โดยไม่มีค่าใช้จ่ายเพิ่มเติม

ดูว่าแผนใดเหมาะกับไซต์ของคุณที่สุด

ต้องการความช่วยเหลือหรือไม่?

หากคุณประสบปัญหาในการใช้ WPML GraphQL โปรดไปที่หน้า ปัญหาที่ทราบและวิธีแก้ไข ของเราเพื่อดูเคล็ดลับในการแก้ไขปัญหา

ยังต้องการความช่วยเหลือหรือไม่? ส่งตั๋วการสนับสนุน

โครงการที่เกี่ยวข้อง