AMP HTML CODE
-
Hey, i am implementing the custom wp story editor and thanks to good docs, i have been able to perfectly integrate the preview and all.. but now problem arises when i need to copy the amp html,.. how can i get the perfect amp code that will preserve all animations, style and other things?? Bcs currently when i copy amp html by saving the story in local storage it is not showing next an dprev button, also are not auto incrementing.. I tried copying the page structure (cmd+shift+alt+j) and pasting it in wp and then saving it and then getting amp html form php my admin, but the result is still dame. Can you help to me the perfect amp html code?
Viewing 4 replies - 1 through 4 (of 4 total)
-
Hi there,
Thanks for reaching out. That’s interesting. Normally, the story editor (either in WordPress or a custom one) creates the full AMP markup upon saving that should already give you the full Web Stories experience out of the box. The WordPress plugin itself only builds on top of that existing markup by further optimizing it by using the AMP Optimizer.
But what you get upon save, in localStorage, should already be enough. I think the only thing that isn’t in that markup is the
<!DOCTYPE html>part and a<link rel="canonical">tag. I just tested this in our storybook and validator.amp.dev and the markup was fully valid.So not sure what’s going on with your custom implementation. I would need some more information, like a sample of the generated code or a way to reproduce this, in order to be able to help.
This is my story content that i am passing:
{
"current": "uuid-0x1j219yw",
"selection": [],
"story": {
"globalStoryStyles": {
"colors": [],
"textStyles": []
}
},
"version": 47,
"pages": [
{
"elements": [
{
"x": 48,
"y": 0,
"width": 330,
"height": 467,
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"type": "image",
"id": "uuid-7nfpgog74",
"scale": 100,
"focalX": 17.722167968749996,
"focalY": 50.09089889622336,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"src": "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=600&fit=crop",
"alt": "background image",
"width": 400,
"height": 600,
"sizes": {
"full": {
"sourceUrl": "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=600&fit=crop",
"mimeType": "image/jpeg",
"width": 400,
"height": 600
}
}
},
"overlay": {
"type": "radial",
"size": {
"w": 0.67,
"h": 0.67
},
"stops": [
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0
},
"position": 0
},
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"position": 1
}
],
"alpha": 0.4
}
},
{
"x": 29,
"y": 421,
"width": 355,
"height": 64,
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Gelasio",
"fallbacks": [
"serif"
],
"weights": [
400,
500,
600,
700
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
]
],
"service": "fonts.google.com",
"metrics": {
"upm": 2048,
"asc": 1900,
"des": -700
}
},
"backgroundColor": {
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0.3
}
},
"lineHeight": 0.88,
"textAlign": "center",
"type": "text",
"id": "uuid-1gc3vng0l",
"content": "<span style=\"font-weight: 700; color: #fff\">Beyond the Boundary: The Funniest, Fiercest, and Most Fabulous Zimbabwe Cricket Players!</span>",
"fontSize": 30,
"padding": {
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
}
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"scale": 100,
"focalX": 50,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"src": "https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=80&h=80&fit=crop",
"alt": "publisher logo",
"width": 80,
"height": 80,
"sizes": {
"full": {
"sourceUrl": "https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=80&h=80&fit=crop",
"mimeType": "image/jpeg",
"width": 80,
"height": 80
}
}
},
"x": 21,
"y": -28,
"width": 79,
"height": 79,
"type": "image",
"mask": {
"type": "rectangle"
},
"id": "uuid-gfuyzurur"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "BioRhyme",
"fallbacks": [
"serif"
],
"weights": [
200,
300,
400,
500,
600,
700,
800
],
"styles": [
"regular"
],
"variants": [
[
0,
200
],
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
]
],
"service": "fonts.google.com"
},
"fontSize": 22,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "left",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"color: #fff\">By Stumped Storyteller Sam</span>",
"x": 106,
"y": 582,
"width": 208,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"type": "text",
"height": 34,
"id": "uuid-um8ji2lhd"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "BioRhyme",
"fallbacks": [
"serif"
],
"weights": [
200,
300,
400,
500,
600,
700,
800
],
"styles": [
"regular"
],
"variants": [
[
0,
200
],
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
]
],
"service": "fonts.google.com"
},
"fontSize": 22,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "left",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #f4cc4a\">July 11, 2025</span>",
"x": 106,
"y": 384,
"width": 208,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"height": 26,
"id": "uuid-9c2t8pdhr",
"type": "text"
}
],
"animations": [],
"type": "page",
"id": "uuid-ved4xk3e9",
"backgroundColor": {
"color": {
"r": 58,
"g": 86,
"b": 110
}
},
"pageTemplateType": "cover"
},
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"scale": 100,
"focalX": 17.722167968749996,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"src": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"alt": "content background image",
"width": 200,
"height": 300,
"sizes": {
"full": {
"sourceUrl": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"mimeType": "image/jpeg",
"width": 200,
"height": 300
}
}
},
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 48,
"y": 0,
"width": 330,
"height": 247,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"id": "uuid-3xtowxngb",
"overlay": {
"type": "radial",
"size": {
"w": 0.67,
"h": 0.67
},
"stops": [
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0
},
"position": 0.4
},
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"position": 1
}
],
"alpha": 0.5
},
"type": "image"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": false,
"backgroundColor": {
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0.75
}
},
"width": 380,
"height": 153,
"x": 16,
"y": 444,
"mask": {
"type": "rectangle"
},
"id": "uuid-z49jcxt64",
"borderRadius": {
"locked": true,
"topLeft": 28,
"topRight": 28,
"bottomRight": 28,
"bottomLeft": 28
},
"border": {
"locked": true,
"color": {
"color": {
"r": 224,
"g": 110,
"b": 4
}
},
"left": 3,
"right": 3,
"top": 0,
"bottom": 0,
"lockedWidth": false
},
"type": "shape"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Merriweather",
"fallbacks": [
"serif"
],
"weights": [
300,
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
300
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 14,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "left",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #fff\">Zimbabwean cricket has faced tough times, but guess what? It's always given us players with huge hearts! They play with incredible flair and make the game exciting. Get ready to meet some real legends who made us cheer like crazy!</span>",
"x": 34,
"y": 489,
"width": 345,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"height": 88,
"id": "uuid-s6pfnsv00",
"type": "text"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Alegreya",
"fallbacks": [
"serif"
],
"weights": [
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 26,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "center",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #ffbc35\">1. Heart & Flair!</span>",
"x": 48,
"y": 454,
"width": 315,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"type": "text",
"height": 35,
"id": "uuid-12bov253n",
"tagName": "p"
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"animations": [
{
"id": "ebe47744-8566-4e19-a3a3-5a552c2ee63b",
"type": "effect-background-zoom",
"zoomDirection": "scaleOut",
"duration": 2000,
"delay": 0,
"targets": [
"uuid-3xtowxngb"
]
},
{
"id": "4e895228-a644-4d35-b1ea-e146db444302",
"type": "effect-fly-in",
"flyInDir": "bottomToTop",
"duration": 2000,
"delay": 0,
"targets": [
"uuid-z49jcxt64"
]
},
{
"id": "7754521e-0a4e-4469-96ff-949e409c35a1",
"type": "effect-fly-in",
"flyInDir": "leftToRight",
"duration": 1900,
"delay": 0,
"targets": [
"uuid-s6pfnsv00"
]
},
{
"id": "64dba00f-4dbb-4b99-8025-acb14e4750e8",
"type": "effect-fly-in",
"flyInDir": "leftToRight",
"duration": 1900,
"delay": 0,
"targets": [
"uuid-12bov253n"
]
}
],
"id": "uuid-cky119c6u",
"pageTemplateType": "content"
},
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"scale": 100,
"focalX": 17.722167968749996,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"src": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"alt": "content background image",
"width": 200,
"height": 300,
"sizes": {
"full": {
"sourceUrl": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"mimeType": "image/jpeg",
"width": 200,
"height": 300
}
}
},
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 48,
"y": 0,
"width": 330,
"height": 247,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"id": "uuid-tgykeci5g",
"overlay": {
"type": "radial",
"size": {
"w": 0.67,
"h": 0.67
},
"stops": [
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0
},
"position": 0.4
},
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"position": 1
}
],
"alpha": 0.5
},
"type": "image"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": false,
"backgroundColor": {
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0.75
}
},
"width": 380,
"height": 153,
"x": 16,
"y": 444,
"mask": {
"type": "rectangle"
},
"id": "uuid-mh0feuovx",
"borderRadius": {
"locked": true,
"topLeft": 28,
"topRight": 28,
"bottomRight": 28,
"bottomLeft": 28
},
"border": {
"locked": true,
"color": {
"color": {
"r": 224,
"g": 110,
"b": 4
}
},
"left": 3,
"right": 3,
"top": 0,
"bottom": 0,
"lockedWidth": false
},
"type": "shape"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Merriweather",
"fallbacks": [
"serif"
],
"weights": [
300,
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
300
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 14,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "left",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #fff\">Remember Brendan Taylor? He was an explosive wicketkeeper-batsman, a true game-changer! His fearless hitting was amazing. Those back-to-back hundreds in the 2015 World Cup? Pure fireworks! He showed us that anything is truly possible on the field. What a star!</span>",
"x": 34,
"y": 489,
"width": 345,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"height": 88,
"id": "uuid-3zrt0qh7j",
"type": "text"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Alegreya",
"fallbacks": [
"serif"
],
"weights": [
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 26,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "center",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #ffbc35\">2. The Explosive Scorer!</span>",
"x": 48,
"y": 454,
"width": 315,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"type": "text",
"height": 35,
"id": "uuid-4rwqetb6s",
"tagName": "p"
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"animations": [
{
"id": "eebdb6ad-b722-4cfd-a6ae-a51553914adf",
"type": "effect-background-zoom",
"zoomDirection": "scaleOut",
"duration": 2000,
"delay": 0,
"targets": [
"uuid-tgykeci5g"
]
},
{
"id": "0bd4a80e-b564-4e8c-8198-6235b0a04767",
"type": "effect-fly-in",
"flyInDir": "leftToRight",
"duration": 1900,
"delay": 0,
"targets": [
"uuid-4rwqetb6s"
]
},
{
"id": "d67bd043-ce71-41af-92dc-f3fd6a725408",
"type": "effect-fly-in",
"flyInDir": "leftToRight",
"duration": 1900,
"delay": 0,
"targets": [
"uuid-3zrt0qh7j"
]
},
{
"id": "59bc859f-eaf0-450f-837c-3fb8a19b6843",
"type": "effect-fly-in",
"flyInDir": "bottomToTop",
"duration": 2000,
"delay": 0,
"targets": [
"uuid-mh0feuovx"
]
}
],
"id": "uuid-0x1j219yw",
"pageTemplateType": "content"
},
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"scale": 100,
"focalX": 17.722167968749996,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"src": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"alt": "content background image",
"width": 200,
"height": 300,
"sizes": {
"full": {
"sourceUrl": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"mimeType": "image/jpeg",
"width": 200,
"height": 300
}
}
},
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 48,
"y": 0,
"width": 330,
"height": 247,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"id": "uuid-gv6928oy7",
"overlay": {
"type": "radial",
"size": {
"w": 0.67,
"h": 0.67
},
"stops": [
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0
},
"position": 0.4
},
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"position": 1
}
],
"alpha": 0.5
},
"type": "image"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": false,
"backgroundColor": {
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0.75
}
},
"width": 380,
"height": 153,
"x": 16,
"y": 444,
"mask": {
"type": "rectangle"
},
"id": "uuid-lkfdj853x",
"borderRadius": {
"locked": true,
"topLeft": 28,
"topRight": 28,
"bottomRight": 28,
"bottomLeft": 28
},
"border": {
"locked": true,
"color": {
"color": {
"r": 224,
"g": 110,
"b": 4
}
},
"left": 3,
"right": 3,
"top": 0,
"bottom": 0,
"lockedWidth": false
},
"type": "shape"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Merriweather",
"fallbacks": [
"serif"
],
"weights": [
300,
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
300
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 14,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "left",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #fff\">Meet Grant Flower, the super elegant left-handed batsman! He was a rock for Zimbabwe, part of that famous Flower brothers team. His stylish moves and perfect technique were pure joy to watch. He held records for ages. And get this: he even scored a hundred against India as an opener!</span>",
"x": 34,
"y": 489,
"width": 345,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"height": 88,
"id": "uuid-i24vt3mgx",
"type": "text"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Alegreya",
"fallbacks": [
"serif"
],
"weights": [
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 26,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "center",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #ffbc35\">3. Elegant Grant!</span>",
"x": 48,
"y": 454,
"width": 315,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"type": "text",
"height": 35,
"id": "uuid-g55xsfffc",
"tagName": "p"
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"animations": [],
"id": "uuid-w3vykb399",
"pageTemplateType": "content"
},
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"scale": 100,
"focalX": 17.722167968749996,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"src": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"alt": "content background image",
"width": 200,
"height": 300,
"sizes": {
"full": {
"sourceUrl": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"mimeType": "image/jpeg",
"width": 200,
"height": 300
}
}
},
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 48,
"y": 0,
"width": 330,
"height": 247,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"id": "uuid-wwunxfjxc",
"overlay": {
"type": "radial",
"size": {
"w": 0.67,
"h": 0.67
},
"stops": [
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0
},
"position": 0.4
},
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"position": 1
}
],
"alpha": 0.5
},
"type": "image"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": false,
"backgroundColor": {
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0.75
}
},
"width": 380,
"height": 153,
"x": 16,
"y": 444,
"mask": {
"type": "rectangle"
},
"id": "uuid-5p5n0gw2v",
"borderRadius": {
"locked": true,
"topLeft": 28,
"topRight": 28,
"bottomRight": 28,
"bottomLeft": 28
},
"border": {
"locked": true,
"color": {
"color": {
"r": 224,
"g": 110,
"b": 4
}
},
"left": 3,
"right": 3,
"top": 0,
"bottom": 0,
"lockedWidth": false
},
"type": "shape"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Merriweather",
"fallbacks": [
"serif"
],
"weights": [
300,
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
300
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 14,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "left",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #fff\">Next up is Tatenda Taibu, our pint-sized dynamo! He was the youngest Test captain ever. Don't let his size fool you; he was a livewire behind the stumps and a brave batsman. His energy and passion were contagious. He even played for Lancashire! What an inspiring player!</span>",
"x": 34,
"y": 489,
"width": 345,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"height": 88,
"id": "uuid-n7uknyk14",
"type": "text"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Alegreya",
"fallbacks": [
"serif"
],
"weights": [
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 26,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "center",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #ffbc35\">4. Small Guy, Big Heart!</span>",
"x": 48,
"y": 454,
"width": 315,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"type": "text",
"height": 35,
"id": "uuid-0v6wwivor",
"tagName": "p"
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"animations": [],
"id": "uuid-e5ddohsgo",
"pageTemplateType": "content"
},
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"scale": 100,
"focalX": 17.722167968749996,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"src": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"alt": "content background image",
"width": 200,
"height": 300,
"sizes": {
"full": {
"sourceUrl": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"mimeType": "image/jpeg",
"width": 200,
"height": 300
}
}
},
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 48,
"y": 0,
"width": 330,
"height": 247,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"id": "uuid-sx1n6eluf",
"overlay": {
"type": "radial",
"size": {
"w": 0.67,
"h": 0.67
},
"stops": [
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0
},
"position": 0.4
},
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"position": 1
}
],
"alpha": 0.5
},
"type": "image"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": false,
"backgroundColor": {
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0.75
}
},
"width": 380,
"height": 153,
"x": 16,
"y": 444,
"mask": {
"type": "rectangle"
},
"id": "uuid-bgxzsvafc",
"borderRadius": {
"locked": true,
"topLeft": 28,
"topRight": 28,
"bottomRight": 28,
"bottomLeft": 28
},
"border": {
"locked": true,
"color": {
"color": {
"r": 224,
"g": 110,
"b": 4
}
},
"left": 3,
"right": 3,
"top": 0,
"bottom": 0,
"lockedWidth": false
},
"type": "shape"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Merriweather",
"fallbacks": [
"serif"
],
"weights": [
300,
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
300
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 14,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "left",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #fff\">Ever faced a wily spinner? Ray Price was just that! His left-arm spins, with their tricky action, fooled so many batsmen. He was a late starter but became super important for Zimbabwe. He frustrated top players with his clever variations and spot-on accuracy. What a magician!</span>",
"x": 34,
"y": 489,
"width": 345,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"height": 88,
"id": "uuid-qf9oxf63f",
"type": "text"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Alegreya",
"fallbacks": [
"serif"
],
"weights": [
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 26,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "center",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #ffbc35\">5. Wily Spinner!</span>",
"x": 48,
"y": 454,
"width": 315,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"type": "text",
"height": 35,
"id": "uuid-9e0rfdatj",
"tagName": "p"
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"animations": [],
"id": "uuid-fk5jkiylq",
"pageTemplateType": "content"
},
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"scale": 100,
"focalX": 17.722167968749996,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"src": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"alt": "content background image",
"width": 200,
"height": 300,
"sizes": {
"full": {
"sourceUrl": "https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop",
"mimeType": "image/jpeg",
"width": 200,
"height": 300
}
}
},
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 48,
"y": 0,
"width": 330,
"height": 247,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"id": "uuid-hr936mtcm",
"overlay": {
"type": "radial",
"size": {
"w": 0.67,
"h": 0.67
},
"stops": [
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0
},
"position": 0.4
},
{
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"position": 1
}
],
"alpha": 0.5
},
"type": "image"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": false,
"backgroundColor": {
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 0.75
}
},
"width": 380,
"height": 153,
"x": 16,
"y": 444,
"mask": {
"type": "rectangle"
},
"id": "uuid-eqqj6j4kz",
"borderRadius": {
"locked": true,
"topLeft": 28,
"topRight": 28,
"bottomRight": 28,
"bottomLeft": 28
},
"border": {
"locked": true,
"color": {
"color": {
"r": 224,
"g": 110,
"b": 4
}
},
"left": 3,
"right": 3,
"top": 0,
"bottom": 0,
"lockedWidth": false
},
"type": "shape"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Merriweather",
"fallbacks": [
"serif"
],
"weights": [
300,
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
300
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 14,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "left",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #fff\">So, there you have it! Just a few of the absolute superstars from Zimbabwe who made us cheer our hearts out. Their passion, skill, and sheer grit gave us so many unforgettable moments. They truly are legends who will always be remembered for lighting up the cricket pitch. Keep cheering!</span>",
"x": 34,
"y": 489,
"width": 345,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"height": 88,
"id": "uuid-426zwkeau",
"type": "text"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Alegreya",
"fallbacks": [
"serif"
],
"weights": [
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com"
},
"fontSize": 26,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.2,
"textAlign": "center",
"padding": {
"locked": true,
"hasHiddenPadding": false,
"horizontal": 0,
"vertical": 0
},
"content": "<span style=\"font-weight: 700; color: #ffbc35\">6. Our Cheering Superstars!</span>",
"x": 48,
"y": 454,
"width": 315,
"borderRadius": {
"locked": true,
"topLeft": 2,
"topRight": 2,
"bottomRight": 2,
"bottomLeft": 2
},
"type": "text",
"height": 35,
"id": "uuid-xv5rl1ziy",
"tagName": "p"
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"animations": [],
"id": "uuid-wd0hyhnax",
"pageTemplateType": "content"
}
]
}This is the html:
<html amp="" lang="en"><head>
<meta charset="utf-8">
<meta name="description" content="Beyond the Boundary: The Funniest, Fiercest, and Most Fabulous Zimbabwe Cricket Players! - Interactive web story with navigation and auto-advance">
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Article",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "http://localhost:3000"
},
"headline": "Beyond the Boundary: The Funniest, Fiercest, and Most Fabulous Zimbabwe Cricket Players!",
"datePublished": "2025-07-11T17:50:25.613Z",
"dateModified": "2025-07-11T17:50:25.613Z",
"author": {
"@type": "Organization",
"name": "Beyond the Boundary: The Funniest, Fiercest, and Most Fabulous Zimbabwe Cricket Players!"
},
"publisher": {
"@type": "Organization",
"name": "Beyond the Boundary: The Funniest, Fiercest, and Most Fabulous Zimbabwe Cricket Players!",
"logo": {
"@type": "ImageObject",
"url": "https://example.com/logo.png"
}
}
}
</script>
<link rel="canonical" href="http://localhost:3000"><meta charSet="utf-8"/><meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"/><script async="" src="https://cdn.ampproject.org/v0.js"></script><script async="" src="https://cdn.ampproject.org/v0/amp-story-1.0.js" custom-element="amp-story"></script><link href="https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=600&fit=crop" rel="preload" as="image"/><meta name="web-stories-replace-head-start"/><title>Beyond the Boundary: The Funniest, Fiercest, and Most Fabulous Zimbabwe Cricket Players!</title><meta name="web-stories-replace-head-end"/><link href="https://fonts.googleapis.com/css2?display=swap&family=Gelasio%3Awght%40700&family=BioRhyme%3Awght%40400%3B700&family=Merriweather%3Awght%40700&family=Alegreya%3Awght%40700" rel="stylesheet"/><style amp-boilerplate="">body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate="">body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript><style amp-custom="">
h1, h2, h3 { font-weight: normal; }
amp-story-page {
background-color: #131516;
}
amp-story-grid-layer {
overflow: visible;
}
@media (max-aspect-ratio: 9 / 16) {
@media (min-aspect-ratio: 320 / 678) {
amp-story-grid-layer.grid-layer {
margin-top: calc((100% / 0.5625 - 100% / 0.6666666666666666) / 2);
}
}
}
@media not all and (min-resolution:.001dpcm) {
@media {
p.text-wrapper > span {
font-size: calc(100% - 0.5px);
}
}
}
.page-fullbleed-area,
.page-background-overlay-area {
position: absolute;
overflow: hidden;
width: 100%;
left: 0;
height: calc(1.1851851851851851 * 100%);
top: calc((1 - 1.1851851851851851) * 100% / 2);
}
.element-overlay-area {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.page-safe-area {
overflow: visible;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: calc(0.84375 * 100%);
margin: auto 0;
}
.mask {
position: absolute;
overflow: hidden;
}
.fill {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: 0;
}
@media (prefers-reduced-motion: no-preference) {
.animation-wrapper {
opacity: var(--initial-opacity);
transform: var(--initial-transform);
}
}
amp-story-grid-layer.align-bottom {
align-content: end;
padding: 0;
/*
AMP CTA Layer will exactly occupy 74px regardless of any device.
To space out captions 74px from the BOTTOM (AMP CTA Layer),
74px from the TOP should also be spaced out and thus: 2 * 74px
will be the desired max-height.
*/
max-height: calc(100vh - (2 * 74px));
}
.captions-area {
padding: 0 32px 0;
}
amp-story-captions {
margin-bottom: 16px;
text-align: center;
}
amp-story-audio-sticker {
height: 100%;
}
.audio-sticker {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
}
</style> <style amp-custom>
/* Ensure navigation buttons are visible and functional */
amp-story-page {
cursor: pointer;
}
/* Enable touch navigation */
amp-story {
touch-action: manipulation;
}
/* Auto-advance progress indicator */
amp-story-page[active] .i-amphtml-story-page-progress-bar {
animation: story-progress 7s linear;
}
@keyframes story-progress {
from { width: 0%; }
to { width: 100%; }
}
</style>
</head><body><amp-story standalone="" publisher="" publisher-logo-src="" title="Beyond the Boundary: The Funniest, Fiercest, and Most Fabulous Zimbabwe Cricket Players!" poster-portrait-src=""><amp-story-page id="uuid-ved4xk3e9" auto-advance-after="7s"><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area" style="background-color:#3a566e"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:0;top:-9.25926%;width:100%;height:118.51852%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" class="mask" id="el-uuid-7nfpgog74"><div style="position:absolute;width:118.51852%;height:100%;left:0%;top:0%" data-leaf-element="true"><amp-img layout="fill" src="https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=600&fit=crop" alt="background image" srcSet="https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=400&h=600&fit=crop 400w" sizes="(min-width: 1024px) 57vh, 126vw" disable-inline-width=""></amp-img></div><div class="element-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%)"></div></div></div><div class="page-background-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%)"></div></div></div></amp-story-grid-layer><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:7.03883%;top:68.12298%;width:86.16505%;height:10.35599%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" id="el-uuid-1gc3vng0l"><h2 class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:1.6459066901408452% 0;font-family:"Gelasio",serif;font-size:0.485437em;line-height:0.88;text-align:center;padding:0;color:#000000"><span><span style="font-weight: 700; color: #fff">Beyond the Boundary: The Funniest, Fiercest, and Most Fabulous Zimbabwe Cricket Players!</span></span></h2></div></div><div style="position:absolute;pointer-events:none;left:5.09709%;top:-4.53074%;width:19.17476%;height:12.78317%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" class="mask" id="el-uuid-gfuyzurur"><div style="position:absolute;width:100%;height:100.00003%;left:0%;top:-0.00001%" data-leaf-element="true"><amp-img layout="fill" src="https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=80&h=80&fit=crop" alt="publisher logo" srcSet="https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=80&h=80&fit=crop 80w" sizes="(min-width: 1024px) 9vh, 19vw" disable-inline-width=""></amp-img></div></div></div><div style="position:absolute;pointer-events:none;left:25.72816%;top:94.17476%;width:50.48544%;height:5.50162%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.9615384615384616% 0.9615384615384616% 0.9615384615384616% 0.9615384615384616% / 5.88235294117647% 5.88235294117647% 5.88235294117647% 5.88235294117647%" id="el-uuid-um8ji2lhd"><h3 class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"BioRhyme",serif;font-size:0.355987em;line-height:1.2;text-align:left;padding:0;color:#000000"><span><span style="color: #fff">By Stumped Storyteller Sam</span></span></h3></div></div><div style="position:absolute;pointer-events:none;left:25.72816%;top:62.13592%;width:50.48544%;height:4.20712%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.9615384615384616% 0.9615384615384616% 0.9615384615384616% 0.9615384615384616% / 7.6923076923076925% 7.6923076923076925% 7.6923076923076925% 7.6923076923076925%" id="el-uuid-9c2t8pdhr"><h3 class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"BioRhyme",serif;font-size:0.355987em;line-height:1.2;text-align:left;padding:0;color:#000000"><span><span style="font-weight: 700; color: #f4cc4a">July 11, 2025</span></span></h3></div></div></div></div></amp-story-grid-layer></amp-story-page><amp-story-page id="uuid-cky119c6u" auto-advance-after="7s"><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area" style="background-color:#fff"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:0;top:-9.25926%;width:100%;height:118.51852%;opacity:1"><div id="anim-458974a8-22fc-4974-993e-532b493d51c7" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" class="mask" id="el-uuid-3xtowxngb"><div style="position:absolute;width:118.51852%;height:100%;left:0%;top:0%" data-leaf-element="true"><amp-img layout="fill" src="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop" alt="content background image" srcSet="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop 200w" sizes="(min-width: 1024px) 107vh, 238vw" disable-inline-width=""></amp-img></div><div class="element-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div></div><div class="page-background-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div></amp-story-grid-layer><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:calc(3.8835% - 3px);top:calc(71.84466% - 0px);width:calc(92.23301% + 6px);height:calc(24.75728% + 0px);opacity:1"><div id="anim-64ad46cc-c750-461d-83c5-27a05b8f6d28" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:0;--initial-transform:none"><div id="anim-c76e12c8-2fed-43aa-bfce-a40f3d4c45d6" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:1;--initial-transform:translate3d(0px, 151.12565%, 0)"><div style="top:0;left:0;right:0;bottom:0;width:100%;height:100%;position:absolute;border-width:0px 3px 0px 3px;border-color:rgba(224,110,4,1);border-style:solid;border-radius:7.368421052631578% 7.368421052631578% 7.368421052631578% 7.368421052631578% / 18.30065359477124% 18.30065359477124% 18.30065359477124% 18.30065359477124%;pointer-events:initial;display:block;z-index:0" class="mask" id="el-uuid-z49jcxt64"><div class="fill" style="background-color:rgba(0,0,0,0.75);will-change:transform"></div></div></div></div></div><div style="position:absolute;pointer-events:none;left:8.25243%;top:79.12621%;width:83.73786%;height:14.23948%;opacity:1"><div id="anim-34e504da-628e-4e00-8742-6e22ecdeaec8" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:0;--initial-transform:none"><div id="anim-47c5e91b-b83b-4b05-89cc-dcd1afc189e6" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:1;--initial-transform:translate3d(-109.85508%, 0px, 0)"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.5797101449275363% 0.5797101449275363% 0.5797101449275363% 0.5797101449275363% / 2.272727272727273% 2.272727272727273% 2.272727272727273% 2.272727272727273%" id="el-uuid-s6pfnsv00"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Merriweather",serif;font-size:0.226537em;line-height:1.2;text-align:left;padding:0;color:#000000"><span><span style="font-weight: 700; color: #fff">Zimbabwean cricket has faced tough times, but guess what? It's always given us players with huge hearts! They play with incredible flair and make the game exciting. Get ready to meet some real legends who made us cheer like crazy!</span></span></p></div></div></div></div><div style="position:absolute;pointer-events:none;left:11.65049%;top:73.46278%;width:76.45631%;height:5.66343%;opacity:1"><div id="anim-d02d63c8-eaae-4514-a017-1bde9d1174f8" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:0;--initial-transform:none"><div id="anim-0979f951-3570-41f2-bc19-a2f7a81afff1" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:1;--initial-transform:translate3d(-115.2381%, 0px, 0)"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.6349206349206349% 0.6349206349206349% 0.6349206349206349% 0.6349206349206349% / 5.714285714285714% 5.714285714285714% 5.714285714285714% 5.714285714285714%" id="el-uuid-12bov253n"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Alegreya",serif;font-size:0.420712em;line-height:1.2;text-align:center;padding:0;color:#000000"><span><span style="font-weight: 700; color: #ffbc35">1. Heart & Flair!</span></span></p></div></div></div></div></div></div></amp-story-grid-layer></amp-story-page><amp-story-page id="uuid-0x1j219yw" auto-advance-after="7s"><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-animation layout="nodisplay" trigger="visibility"></amp-story-animation><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area" style="background-color:#fff"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:0;top:-9.25926%;width:100%;height:118.51852%;opacity:1"><div id="anim-add79083-3044-4fe2-8044-391782b698d1" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" class="mask" id="el-uuid-tgykeci5g"><div style="position:absolute;width:118.51852%;height:100%;left:0%;top:0%" data-leaf-element="true"><amp-img layout="fill" src="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop" alt="content background image" srcSet="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop 200w" sizes="(min-width: 1024px) 107vh, 238vw" disable-inline-width=""></amp-img></div><div class="element-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div></div><div class="page-background-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div></amp-story-grid-layer><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:calc(3.8835% - 3px);top:calc(71.84466% - 0px);width:calc(92.23301% + 6px);height:calc(24.75728% + 0px);opacity:1"><div id="anim-f560a67e-9b45-493a-8682-5403bf6187e4" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:0;--initial-transform:none"><div id="anim-5fe693e2-ad8f-4413-a5e1-8ee9f866e54e" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:1;--initial-transform:translate3d(0px, 151.12565%, 0)"><div style="top:0;left:0;right:0;bottom:0;width:100%;height:100%;position:absolute;border-width:0px 3px 0px 3px;border-color:rgba(224,110,4,1);border-style:solid;border-radius:7.368421052631578% 7.368421052631578% 7.368421052631578% 7.368421052631578% / 18.30065359477124% 18.30065359477124% 18.30065359477124% 18.30065359477124%;pointer-events:initial;display:block;z-index:0" class="mask" id="el-uuid-mh0feuovx"><div class="fill" style="background-color:rgba(0,0,0,0.75);will-change:transform"></div></div></div></div></div><div style="position:absolute;pointer-events:none;left:8.25243%;top:79.12621%;width:83.73786%;height:14.23948%;opacity:1"><div id="anim-290b6974-3085-46a5-9703-c2a5cf093c35" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:0;--initial-transform:none"><div id="anim-b7b54768-2083-4796-b5e2-33d00e94291d" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:1;--initial-transform:translate3d(-109.85508%, 0px, 0)"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.5797101449275363% 0.5797101449275363% 0.5797101449275363% 0.5797101449275363% / 2.272727272727273% 2.272727272727273% 2.272727272727273% 2.272727272727273%" id="el-uuid-3zrt0qh7j"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Merriweather",serif;font-size:0.226537em;line-height:1.2;text-align:left;padding:0;color:#000000"><span><span style="font-weight: 700; color: #fff">Remember Brendan Taylor? He was an explosive wicketkeeper-batsman, a true game-changer! His fearless hitting was amazing. Those back-to-back hundreds in the 2015 World Cup? Pure fireworks! He showed us that anything is truly possible on the field. What a star!</span></span></p></div></div></div></div><div style="position:absolute;pointer-events:none;left:11.65049%;top:73.46278%;width:76.45631%;height:5.66343%;opacity:1"><div id="anim-acf47e97-8d17-430a-b669-0fe719cef6df" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:0;--initial-transform:none"><div id="anim-c444db99-21db-4d6f-8185-44e7172b473e" class="animation-wrapper" style="width:100%;height:100%;display:block;position:absolute;top:0;left:0;--initial-opacity:1;--initial-transform:translate3d(-115.2381%, 0px, 0)"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.6349206349206349% 0.6349206349206349% 0.6349206349206349% 0.6349206349206349% / 5.714285714285714% 5.714285714285714% 5.714285714285714% 5.714285714285714%" id="el-uuid-4rwqetb6s"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Alegreya",serif;font-size:0.420712em;line-height:1.2;text-align:center;padding:0;color:#000000"><span><span style="font-weight: 700; color: #ffbc35">2. The Explosive Scorer!</span></span></p></div></div></div></div></div></div></amp-story-grid-layer></amp-story-page><amp-story-page id="uuid-w3vykb399" auto-advance-after="7s"><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area" style="background-color:#fff"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:0;top:-9.25926%;width:100%;height:118.51852%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" class="mask" id="el-uuid-gv6928oy7"><div style="position:absolute;width:118.51852%;height:100%;left:0%;top:0%" data-leaf-element="true"><amp-img layout="fill" src="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop" alt="content background image" srcSet="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop 200w" sizes="(min-width: 1024px) 107vh, 238vw" disable-inline-width=""></amp-img></div><div class="element-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div><div class="page-background-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div></amp-story-grid-layer><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:calc(3.8835% - 3px);top:calc(71.84466% - 0px);width:calc(92.23301% + 6px);height:calc(24.75728% + 0px);opacity:1"><div style="top:0;left:0;right:0;bottom:0;width:100%;height:100%;position:absolute;border-width:0px 3px 0px 3px;border-color:rgba(224,110,4,1);border-style:solid;border-radius:7.368421052631578% 7.368421052631578% 7.368421052631578% 7.368421052631578% / 18.30065359477124% 18.30065359477124% 18.30065359477124% 18.30065359477124%;pointer-events:initial;display:block;z-index:0" class="mask" id="el-uuid-lkfdj853x"><div class="fill" style="background-color:rgba(0,0,0,0.75);will-change:transform"></div></div></div><div style="position:absolute;pointer-events:none;left:8.25243%;top:79.12621%;width:83.73786%;height:14.23948%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.5797101449275363% 0.5797101449275363% 0.5797101449275363% 0.5797101449275363% / 2.272727272727273% 2.272727272727273% 2.272727272727273% 2.272727272727273%" id="el-uuid-i24vt3mgx"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Merriweather",serif;font-size:0.226537em;line-height:1.2;text-align:left;padding:0;color:#000000"><span><span style="font-weight: 700; color: #fff">Meet Grant Flower, the super elegant left-handed batsman! He was a rock for Zimbabwe, part of that famous Flower brothers team. His stylish moves and perfect technique were pure joy to watch. He held records for ages. And get this: he even scored a hundred against India as an opener!</span></span></p></div></div><div style="position:absolute;pointer-events:none;left:11.65049%;top:73.46278%;width:76.45631%;height:5.66343%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.6349206349206349% 0.6349206349206349% 0.6349206349206349% 0.6349206349206349% / 5.714285714285714% 5.714285714285714% 5.714285714285714% 5.714285714285714%" id="el-uuid-g55xsfffc"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Alegreya",serif;font-size:0.420712em;line-height:1.2;text-align:center;padding:0;color:#000000"><span><span style="font-weight: 700; color: #ffbc35">3. Elegant Grant!</span></span></p></div></div></div></div></amp-story-grid-layer></amp-story-page><amp-story-page id="uuid-e5ddohsgo" auto-advance-after="7s"><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area" style="background-color:#fff"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:0;top:-9.25926%;width:100%;height:118.51852%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" class="mask" id="el-uuid-wwunxfjxc"><div style="position:absolute;width:118.51852%;height:100%;left:0%;top:0%" data-leaf-element="true"><amp-img layout="fill" src="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop" alt="content background image" srcSet="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop 200w" sizes="(min-width: 1024px) 107vh, 238vw" disable-inline-width=""></amp-img></div><div class="element-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div><div class="page-background-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div></amp-story-grid-layer><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:calc(3.8835% - 3px);top:calc(71.84466% - 0px);width:calc(92.23301% + 6px);height:calc(24.75728% + 0px);opacity:1"><div style="top:0;left:0;right:0;bottom:0;width:100%;height:100%;position:absolute;border-width:0px 3px 0px 3px;border-color:rgba(224,110,4,1);border-style:solid;border-radius:7.368421052631578% 7.368421052631578% 7.368421052631578% 7.368421052631578% / 18.30065359477124% 18.30065359477124% 18.30065359477124% 18.30065359477124%;pointer-events:initial;display:block;z-index:0" class="mask" id="el-uuid-5p5n0gw2v"><div class="fill" style="background-color:rgba(0,0,0,0.75);will-change:transform"></div></div></div><div style="position:absolute;pointer-events:none;left:8.25243%;top:79.12621%;width:83.73786%;height:14.23948%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.5797101449275363% 0.5797101449275363% 0.5797101449275363% 0.5797101449275363% / 2.272727272727273% 2.272727272727273% 2.272727272727273% 2.272727272727273%" id="el-uuid-n7uknyk14"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Merriweather",serif;font-size:0.226537em;line-height:1.2;text-align:left;padding:0;color:#000000"><span><span style="font-weight: 700; color: #fff">Next up is Tatenda Taibu, our pint-sized dynamo! He was the youngest Test captain ever. Don't let his size fool you; he was a livewire behind the stumps and a brave batsman. His energy and passion were contagious. He even played for Lancashire! What an inspiring player!</span></span></p></div></div><div style="position:absolute;pointer-events:none;left:11.65049%;top:73.46278%;width:76.45631%;height:5.66343%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.6349206349206349% 0.6349206349206349% 0.6349206349206349% 0.6349206349206349% / 5.714285714285714% 5.714285714285714% 5.714285714285714% 5.714285714285714%" id="el-uuid-0v6wwivor"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Alegreya",serif;font-size:0.420712em;line-height:1.2;text-align:center;padding:0;color:#000000"><span><span style="font-weight: 700; color: #ffbc35">4. Small Guy, Big Heart!</span></span></p></div></div></div></div></amp-story-grid-layer></amp-story-page><amp-story-page id="uuid-fk5jkiylq" auto-advance-after="7s"><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area" style="background-color:#fff"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:0;top:-9.25926%;width:100%;height:118.51852%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" class="mask" id="el-uuid-sx1n6eluf"><div style="position:absolute;width:118.51852%;height:100%;left:0%;top:0%" data-leaf-element="true"><amp-img layout="fill" src="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop" alt="content background image" srcSet="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop 200w" sizes="(min-width: 1024px) 107vh, 238vw" disable-inline-width=""></amp-img></div><div class="element-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div><div class="page-background-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div></amp-story-grid-layer><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:calc(3.8835% - 3px);top:calc(71.84466% - 0px);width:calc(92.23301% + 6px);height:calc(24.75728% + 0px);opacity:1"><div style="top:0;left:0;right:0;bottom:0;width:100%;height:100%;position:absolute;border-width:0px 3px 0px 3px;border-color:rgba(224,110,4,1);border-style:solid;border-radius:7.368421052631578% 7.368421052631578% 7.368421052631578% 7.368421052631578% / 18.30065359477124% 18.30065359477124% 18.30065359477124% 18.30065359477124%;pointer-events:initial;display:block;z-index:0" class="mask" id="el-uuid-bgxzsvafc"><div class="fill" style="background-color:rgba(0,0,0,0.75);will-change:transform"></div></div></div><div style="position:absolute;pointer-events:none;left:8.25243%;top:79.12621%;width:83.73786%;height:14.23948%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.5797101449275363% 0.5797101449275363% 0.5797101449275363% 0.5797101449275363% / 2.272727272727273% 2.272727272727273% 2.272727272727273% 2.272727272727273%" id="el-uuid-qf9oxf63f"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Merriweather",serif;font-size:0.226537em;line-height:1.2;text-align:left;padding:0;color:#000000"><span><span style="font-weight: 700; color: #fff">Ever faced a wily spinner? Ray Price was just that! His left-arm spins, with their tricky action, fooled so many batsmen. He was a late starter but became super important for Zimbabwe. He frustrated top players with his clever variations and spot-on accuracy. What a magician!</span></span></p></div></div><div style="position:absolute;pointer-events:none;left:11.65049%;top:73.46278%;width:76.45631%;height:5.66343%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.6349206349206349% 0.6349206349206349% 0.6349206349206349% 0.6349206349206349% / 5.714285714285714% 5.714285714285714% 5.714285714285714% 5.714285714285714%" id="el-uuid-9e0rfdatj"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Alegreya",serif;font-size:0.420712em;line-height:1.2;text-align:center;padding:0;color:#000000"><span><span style="font-weight: 700; color: #ffbc35">5. Wily Spinner!</span></span></p></div></div></div></div></amp-story-grid-layer></amp-story-page><amp-story-page id="uuid-wd0hyhnax" auto-advance-after="7s" auto-advance-after="7s"><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area" style="background-color:#fff"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:0;top:-9.25926%;width:100%;height:118.51852%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0" class="mask" id="el-uuid-hr936mtcm"><div style="position:absolute;width:118.51852%;height:100%;left:0%;top:0%" data-leaf-element="true"><amp-img layout="fill" src="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop" alt="content background image" srcSet="https://images.unsplash.com/photo-1574375927938-d5a98e8ffe85?w=400&h=300&fit=crop 200w" sizes="(min-width: 1024px) 107vh, 238vw" disable-inline-width=""></amp-img></div><div class="element-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div><div class="page-background-overlay-area" style="background-image:radial-gradient(ellipse 67% 67%, rgba(0,0,0,0) 40%, rgba(0,0,0,0.5) 100%)"></div></div></div></amp-story-grid-layer><amp-story-grid-layer template="vertical" aspect-ratio="412:618" class="grid-layer"><div class="page-fullbleed-area"><div class="page-safe-area"><div style="position:absolute;pointer-events:none;left:calc(3.8835% - 3px);top:calc(71.84466% - 0px);width:calc(92.23301% + 6px);height:calc(24.75728% + 0px);opacity:1"><div style="top:0;left:0;right:0;bottom:0;width:100%;height:100%;position:absolute;border-width:0px 3px 0px 3px;border-color:rgba(224,110,4,1);border-style:solid;border-radius:7.368421052631578% 7.368421052631578% 7.368421052631578% 7.368421052631578% / 18.30065359477124% 18.30065359477124% 18.30065359477124% 18.30065359477124%;pointer-events:initial;display:block;z-index:0" class="mask" id="el-uuid-eqqj6j4kz"><div class="fill" style="background-color:rgba(0,0,0,0.75);will-change:transform"></div></div></div><div style="position:absolute;pointer-events:none;left:8.25243%;top:79.12621%;width:83.73786%;height:14.23948%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.5797101449275363% 0.5797101449275363% 0.5797101449275363% 0.5797101449275363% / 2.272727272727273% 2.272727272727273% 2.272727272727273% 2.272727272727273%" id="el-uuid-426zwkeau"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Merriweather",serif;font-size:0.226537em;line-height:1.2;text-align:left;padding:0;color:#000000"><span><span style="font-weight: 700; color: #fff">So, there you have it! Just a few of the absolute superstars from Zimbabwe who made us cheer our hearts out. Their passion, skill, and sheer grit gave us so many unforgettable moments. They truly are legends who will always be remembered for lighting up the cricket pitch. Keep cheering!</span></span></p></div></div><div style="position:absolute;pointer-events:none;left:11.65049%;top:73.46278%;width:76.45631%;height:5.66343%;opacity:1"><div style="pointer-events:initial;width:100%;height:100%;display:block;position:absolute;top:0;left:0;z-index:0;border-radius:0.6349206349206349% 0.6349206349206349% 0.6349206349206349% 0.6349206349206349% / 5.714285714285714% 5.714285714285714% 5.714285714285714% 5.714285714285714%" id="el-uuid-xv5rl1ziy"><p class="fill text-wrapper" style="white-space:pre-line;overflow-wrap:break-word;word-break:break-word;margin:0% 0;font-family:"Alegreya",serif;font-size:0.420712em;line-height:1.2;text-align:center;padding:0;color:#000000"><span><span style="font-weight: 700; color: #ffbc35">6. Our Cheering Superstars!</span></span></p></div></div></div></div></amp-story-grid-layer></amp-story-page>
<amp-story-bookend layout="nodisplay">
<script type="application/json">
{
"bookendVersion": "v1.0",
"shareProviders": [
"facebook",
"twitter",
"email",
"linkedin",
"whatsapp"
],
"components": [
{
"type": "heading",
"text": "More Stories"
}
]
}
</script>
</amp-story-bookend>
</amp-story></body></html>Can you please help me?? If i try without animations, then the amp html is working perfectly with navigations and all, but when i try to generate a story content with animations and then pass it to the story editor and get the amp html, it is not having proper navigations. But if i saw the same story in preview or publish it, it will be working fine, but when i just use raw amp html and try to run it in nextjs via api routes, it have broken navigations.. I think the animations are the issue and i am making some mistake
Got this while debugging with ai
There might be a bug in the plugin specifically related to how it generates the markup for the effect-background-zoom animation or how it applies animations to elements marked as backgrounds (“isBackground”: true). This type of animation has specific requirements in AMP, and a small error in the generated code could invalidate the entire page.
And when i removed the animations from the background Image it is working fine.
Here is the code with bg image animations:{
"current": "14d7a290-8a24-4373-8ea7-23bce5ba2707",
"selection": [],
"story": {
"globalStoryStyles": {
"colors": [],
"textStyles": []
}
},
"version": 47,
"pages": [
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 50,
"y": 273,
"width": 313,
"height": 470,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"type": "image",
"id": "47febbaf-0635-4d28-b60b-004e43636c33",
"scale": 100,
"focalX": 50,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"width": 4000,
"height": 6000,
"sizes": {
"full": {
"file": "media/unsplash:qn_XJUBgPo0",
"sourceUrl": "https://images.unsplash.com/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=4000&h=6000&fit=max",
"mimeType": "image/jpeg",
"width": 4000,
"height": 6000
},
"large": {
"file": "media/unsplash:qn_XJUBgPo0",
"sourceUrl": "https://images.unsplash.com/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=3200&h=4800&fit=max",
"mimeType": "image/jpeg",
"width": 3200,
"height": 4800
},
"2400_3600": {
"file": "media/unsplash:qn_XJUBgPo0",
"sourceUrl": "https://images.unsplash.com/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=2400&h=3600&fit=max",
"mimeType": "image/jpeg",
"width": 2400,
"height": 3600
},
"1600_2400": {
"file": "media/unsplash:qn_XJUBgPo0",
"sourceUrl": "https://images.unsplash.com/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=1600&h=2400&fit=max",
"mimeType": "image/jpeg",
"width": 1600,
"height": 2400
},
"800_1200": {
"file": "media/unsplash:qn_XJUBgPo0",
"sourceUrl": "https://images.unsplash.com/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=800&h=1200&fit=max",
"mimeType": "image/jpeg",
"width": 800,
"height": 1200
},
"web_stories_thumbnail": {
"file": "media/unsplash:qn_XJUBgPo0",
"sourceUrl": "https://images.unsplash.com/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=340&h=510&fit=max",
"mimeType": "image/jpeg",
"width": 340,
"height": 510
}
},
"isPlaceholder": false,
"isExternal": true,
"needsProxy": false,
"id": "media/unsplash:qn_XJUBgPo0",
"baseColor": "#f3f3f3",
"blurHash": "L-Irc.ozIos:_4ogV[of%Noes:WV",
"creationDate": "2025-07-09T20:22:50Z",
"src": "https://images.unsplash.com/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=4000&h=6000&fit=max",
"alt": "A cow grazes in a grassy mountain meadow.",
"attribution": {
"author": {
"displayName": "Milosz Roman",
"url": "https://unsplash.com/@mivosh?utm_source=web_stories_wordpress&utm_medium=referral"
},
"registerUsageUrl": "https://media3p.googleapis.com/v1/media:registerUsage?token=AU3aCBRaSyAakRvTQfAxI6cEj4TGq6daPwbbNrZSaZ3rcEoVpIq16%2BRDSE6lF7D4NXRIhphmhRv6PmpNdKQI6pHtLs3KW%2BKYAqc0kXXXqniSpBG8Ty93rj3HjTixvwjrC27WdYSO5UHc2Rpt3SC/%2BfaHu3n6ZhzhygYzouojXM3gRs3Vsm7%2BkREVp1Q/IjfPfmFrF8rSQt86OmT2WCSq2uChzDlkqdoqoMqnwzRPUCo5lWY%3D"
}
}
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"id": "f8de6bc9-465a-4fe7-8751-a155b31d00ad",
"defaultBackgroundElement": {
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 1,
"y": 1,
"width": 1,
"height": 1,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"isDefaultBackground": true,
"type": "shape",
"id": "3a79a25d-851b-447d-b7f8-ccacbd4fc618"
},
"animations": []
},
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"scale": 140,
"focalX": 73.25925470564026,
"focalY": 58.0575453206811,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"baseColor": "#484543",
"src": "https://wp.stories.google/static/21/images/templates/sleep/page7_bg.jpg",
"width": 220,
"height": 293,
"posterId": 0,
"id": 0,
"alt": "page7_bg",
"sizes": {},
"isExternal": true
},
"x": 70,
"y": 2,
"width": 206,
"height": 274,
"mask": {
"type": "rectangle",
"name": "Rectangle",
"path": "M 0,0 1,0 1,1 0,1 0,0 Z",
"ratio": 1
},
"id": "8f381241-0285-4bfe-86bf-c8e712114659",
"isBackground": true,
"type": "image"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": -10,
"lockAspectRatio": true,
"backgroundColor": {
"color": {
"r": 75,
"g": 92,
"b": 84
}
},
"x": -211,
"y": -130,
"width": 577,
"height": 577,
"mask": {
"type": "blob-2"
},
"id": "5e8099da-7c1e-4126-ac2c-206e54003a42",
"groupId": "074e2685-7611-45fb-9e1c-0341fe20581a",
"type": "shape"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 314,
"lockAspectRatio": true,
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"x": -52,
"y": -139,
"width": 569,
"height": 733,
"mask": {
"type": "blob-6"
},
"id": "9e119aa1-db3d-417f-b77a-cb1ed3d89d3c",
"groupId": "074e2685-7611-45fb-9e1c-0341fe20581a",
"type": "shape"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Source Serif 4",
"fallbacks": [
"serif"
],
"weights": [
200,
300,
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
200
],
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
200
],
[
1,
300
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com",
"metrics": {
"upm": 1000,
"asc": 1036,
"des": -335,
"tAsc": 1036,
"tDes": -335,
"tLGap": 0,
"wAsc": 1009,
"wDes": 324,
"xH": 475,
"capH": 670,
"yMin": -321,
"yMax": 1003,
"hAsc": 1036,
"hDes": -335,
"lGap": 0
}
},
"fontSize": 300,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 0.83,
"textAlign": "left",
"padding": {
"horizontal": 0,
"vertical": 0
},
"x": 144,
"y": 20,
"width": 150,
"height": 249,
"id": "a88fec94-e814-4d2a-be42-35461873ead2",
"content": "<span style=\"font-weight: 300; color: #fbebba\">5</span>",
"tagName": "h2",
"type": "text"
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundTextMode": "NONE",
"font": {
"family": "Source Serif 4",
"fallbacks": [
"serif"
],
"weights": [
200,
300,
400,
500,
600,
700,
800,
900
],
"styles": [
"regular",
"italic"
],
"variants": [
[
0,
200
],
[
0,
300
],
[
0,
400
],
[
0,
500
],
[
0,
600
],
[
0,
700
],
[
0,
800
],
[
0,
900
],
[
1,
200
],
[
1,
300
],
[
1,
400
],
[
1,
500
],
[
1,
600
],
[
1,
700
],
[
1,
800
],
[
1,
900
]
],
"service": "fonts.google.com",
"metrics": {
"upm": 1000,
"asc": 1036,
"des": -335,
"tAsc": 1036,
"tDes": -335,
"tLGap": 0,
"wAsc": 1009,
"wDes": 324,
"xH": 475,
"capH": 670,
"yMin": -321,
"yMax": 1003,
"hAsc": 1036,
"hDes": -335,
"lGap": 0
}
},
"fontSize": 42,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"lineHeight": 1.3,
"textAlign": "center",
"padding": {
"horizontal": 0,
"vertical": 0
},
"x": 64,
"y": 287,
"width": 284,
"height": 108,
"id": "50576904-57bd-4687-964b-f03bba21cba6",
"content": "<span style=\"font-weight: 300; color: #fbebba\">Bedtime</span>\n<span style=\"font-weight: 300; color: #fbebba\">Routine Tips</span>",
"tagName": "h2",
"type": "text"
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255,
"a": 1
}
},
"animations": [
{
"id": "df2277dd-dd88-455a-9ec5-6659ff39f59d",
"type": "effect-fly-in",
"targets": [
"a88fec94-e814-4d2a-be42-35461873ead2"
],
"flyInDir": "bottomToTop",
"duration": 2000,
"delay": 0
},
{
"id": "d7f1e8d0-ff9a-4fa0-8313-a820f846c630",
"type": "effect-fly-in",
"targets": [
"50576904-57bd-4687-964b-f03bba21cba6"
],
"flyInDir": "bottomToTop",
"duration": 2000,
"delay": 100
}
],
"type": "page",
"id": "14d7a290-8a24-4373-8ea7-23bce5ba2707",
"defaultBackgroundElement": {
"type": "shape",
"x": 1,
"y": 1,
"width": 1,
"height": 1,
"rotationAngle": 0,
"mask": {
"type": "rectangle"
},
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255,
"a": 1
}
},
"isBackground": true,
"isDefaultBackground": true,
"id": "fadc0093-2969-4c68-a93a-443622c08d81"
},
"pageTemplateType": "section",
"groups": {
"074e2685-7611-45fb-9e1c-0341fe20581a": {
"name": "Background",
"isLocked": true,
"isCollapsed": true
}
}
},
{
"elements": [
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 48,
"y": 0,
"width": 330,
"height": 220,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"type": "image",
"id": "87685ff5-a429-4c67-a133-b48d9d0bc03e",
"scale": 100,
"focalX": 50,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"width": 8640,
"height": 5760,
"sizes": {
"full": {
"file": "media/unsplash:pR-5gi-hB1c",
"sourceUrl": "https://images.unsplash.com/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=8640&h=5760&fit=max",
"mimeType": "image/jpeg",
"width": 8640,
"height": 5760
},
"large": {
"file": "media/unsplash:pR-5gi-hB1c",
"sourceUrl": "https://images.unsplash.com/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=6912&h=4608&fit=max",
"mimeType": "image/jpeg",
"width": 6912,
"height": 4608
},
"5184_3456": {
"file": "media/unsplash:pR-5gi-hB1c",
"sourceUrl": "https://images.unsplash.com/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=5184&h=3456&fit=max",
"mimeType": "image/jpeg",
"width": 5184,
"height": 3456
},
"3456_2304": {
"file": "media/unsplash:pR-5gi-hB1c",
"sourceUrl": "https://images.unsplash.com/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=3456&h=2304&fit=max",
"mimeType": "image/jpeg",
"width": 3456,
"height": 2304
},
"1728_1152": {
"file": "media/unsplash:pR-5gi-hB1c",
"sourceUrl": "https://images.unsplash.com/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=1728&h=1152&fit=max",
"mimeType": "image/jpeg",
"width": 1728,
"height": 1152
},
"web_stories_thumbnail": {
"file": "media/unsplash:pR-5gi-hB1c",
"sourceUrl": "https://images.unsplash.com/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=340&h=227&fit=max",
"mimeType": "image/jpeg",
"width": 340,
"height": 227
}
},
"isPlaceholder": false,
"isExternal": true,
"needsProxy": false,
"id": "media/unsplash:pR-5gi-hB1c",
"baseColor": "#4073a6",
"blurHash": "Lo98+3aeMwof%%aeRQkCoJjtbcay",
"creationDate": "2025-06-24T15:51:13Z",
"src": "https://images.unsplash.com/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=8640&h=5760&fit=max",
"alt": "Icebergs glisten on a dark beach beneath cloudy skies.",
"attribution": {
"author": {
"displayName": "Colin Watts",
"url": "https://unsplash.com/@colinwatts?utm_source=web_stories_wordpress&utm_medium=referral"
},
"registerUsageUrl": "https://media3p.googleapis.com/v1/media:registerUsage?token=AU3aCBR6bb/jcYncVN2nE6DnnFmn4Ly%2BGQtLz4NSMyGtHKKvEXXmg6Dfyi8NvicHaIIdSUA2vumU0Pq6nFH6KDBQAjxh2hWHdafY1ceRnkitbdv9aWCOOutxGx3VhbZT1s0UvqdRAfQAJTKIUfgpE9z2MFvpA2bBc8lzgJjuPGFzL/Kep%2B/APKkOwqCnk548WHS9xzSprMtnTaK0rL6pQI7JdCy2zMPD6/9NBUjrV75X08Q%3D"
}
}
},
{
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": false,
"scale": 100,
"focalX": 50,
"focalY": 50,
"resource": {
"type": "image",
"mimeType": "image/jpeg",
"width": 5177,
"height": 6902,
"sizes": {
"full": {
"file": "media/unsplash:zVV6vy8t4jY",
"sourceUrl": "https://images.unsplash.com/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=5177&h=6902&fit=max",
"mimeType": "image/jpeg",
"width": 5177,
"height": 6902
},
"large": {
"file": "media/unsplash:zVV6vy8t4jY",
"sourceUrl": "https://images.unsplash.com/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=4141&h=5521&fit=max",
"mimeType": "image/jpeg",
"width": 4141,
"height": 5521
},
"3106_4141": {
"file": "media/unsplash:zVV6vy8t4jY",
"sourceUrl": "https://images.unsplash.com/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=3106&h=4141&fit=max",
"mimeType": "image/jpeg",
"width": 3106,
"height": 4141
},
"2070_2760": {
"file": "media/unsplash:zVV6vy8t4jY",
"sourceUrl": "https://images.unsplash.com/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=2070&h=2760&fit=max",
"mimeType": "image/jpeg",
"width": 2070,
"height": 2760
},
"1035_1380": {
"file": "media/unsplash:zVV6vy8t4jY",
"sourceUrl": "https://images.unsplash.com/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=1035&h=1380&fit=max",
"mimeType": "image/jpeg",
"width": 1035,
"height": 1380
},
"web_stories_thumbnail": {
"file": "media/unsplash:zVV6vy8t4jY",
"sourceUrl": "https://images.unsplash.com/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=340&h=453&fit=max",
"mimeType": "image/jpeg",
"width": 340,
"height": 453
}
},
"isPlaceholder": false,
"isExternal": true,
"needsProxy": false,
"id": "media/unsplash:zVV6vy8t4jY",
"baseColor": "#0c260c",
"blurHash": "L44.k*xrI0D*V|t6x?Rj4VNM%Y?Z",
"creationDate": "2025-07-07T16:39:46Z",
"src": "https://images.unsplash.com/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=5177&h=6902&fit=max",
"alt": "A colorful parrot perches on a branch.",
"attribution": {
"author": {
"displayName": "Valentin",
"url": "https://unsplash.com/@omikron?utm_source=web_stories_wordpress&utm_medium=referral"
},
"registerUsageUrl": "https://media3p.googleapis.com/v1/media:registerUsage?token=AU3aCBR91abgtSradV4GBC6FIVw4e9xBxt7Gcpfe%2BU7VL8ZS/y4RshDtFJZAN4yNdWBSw2FS9R0ZNWGhxmXcge/fgmfOO7KDbYlKEuzRT1A3Bmp2eWsCtK4lbGx%2B7NOsFB7ZOpx1sg3suqRKoKjA0KxRba3T4Duv7T623zT4GzlSUT%2BkoWh07p1%2BhW5lmUaVDWvh85NoNg6u7muvV5O7Wfsv693dCUMR16GEoMLKNUTQQj4%3D"
}
},
"x": 91,
"y": 0,
"width": 209,
"height": 278,
"type": "image",
"mask": {
"type": "rectangle",
"showInLibrary": true,
"name": "Rectangle",
"path": "M 0,0 1,0 1,1 0,1 0,0 Z",
"ratio": 1,
"supportsBorder": true
},
"id": "b87ffc19-0fad-4219-ad32-d6c0e2967b56"
}
],
"backgroundColor": {
"color": {
"r": 255,
"g": 255,
"b": 255
}
},
"id": "3c74f590-3561-4ad9-91f3-ef90b0d8f3ce",
"defaultBackgroundElement": {
"opacity": 100,
"flip": {
"vertical": false,
"horizontal": false
},
"rotationAngle": 0,
"lockAspectRatio": true,
"backgroundColor": {
"color": {
"r": 196,
"g": 196,
"b": 196
}
},
"x": 1,
"y": 1,
"width": 1,
"height": 1,
"mask": {
"type": "rectangle"
},
"isBackground": true,
"isDefaultBackground": true,
"type": "shape",
"id": "e88d9bf8-4186-4827-9d5a-57b6c03994fd"
},
"animations": [
{
"id": "14d1db88-a371-44bf-921a-76a5d12fb1fa",
"type": "effect-fly-in",
"flyInDir": "topToBottom",
"duration": 600,
"delay": 0,
"targets": [
"b87ffc19-0fad-4219-ad32-d6c0e2967b56"
]
},
{
"id": "1e2b0efc-d5cf-4337-84c2-a92aafc4dfe2",
"type": "effect-background-zoom",
"zoomDirection": "scaleOut",
"duration": 2000,
"delay": 0,
"targets": [
"87685ff5-a429-4c67-a133-b48d9d0bc03e"
]
}
]
}
]
}Here is the code without bg animation:
{"version":47,"pages":[{"elements":[{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":0,"lockAspectRatio":true,"backgroundColor":{"color":{"r":196,"g":196,"b":196}},"x":50,"y":273,"width":313,"height":470,"mask":{"type":"rectangle"},"isBackground":true,"type":"image","id":"47febbaf-0635-4d28-b60b-004e43636c33","scale":100,"focalX":50,"focalY":50,"resource":{"type":"image","mimeType":"image\/jpeg","width":4000,"height":6000,"sizes":{"full":{"file":"media\/unsplash:qn_XJUBgPo0","sourceUrl":"https:\/\/images.unsplash.com\/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=4000&h=6000&fit=max","mimeType":"image\/jpeg","width":4000,"height":6000},"large":{"file":"media\/unsplash:qn_XJUBgPo0","sourceUrl":"https:\/\/images.unsplash.com\/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=3200&h=4800&fit=max","mimeType":"image\/jpeg","width":3200,"height":4800},"2400_3600":{"file":"media\/unsplash:qn_XJUBgPo0","sourceUrl":"https:\/\/images.unsplash.com\/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=2400&h=3600&fit=max","mimeType":"image\/jpeg","width":2400,"height":3600},"1600_2400":{"file":"media\/unsplash:qn_XJUBgPo0","sourceUrl":"https:\/\/images.unsplash.com\/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=1600&h=2400&fit=max","mimeType":"image\/jpeg","width":1600,"height":2400},"800_1200":{"file":"media\/unsplash:qn_XJUBgPo0","sourceUrl":"https:\/\/images.unsplash.com\/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=800&h=1200&fit=max","mimeType":"image\/jpeg","width":800,"height":1200},"web_stories_thumbnail":{"file":"media\/unsplash:qn_XJUBgPo0","sourceUrl":"https:\/\/images.unsplash.com\/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=340&h=510&fit=max","mimeType":"image\/jpeg","width":340,"height":510}},"isPlaceholder":false,"isExternal":true,"needsProxy":false,"id":"media\/unsplash:qn_XJUBgPo0","baseColor":"#f3f3f3","blurHash":"L-Irc.ozIos:_4ogV[of%Noes:WV","creationDate":"2025-07-09T20:22:50Z","src":"https:\/\/images.unsplash.com\/photo-1752091948423-f75b57fdae4a?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=4000&h=6000&fit=max","alt":"A cow grazes in a grassy mountain meadow.","attribution":{"author":{"displayName":"Milosz Roman","url":"https:\/\/unsplash.com\/@mivosh?utm_source=web_stories_wordpress&utm_medium=referral"},"registerUsageUrl":"https:\/\/media3p.googleapis.com\/v1\/media:registerUsage?token=AU3aCBRaSyAakRvTQfAxI6cEj4TGq6daPwbbNrZSaZ3rcEoVpIq16%2BRDSE6lF7D4NXRIhphmhRv6PmpNdKQI6pHtLs3KW%2BKYAqc0kXXXqniSpBG8Ty93rj3HjTixvwjrC27WdYSO5UHc2Rpt3SC\/%2BfaHu3n6ZhzhygYzouojXM3gRs3Vsm7%2BkREVp1Q\/IjfPfmFrF8rSQt86OmT2WCSq2uChzDlkqdoqoMqnwzRPUCo5lWY%3D"}}}],"backgroundColor":{"color":{"r":255,"g":255,"b":255}},"id":"f8de6bc9-465a-4fe7-8751-a155b31d00ad","defaultBackgroundElement":{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":0,"lockAspectRatio":true,"backgroundColor":{"color":{"r":196,"g":196,"b":196}},"x":1,"y":1,"width":1,"height":1,"mask":{"type":"rectangle"},"isBackground":true,"isDefaultBackground":true,"type":"shape","id":"3a79a25d-851b-447d-b7f8-ccacbd4fc618"},"animations":[]},{"elements":[{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":0,"lockAspectRatio":true,"scale":140,"focalX":73.25925470564026,"focalY":58.0575453206811,"resource":{"type":"image","mimeType":"image\/jpeg","baseColor":"#484543","src":"https:\/\/wp.stories.google\/static\/21\/images\/templates\/sleep\/page7_bg.jpg","width":220,"height":293,"posterId":0,"id":0,"alt":"page7_bg","sizes":[],"isExternal":true},"x":70,"y":2,"width":206,"height":274,"mask":{"type":"rectangle","name":"Rectangle","path":"M 0,0 1,0 1,1 0,1 0,0 Z","ratio":1},"id":"8f381241-0285-4bfe-86bf-c8e712114659","isBackground":true,"type":"image"},{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":-10,"lockAspectRatio":true,"backgroundColor":{"color":{"r":75,"g":92,"b":84}},"x":-211,"y":-130,"width":577,"height":577,"mask":{"type":"blob-2"},"id":"5e8099da-7c1e-4126-ac2c-206e54003a42","groupId":"074e2685-7611-45fb-9e1c-0341fe20581a","type":"shape"},{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":314,"lockAspectRatio":true,"backgroundColor":{"color":{"r":255,"g":255,"b":255}},"x":-52,"y":-139,"width":569,"height":733,"mask":{"type":"blob-6"},"id":"9e119aa1-db3d-417f-b77a-cb1ed3d89d3c","groupId":"074e2685-7611-45fb-9e1c-0341fe20581a","type":"shape"},{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":0,"lockAspectRatio":true,"backgroundTextMode":"NONE","font":{"family":"Source Serif 4"},"fontSize":300,"backgroundColor":{"color":{"r":196,"g":196,"b":196}},"lineHeight":0.83,"textAlign":"left","padding":{"horizontal":0,"vertical":0},"x":144,"y":20,"width":150,"height":249,"id":"a88fec94-e814-4d2a-be42-35461873ead2","content":"<span style=\"font-weight: 300; color: #fbebba\">5<\/span>","tagName":"h2","type":"text"},{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":0,"lockAspectRatio":true,"backgroundTextMode":"NONE","font":{"family":"Source Serif 4"},"fontSize":42,"backgroundColor":{"color":{"r":196,"g":196,"b":196}},"lineHeight":1.3,"textAlign":"center","padding":{"horizontal":0,"vertical":0},"x":64,"y":287,"width":284,"height":108,"id":"50576904-57bd-4687-964b-f03bba21cba6","content":"<span style=\"font-weight: 300; color: #fbebba\">Bedtime<\/span>\n<span style=\"font-weight: 300; color: #fbebba\">Routine Tips<\/span>","tagName":"h2","type":"text"}],"backgroundColor":{"color":{"r":255,"g":255,"b":255,"a":1}},"animations":[{"id":"df2277dd-dd88-455a-9ec5-6659ff39f59d","type":"effect-fly-in","targets":["a88fec94-e814-4d2a-be42-35461873ead2"],"flyInDir":"bottomToTop","duration":2000,"delay":0},{"id":"d7f1e8d0-ff9a-4fa0-8313-a820f846c630","type":"effect-fly-in","targets":["50576904-57bd-4687-964b-f03bba21cba6"],"flyInDir":"bottomToTop","duration":2000,"delay":100}],"type":"page","id":"14d7a290-8a24-4373-8ea7-23bce5ba2707","defaultBackgroundElement":{"type":"shape","x":1,"y":1,"width":1,"height":1,"rotationAngle":0,"mask":{"type":"rectangle"},"backgroundColor":{"color":{"r":255,"g":255,"b":255,"a":1}},"isBackground":true,"isDefaultBackground":true,"id":"fadc0093-2969-4c68-a93a-443622c08d81"},"pageTemplateType":"section","groups":{"074e2685-7611-45fb-9e1c-0341fe20581a":{"name":"Background","isLocked":true,"isCollapsed":true}}},{"elements":[{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":0,"lockAspectRatio":true,"backgroundColor":{"color":{"r":196,"g":196,"b":196}},"x":48,"y":0,"width":330,"height":220,"mask":{"type":"rectangle"},"isBackground":true,"type":"image","id":"87685ff5-a429-4c67-a133-b48d9d0bc03e","scale":100,"focalX":50,"focalY":50,"resource":{"type":"image","mimeType":"image\/jpeg","width":8640,"height":5760,"sizes":{"full":{"file":"media\/unsplash:pR-5gi-hB1c","sourceUrl":"https:\/\/images.unsplash.com\/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=8640&h=5760&fit=max","mimeType":"image\/jpeg","width":8640,"height":5760},"large":{"file":"media\/unsplash:pR-5gi-hB1c","sourceUrl":"https:\/\/images.unsplash.com\/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=6912&h=4608&fit=max","mimeType":"image\/jpeg","width":6912,"height":4608},"5184_3456":{"file":"media\/unsplash:pR-5gi-hB1c","sourceUrl":"https:\/\/images.unsplash.com\/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=5184&h=3456&fit=max","mimeType":"image\/jpeg","width":5184,"height":3456},"3456_2304":{"file":"media\/unsplash:pR-5gi-hB1c","sourceUrl":"https:\/\/images.unsplash.com\/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=3456&h=2304&fit=max","mimeType":"image\/jpeg","width":3456,"height":2304},"1728_1152":{"file":"media\/unsplash:pR-5gi-hB1c","sourceUrl":"https:\/\/images.unsplash.com\/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=1728&h=1152&fit=max","mimeType":"image\/jpeg","width":1728,"height":1152},"web_stories_thumbnail":{"file":"media\/unsplash:pR-5gi-hB1c","sourceUrl":"https:\/\/images.unsplash.com\/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=340&h=227&fit=max","mimeType":"image\/jpeg","width":340,"height":227}},"isPlaceholder":false,"isExternal":true,"needsProxy":false,"id":"media\/unsplash:pR-5gi-hB1c","baseColor":"#4073a6","blurHash":"Lo98+3aeMwof%%aeRQkCoJjtbcay","creationDate":"2025-06-24T15:51:13Z","src":"https:\/\/images.unsplash.com\/photo-1750779940886-edfa73b5c5c6?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=8640&h=5760&fit=max","alt":"Icebergs glisten on a dark beach beneath cloudy skies.","attribution":{"author":{"displayName":"Colin Watts","url":"https:\/\/unsplash.com\/@colinwatts?utm_source=web_stories_wordpress&utm_medium=referral"},"registerUsageUrl":"https:\/\/media3p.googleapis.com\/v1\/media:registerUsage?token=AU3aCBR6bb\/jcYncVN2nE6DnnFmn4Ly%2BGQtLz4NSMyGtHKKvEXXmg6Dfyi8NvicHaIIdSUA2vumU0Pq6nFH6KDBQAjxh2hWHdafY1ceRnkitbdv9aWCOOutxGx3VhbZT1s0UvqdRAfQAJTKIUfgpE9z2MFvpA2bBc8lzgJjuPGFzL\/Kep%2B\/APKkOwqCnk548WHS9xzSprMtnTaK0rL6pQI7JdCy2zMPD6\/9NBUjrV75X08Q%3D"}}},{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":0,"lockAspectRatio":false,"scale":100,"focalX":50,"focalY":50,"resource":{"type":"image","mimeType":"image\/jpeg","width":5177,"height":6902,"sizes":{"full":{"file":"media\/unsplash:zVV6vy8t4jY","sourceUrl":"https:\/\/images.unsplash.com\/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=5177&h=6902&fit=max","mimeType":"image\/jpeg","width":5177,"height":6902},"large":{"file":"media\/unsplash:zVV6vy8t4jY","sourceUrl":"https:\/\/images.unsplash.com\/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=4141&h=5521&fit=max","mimeType":"image\/jpeg","width":4141,"height":5521},"3106_4141":{"file":"media\/unsplash:zVV6vy8t4jY","sourceUrl":"https:\/\/images.unsplash.com\/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=3106&h=4141&fit=max","mimeType":"image\/jpeg","width":3106,"height":4141},"2070_2760":{"file":"media\/unsplash:zVV6vy8t4jY","sourceUrl":"https:\/\/images.unsplash.com\/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=2070&h=2760&fit=max","mimeType":"image\/jpeg","width":2070,"height":2760},"1035_1380":{"file":"media\/unsplash:zVV6vy8t4jY","sourceUrl":"https:\/\/images.unsplash.com\/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=1035&h=1380&fit=max","mimeType":"image\/jpeg","width":1035,"height":1380},"web_stories_thumbnail":{"file":"media\/unsplash:zVV6vy8t4jY","sourceUrl":"https:\/\/images.unsplash.com\/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=340&h=453&fit=max","mimeType":"image\/jpeg","width":340,"height":453}},"isPlaceholder":false,"isExternal":true,"needsProxy":false,"id":"media\/unsplash:zVV6vy8t4jY","baseColor":"#0c260c","blurHash":"L44.k*xrI0D*V|t6x?Rj4VNM%Y?Z","creationDate":"2025-07-07T16:39:46Z","src":"https:\/\/images.unsplash.com\/photo-1751906380892-8b95090cc797?ixid=M3wxMzcxOTN8MHwxfHRvcGljfHw2c01WalRMU2tlUXx8fHx8Mnx8MTc1MjMxMTMzMHw&ixlib=rb-4.1.0&fm=jpg&w=5177&h=6902&fit=max","alt":"A colorful parrot perches on a branch.","attribution":{"author":{"displayName":"Valentin","url":"https:\/\/unsplash.com\/@omikron?utm_source=web_stories_wordpress&utm_medium=referral"},"registerUsageUrl":"https:\/\/media3p.googleapis.com\/v1\/media:registerUsage?token=AU3aCBR91abgtSradV4GBC6FIVw4e9xBxt7Gcpfe%2BU7VL8ZS\/y4RshDtFJZAN4yNdWBSw2FS9R0ZNWGhxmXcge\/fgmfOO7KDbYlKEuzRT1A3Bmp2eWsCtK4lbGx%2B7NOsFB7ZOpx1sg3suqRKoKjA0KxRba3T4Duv7T623zT4GzlSUT%2BkoWh07p1%2BhW5lmUaVDWvh85NoNg6u7muvV5O7Wfsv693dCUMR16GEoMLKNUTQQj4%3D"}},"x":91,"y":0,"width":209,"height":278,"type":"image","mask":{"type":"rectangle","showInLibrary":true,"name":"Rectangle","path":"M 0,0 1,0 1,1 0,1 0,0 Z","ratio":1,"supportsBorder":true},"id":"b87ffc19-0fad-4219-ad32-d6c0e2967b56"}],"backgroundColor":{"color":{"r":255,"g":255,"b":255}},"id":"3c74f590-3561-4ad9-91f3-ef90b0d8f3ce","defaultBackgroundElement":{"opacity":100,"flip":{"vertical":false,"horizontal":false},"rotationAngle":0,"lockAspectRatio":true,"backgroundColor":{"color":{"r":196,"g":196,"b":196}},"x":1,"y":1,"width":1,"height":1,"mask":{"type":"rectangle"},"isBackground":true,"isDefaultBackground":true,"type":"shape","id":"e88d9bf8-4186-4827-9d5a-57b6c03994fd"},"pageTemplateType":"section","animations":[{"id":"14d1db88-a371-44bf-921a-76a5d12fb1fa","type":"effect-fly-in","flyInDir":"topToBottom","duration":600,"delay":0,"targets":["b87ffc19-0fad-4219-ad32-d6c0e2967b56"]}]}],"fonts":{"Source Serif 4":{"family":"Source Serif 4","fallbacks":["serif"],"weights":[200,300,400,500,600,700,800,900],"styles":["regular","italic"],"variants":[[0,200],[0,300],[0,400],[0,500],[0,600],[0,700],[0,800],[0,900],[1,200],[1,300],[1,400],[1,500],[1,600],[1,700],[1,800],[1,900]],"service":"fonts.google.com","metrics":{"upm":1000,"asc":1036,"des":-335,"tAsc":1036,"tDes":-335,"tLGap":0,"wAsc":1009,"wDes":324,"xH":475,"capH":670,"yMin":-321,"yMax":1003,"hAsc":1036,"hDes":-335,"lGap":0}}},"autoAdvance":true,"defaultPageDuration":7,"currentStoryStyles":{"colors":[]}}The main issue I see with your HTML above is that the
<amp-story-animation>tags are empty. They should be containing<script>tags with the animation configuration. The Web Stories editor always adds those tags, so the issue must be on your end. Maybe you have something that removes it for security reasons or so.Other validation issues in the HTML above are the duplicate
<style amp-custom>and<meta charset="utf-8">tags which are not coming from the Web Stories editor.
Viewing 4 replies - 1 through 4 (of 4 total)
You must be logged in to reply to this topic.
