Bricks
Integrazione con il plugin Bricks.
Lo schema GraphQL è fornito con campi e mutation per recuperare e aggiornare i dati di Bricks da pagine e template.
Campi
Interroga i dati di Bricks di un custom post, recuperati tramite i seguenti campi aggiunti a tutti i tipi CustomPost (come Post, Page e GenericCustomPost):
bricksData
Inoltre, interroga i componenti Bricks tramite il campo radice bricksComponents.
bricksData
Il campo CustomPost.bricksData: [JSONObject!] recupera i dati di Bricks per il custom post, così come sono memorizzati da Bricks.
Eseguendo questa query:
{
post(by: { id: 1 }) {
bricksData
}
}...potrebbe produrre questa risposta:
{
"data": {
"post": {
"bricksData": [
{
"id": "oleqdy",
"name": "section",
"parent": 0,
"children": [
"uuiyqj"
],
"settings": []
},
{
"id": "uuiyqj",
"name": "container",
"parent": "oleqdy",
"children": [
"ejfwpo",
"czivwt",
"ucuzdk",
"wzcyug",
"ipoorm",
"zvgqxx",
"yrambp",
"hywkos",
"gdoiqo",
"tyksto",
"nquple",
"typize",
"fjiwqp"
],
"settings": []
},
{
"id": "ejfwpo",
"name": "post-title",
"parent": "uuiyqj",
"children": [],
"settings": {
"tag": "h1"
}
},
{
"id": "czivwt",
"name": "post-excerpt",
"parent": "uuiyqj",
"children": [],
"settings": []
},
{
"id": "hywkos",
"name": "post-comments",
"parent": "uuiyqj",
"children": [],
"settings": {
"title": true,
"avatar": true,
"formTitle": true,
"label": true,
"submitButtonStyle": "primary"
}
},
{
"id": "yrambp",
"name": "post-author",
"parent": "uuiyqj",
"children": [],
"settings": {
"avatar": true,
"name": true,
"website": true,
"bio": true,
"postsLink": true,
"postsStyle": "primary"
}
},
{
"id": "zvgqxx",
"name": "related-posts",
"parent": "uuiyqj",
"children": [],
"settings": {
"taxonomies": [
"category",
"post_tag"
],
"content": [
{
"dynamicData": "{post_title:link}",
"tag": "h3",
"dynamicMargin": {
"top": 10
},
"id": "a667d0"
},
{
"dynamicData": "{post_date}",
"id": "5bb1b2"
},
{
"dynamicData": "{post_excerpt:20}",
"dynamicMargin": {
"top": 10
},
"id": "80e288"
}
]
}
}
]
}
}
}Possiamo anche filtrare gli elementi per nome tramite il parametro filterBy, che accetta include ed exclude.
Eseguendo questa query:
{
post(by: { id: 1 }) {
bricksData(filterBy: {include: ["post-comments", "post-author"]})
}
}...produrrà questa risposta:
{
"data": {
"post": {
"bricksData": [
{
"id": "hywkos",
"name": "post-comments",
"parent": "uuiyqj",
"children": [],
"settings": {
"title": true,
"avatar": true,
"formTitle": true,
"label": true,
"submitButtonStyle": "primary"
}
},
{
"id": "yrambp",
"name": "post-author",
"parent": "uuiyqj",
"children": [],
"settings": {
"avatar": true,
"name": true,
"website": true,
"bio": true,
"postsLink": true,
"postsStyle": "primary"
}
}
]
}
}
}Puoi sostituire qualsiasi componente globale di Bricks con i corrispondenti elementi Bricks, passando il parametro replaceComponents: true:
{
post(by: { id: 1 }) {
bricksData(replaceComponents: true)
}
}bricksComponents
Il campo Root.bricksComponents: [JSONObject!]! recupera i dati di Bricks per i componenti globali, così come sono memorizzati da Bricks sotto l'opzione bricks_components.
Eseguendo questa query:
{
bricksComponents
}...potrebbe produrre questa risposta:
[
{
"id": "fufxfs",
"category": "",
"desc": "",
"elements": [
{
"id": "fufxfs",
"name": "container",
"settings": {
"_width": "50%",
"_alignItems": "flex-start",
"_padding": {
"left": "",
"right": 50
},
"_width:mobile_portrait": "100%",
"_padding:tablet_portrait": {
"right": "25"
},
"_padding:mobile_portrait": {
"right": "0"
},
"_alignSelf": "center",
"_order:mobile_portrait": "2",
"_margin:mobile_portrait": {
"top": "60"
},
"_flexShrink": "0"
},
"children": [
"e8fab6",
"52c06c"
],
"parent": 0,
"label": "Icons"
},
{
"id": "e8fab6",
"name": "icon-box",
"settings": {
"icon": {
"library": "fontawesomeSolid",
"icon": "fas fa-check-square"
},
"content": "<h4>Business Professionals<\/h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit aliquam.<\/p>",
"textAlign": "left",
"iconPosition": "left",
"verticalAlign": "flex-start",
"_padding": {
"top": "20",
"right": "20",
"bottom": "20",
"left": 20
},
"_background": {
"color": {
"hex": "#ffffff"
}
},
"_border": {
"width": {
"top": "1",
"right": "1",
"bottom": "1",
"left": "1"
},
"style": "solid",
"radius": {
"top": "10"
},
"color": {
"hex": "#f2f2f2"
}
},
"typographyHeading": {
"font-size": "16px",
"font-family": "Open Sans",
"font-weight": "600",
"color": {
"hex": "#30354a"
}
},
"iconColor": {
"hex": "#ff57a2"
},
"iconSize": "20px",
"contentMargin": {
"top": 8
},
"_boxShadow": {
"values": {
"offsetX": "2",
"offsetY": "2",
"blur": "25"
},
"color": {
"hex": "#000000",
"rgb": "rgba(0, 0, 0, 0.11)",
"hsl": "hsla(0, 0%, 0%, 0.11)"
}
},
"typographyBody": {
"color": {
"hex": "#919191"
},
"font-size": "13px",
"font-family": "Open Sans"
},
"iconPadding": {
"top": "15",
"right": "15",
"bottom": "15",
"left": "15"
},
"iconBackgroundColor": {
"hex": "#ff57a2",
"rgb": "rgba(255, 87, 162, 0.2)",
"hsl": "hsla(333, 100%, 67%, 0.2)"
},
"iconBorder": {
"radius": {
"top": "100",
"right": "100",
"bottom": "100",
"left": "100"
}
},
"_boxShadow:hover": {
"values": {
"offsetX": "2",
"offsetY": "2",
"blur": "15"
},
"color": {
"hex": "#000000",
"rgb": "rgba(0, 0, 0, 0.2)",
"hsl": "hsla(0, 0%, 0%, 0.2)"
}
}
},
"children": [],
"parent": "fufxfs"
},
{
"id": "52c06c",
"name": "icon-box",
"settings": {
"icon": {
"library": "fontawesomeSolid",
"icon": "fas fa-check-square"
},
"content": "<h4>Cloud Services<\/h4><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit aliquam.<\/p>",
"textAlign": "left",
"iconPosition": "left",
"verticalAlign": "flex-start",
"_padding": {
"top": "20",
"right": "20",
"bottom": "20",
"left": 20
},
"_background": {
"color": {
"hex": "#ffffff"
}
},
"_border": {
"width": {
"top": "1",
"right": "1",
"bottom": "1",
"left": "1"
},
"style": "solid",
"radius": {
"top": "10"
},
"color": {
"hex": "#f2f2f2"
}
},
"typographyHeading": {
"font-size": "16px",
"font-family": "Open Sans",
"font-weight": "600",
"color": {
"hex": "#30354a"
},
"line-height": "1none"
},
"iconColor": {
"hex": "#3d30ba"
},
"iconSize": "20px",
"contentMargin": {
"top": 8
},
"_boxShadow": {
"values": {
"offsetX": "2",
"offsetY": "2",
"blur": "25"
},
"color": {
"hex": "#000000",
"rgb": "rgba(0, 0, 0, 0.11)",
"hsl": "hsla(0, 0%, 0%, 0.11)"
}
},
"typographyBody": {
"color": {
"hex": "#919191"
},
"font-size": "13px",
"font-family": "Open Sans"
},
"iconPadding": {
"top": "15",
"right": "15",
"bottom": "15",
"left": "15"
},
"iconBackgroundColor": {
"hex": "#3e30bb",
"rgb": "rgba(62, 48, 187, 0.2)",
"hsl": "hsla(246, 59%, 46%, 0.2)"
},
"iconBorder": {
"radius": {
"top": "100",
"right": "100",
"bottom": "100",
"left": "100"
}
},
"_margin": {
"top": 30
},
"_boxShadow:hover": {
"values": {
"offsetX": "2",
"offsetY": "2",
"blur": "15"
},
"color": {
"hex": "#000000",
"rgb": "rgba(0, 0, 0, 0.2)",
"hsl": "hsla(0, 0%, 0%, 0.2)"
}
}
},
"children": [],
"parent": "fufxfs"
}
],
"properties": [],
"_created": 1750156913,
"_user_id": 1,
"_version": "2.0-beta"
}
]Mutation
Aggiorna i dati di Bricks per un custom post tramite queste mutation:
bricksSetCustomPostElementData imposta i dati di Bricks per il custom post, aspettandosi un JSON con lo stesso formato utilizzato da Bricks.
bricksMergeCustomPostElementDataItem sovrascrive il valore di elementi specifici dei dati di Bricks di un custom post.
bricksRegenerateCustomPostElementIDSet rigenera gli ID degli elementi nei dati di Bricks di un custom post.