スキーマチュートリアルレッスン9：（Gutenberg）ブロックの一括挿入／削除
レッスン9：（Gutenberg）ブロックの一括挿入／削除
投稿の（Gutenberg）ブロックのHTMLコンテンツを変更することで、投稿を更新できます。
とりわけ、キャンペーンのプロモーション（ブラックフライデーのディスカウント提供など）に役立ちます：
- キャンペーン前に、コールトゥアクションを含むカスタムブロック
mycompany:black-friday-campaign-videoを作成し、一括操作でウェブサイト内のすべての投稿に追加します - キャンペーン終了後、一括操作ですべての投稿からブロックを削除します
このチュートリアルレッスンのGraphQLクエリを動作させるには、エンドポイントに適用するスキーマ設定でネストされたミューテーションを有効にする必要があります
ブロックの一括挿入
このGraphQLクエリは、投稿内の3番目の段落ブロック（<!-- /wp:paragraph --> を検索して特定）を見つけ、その直後にカスタムブロックのHTMLコンテンツを配置します：
mutation InjectBlock(
$limit: Int! = 5,
$offset: Int! = 0
) {
posts: posts(
pagination: { limit: $limit, offset: $offset }
sort: { by: ID, order: ASC }
) {
id
rawContent
adaptedRawContent: _strRegexReplace(
in: $__rawContent,
searchRegex: "#(<!-- /wp:paragraph -->[\\s\\S]+<!-- /wp:paragraph -->[\\s\\S]+<!-- /wp:paragraph -->)#U",
replaceWith: "$1<!-- mycompany:black-friday-campaign-video -->\n<figure class=\"wp-block-video\"><video controls src=\"https://mysite.com/videos/BlackFriday2023.mp4\"></video></figure>\n<!-- /mycompany:black-friday-campaign-video -->",
limit: 1
)
update(input: {
contentAs: { html: $__adaptedRawContent },
}) {
status
errors {
__typename
...on ErrorPayload {
message
}
}
post {
id
rawContent
}
}
}
}さらに多くのオプションでブロックを挿入する
このGraphQLクエリは前のものと同様ですが、正規表現を動的に生成します。検索するブロックタイプと、何番目のブロックの後にカスタムブロックを配置するかを入力できます：
query CreateRegex(
$searchBlockType: String! = "wp:paragraph"
$injectAfterBlockCount: Int!
$injectBlockMarkup: String!
) {
endingBlockMarkup: _sprintf(
string: "<!-- /%s -->",
values: [$searchBlockType]
)
@remove
endingBlockMarkupArray: _arrayPad(
array: [],
length: $injectAfterBlockCount,
value: $__endingBlockMarkup
)
@remove
regexString: _arrayJoin(
array: $__endingBlockMarkupArray,
separator: "[\\s\\S]+"
)
@remove
regex: _sprintf(
string: "#(%s)#U",
values: [$__regexString]
)
@export(as: "regex")
@remove
replaceWith: _sprintf(
string: "$1%s",
values: [$injectBlockMarkup]
)
@export(as: "replaceWith")
@remove
}
mutation InjectBlock(
$limit: Int! = 5,
$offset: Int! = 0
$times: Int! = 1
)
@depends(on: "CreateRegex")
{
posts: posts(
pagination: { limit: $limit, offset: $offset }
sort: { by: ID, order: ASC }
) {
id
rawContent
adaptedRawContent: _strRegexReplace(
in: $__rawContent,
searchRegex: $regex,
replaceWith: $replaceWith,
limit: $times
)
update(input: {
contentAs: { html: $__adaptedRawContent },
}) {
status
errors {
__typename
...on ErrorPayload {
message
}
}
post {
id
rawContent
}
}
}
}variables ディクショナリはこのように指定します：
{
"injectBlockMarkup": "<!-- mycompany:black-friday-campaign-video -->\n<figure class=\"wp-block-video\"><video controls src=\"https://mysite.com/videos/BlackFriday2023.mp4\"></video></figure>\n<!-- /mycompany:black-friday-campaign-video -->",
"injectAfterBlockCount": 3
}- GraphQLクエリの開発／テスト中に、
@removeディレクティブの前に#を付けてコメントアウトすることで、レスポンスに正規表現パターンを出力できます：
{
field
# @remove <= Adding "#" before will disable the directive
}ブロックの一括削除
このGraphQLクエリは、カスタムブロックを含むすべての投稿を検索し、それらのHTMLソースからブロックを削除します：
mutation RemoveBlock {
posts(filter: { search: "\"<!-- /mycompany:black-friday-campaign-video -->\"" } ) {
id
rawContent
adaptedRawContent: _strRegexReplace(
in: $__rawContent,
searchRegex: "#(<!-- mycompany:black-friday-campaign-video -->[\\s\\S]+<!-- /mycompany:black-friday-campaign-video -->)#",
replaceWith: ""
)
update(input: {
contentAs: { html: $__adaptedRawContent },
}) {
status
errors {
__typename
...on ErrorPayload {
message
}
}
post {
id
rawContent
}
}
}
}さらに多くのオプションでブロックを削除する
このGraphQLクエリは前のものと同様ですが、正規表現を動的に生成します。削除するブロックタイプを入力できます：
query CreateVars(
$removeBlockType: String!
) {
regex: _sprintf(
string: "#(<!-- %1$s -->[\\s\\S]+<!-- /%1$s -->)#",
values: [$removeBlockType]
)
@export(as: "regex")
@remove
search: _sprintf(
string: "\"<!-- /%1$s -->\"",
values: [$removeBlockType]
)
@export(as: "search")
@remove
}
mutation RemoveBlock
@depends(on: "CreateVars")
{
posts(filter: { search: $search } ) {
id
rawContent
adaptedRawContent: _strRegexReplace(
in: $__rawContent,
searchRegex: $regex,
replaceWith: ""
)
update(input: {
contentAs: { html: $__adaptedRawContent },
}) {
status
errors {
__typename
...on ErrorPayload {
message
}
}
post {
id
rawContent
}
}
}
}variables ディクショナリはこのように指定します：
{
"removeBlockType": "mycompany:black-friday-campaign-video"
}