כיצד לתשאל תוכן רב-לשוני עם WPGraphQL – סינון שפות ותרגומים

לפני שתתחיל

התקן והפעל את התוספים הבאים:

• WPGraphQL (תוסף הקוד הפתוח ממיזם WPGraphQL).
• WPML ו־WPML תרגום מחרוזות.
• WPML GraphQL (התוסף הנלווה שדף זה עוסק בו).

אם אתה משתמש גם ב־Advanced Custom Fields:

• Advanced Custom Fields Multilingual (ACFML).
• WPGraphQL for Advanced Custom Fields (ממיזם WPGraphQL).

תוכן המקור שלך צריך להיות מתורגם ב־WPML לפני שהשאילתות להלן יוכלו להחזיר משהו. כאשר המצב תרגם הכל אוטומטית מופעל (ברירת המחדל ב־WPML 5), התרגומים מופקים ברקע עם פרסום התוכן. עבור הגדרה ידנית, שלח תוכן לתרגום מתוך WPML > תרגומים > לוח בקרה. הפוסטים והמונחים המתורגמים הם אלו ששאילתות ה־GraphQL להלן מסננות ומחזירות.

סביבת הפיתוח (IDE) של GraphQL – היכן לבדוק שאילתות

WPGraphQL מוסיף את המסך GraphQL > GraphQL IDE לאזור הניהול של WordPress. מרכיב השאילתות (Query Composer) של סביבת הפיתוח מפרט כל שדה זמין, כולל הארגומנט language והשדה translations של WPML, ומריץ שאילתות מול האתר הפעיל שלך. בדוק שאילתות שם לפני שתשלב אותן בתשתית צד הלקוח (front-end) שלך.

תשאול תוכן לפי שפה

הוסף where: { language: "<code>" } לכל שאילתת רשימה: פוסטים, סוגי תוכן מותאמים אישית, מונחי טקסונומיה, תפריטים, פריטי תפריט, תגובות. קוד השפה הוא אותו קוד שבו WPML משתמש בכל מקום (en, es, fr, pt-pt וכדומה). העבירו את language: "all" כדי להחזיר תוכן מכל השפות בבת אחת.

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

כאשר צומת (node) ברמה העליונה מסונן לפי שפה, פריטים מקושרים (קטגוריות, תגיות, טקסונומיות מותאמות אישית) עוקבים אוטומטית אחר אותה שפה. השאילתה לעיל מחזירה פוסטים בספרדית עם קטגוריות בספרדית, ללא צורך בארגומנטים נוספים.

אחזור כל תרגום של צומת בשאילתה אחת

הוסף את השדה translations לכל שאילתת פוסט או טקסונומיה כדי להחזיר את הגרסאות בשפות האחרות של הצומת באותה תגובה (payload):

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

כל פוסט חוזר עם השדות שלו באנגלית, בנוסף למערך של מזהי הכתובת (slugs) וכתובות ה־URI שלו בשפות אחרות. זהו המבנה שבו משתמש בורר שפות המוצג לצד תוכן העמוד: בקשה אחת, וכל חלופה שהמבקר יכול לעבור אליה.

תשאול פוסט ספציפי לפי מזהה (ID) או מזהה כתובת (Slug) בכל שפה

כדי לאחזר פוסט מתורגם יחיד ישירות (לפי מזהה הכתובת המתורגם שלו או לפי מזהה מסד הנתונים), השתמש בשאילתת post היחידנית עם idType:

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

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

שתי השאילתות מחזירות את הפוסט המתורגם (כותרת, מזהה כתובת, URI) ללא סינון נוסף בצד הלקוח.

תפריטים רב-לשוניים

תשאל תפריטים ופריטי תפריט לפי שפה עם אותו ארגומנט language:

query NavES {
  menu(language: "es", id: "primary", idType: SLUG) {
    menuItems {
      nodes {
        label
        url
        path
      }
    }
  }
}

ה־label וה־url של כל פריט תפריט חוזרים בשפה שתשאלת. פריטי תפריט המקשרים לפוסטים מתורגמים מפנים אוטומטית לכתובת ה־URI המתורגמת. תמיכה זו נוספה בגרסה WPML GraphQL 1.1.0.

שפות מותקנות – עבור בורר שפות

עבור בורר שפות גלובלי (שאינו תלוי בפוסט בודד כלשהו), השתמש בשאילתות languages ו־defaultLanguage כדי לפרט כל שפה באתר:

query SiteLanguages {
  languages {
    code
    country_flag_url
    default_locale
    native_name
    translated_name
    url
  }
  defaultLanguage {
    code
    native_name
  }
}

הפעולה מחזירה צומת אחד לכל שפה פעילה עם כתובת ה־URL של הדגל, השם המקורי, השם המתורגם וכתובת ה־URL של דף הבית של השפה. אלו מספיק נתונים כדי להציג בורר שפות עם דגל ותווית מבלי לקודד את רשימת השפות באופן קשיח (hard-coding).

תשאול שדות מותאמים אישית של ACF לפי שפה

כאשר התוספים ACFML ו־WPGraphQL for ACF פעילים, שדות ACF בפוסטים ובסוגי תוכן מותאמים אישית עוקבים אוטומטית אחר שפת הפוסט המארח. אין צורך בארגומנט נוסף. עבור ACF Options Pages (עמודי אפשרויות של ACF), שאינם קשורים לפוסט בודד, הוסף את הארגומנט language לשאילתת עמוד האפשרויות:

query Settings {
  myOptionPage(language: "de") {
    addressFieldGroup {
      addressTitle
      repeaterAddressDetails { addressDetails }
    }
  }
}

הארגומנט מצפה לקוד שפה שתואם לאחת מהשפות הפעילות באתר שלך.

מגבלות ידועות ופתרונות עוקפים

• מטא-נתונים של מחברים ומשתמשים אינם מחזירים ערכים מתורגמים. אם אתה מציג קורות חיים (bios) של מחברים לפי שפה, אחסן את קורות החיים המתורגמים בשדה ACF של המשתמש ותשאל את השדה הזה במקום זאת.
• כתובות URI מתורגמות בחלק ממבני השאילתות. בעת אחזור פוסט מתורגם לפי URI (contentNode(id: "/de/some-slug/", idType: URI)), ודא שכתובת ה־URI המוחזרת תואמת למה שפורסם בשפה – חלק ממבני השאילתות מחזירים נתיבים שאינם עקביים. בדוק בסביבת הפיתוח (IDE) של GraphQL לפני שילוב במערכת הניתוב (routing).
• ACF Options Pages ללא הארגומנט language חוזרים לשפת ברירת המחדל. העבירו תמיד את language עבור שאילתות עמוד אפשרויות באתרים רב-לשוניים.

אם אתה נתקל בבעיית שילוב שאינה מפורטת כאן, צוות התמיכה של WPML מספק מענה לצד של WPML במחסנית WPGraphQL, 24/7.