Web story Embed into Classic Editor

Hello there, @barbler! Once you publish a story, you can hit “add to a new post“. The shortcode will display with the embed code already populated. You can select the Web Stories button to open the modal and select a different layout as well.

Please let me know if you need any additional support.

This is very exciting news, but how would I do this for a web story already published???

Can’t wait to find out, thank you!

Update…I called wpengine and the tech rep told me to download a plug-in called wp file manager.
I was trying to mimic the code you provided but it didn’t work and create an error when I added it to post and clicked web stories button.

Here is the mimic of the code I tried:

[web_stories_embed url=”https://lepplerinjurylaw.com/web-stories/bus-accident-lawyer-story/” title=”bus accident lawyer story”
poster=”https://lepplerinjurylaw.com/wp-content/uploads/2022/08/bus-accident-lawyer-in-Baltimore-MD-story-cover-image.png’ width=”360” height=”600” align=”none”]

Thank you.

@barbler If you wish to get the embed code for a Story that’s already published you can do the following:

1. Open the story in the editor
2. Go to Document tab and change the visibility from ‘public‘ to ‘private‘ and once more back to ‘public‘
3. Publish your Story once more and when prompted select to Add to new post which will present you with the embed code for that Story

Let me know if you need any further assistance.

Thank you @adamdunnage

Yes, that worked ??

But one more question…the image on the phone is ok but on the laptop it is too large.
Can you suggest a better dimension?

Thank you.

the code is:

[web_stories_embed url=”https://www.lepplerinjurylaw.com/web-stories/motorcycle-accident-causes/” title=”The Most Common Motorcycle Accident Causes” poster=”https://www.lepplerinjurylaw.com/wp-content/uploads/2022/03/cropped-Motorcyle-safety-is-priority-1-640×853.jpg” width=”360″ height=”600″ align=”none”]

actually, I am confused with the web story on the Add New Story where the shortcode is embedded and the Web Stories Button gives you choices, as shown in the image that was created by @luckynasan

View post on imgur.com

can you please explain how that works…
am I supposed to add many shortcodes to the same post page and then publish?

Add Post creates a blog post.
Will this blog post just contain google stories?
In the image it shows Number of stories 5….
Just confused why it is adding a draft blog post and what to do with it.

Thank you.

@barbler The steps I provided above are a way to get the embed code for a single Story if you need it. This will try to create a new post as you mention but you can disregard that post if you wish and just copy/paste that embed code for the single Story into a post/page of your choice.

The Web Stories button in the classic editor can add many Stories in a Carousel/List/Grid. You also have a number of other options here such as number of Stories to display, how to order the Stories and what to display. This will pull in all the latest Stories matching the criteria set up to the number of Stories you have allowed.

Hope this helps to explain the difference between the two but let me know if you have any further questions.

Thank you for explaining @adamdunnage. yes, 2 more questions.

1. When I add the shortcode to a blog post, the outcome is way too large. again, here is an example…
[web_stories_embed url=”https://www.lepplerinjurylaw.com/web-stories/motorcycle-accident-causes/” title=”The Most Common Motorcycle Accident Causes” poster=”https://www.lepplerinjurylaw.com/wp-content/uploads/2022/03/cropped-Motorcyle-safety-is-priority-1-640×853.jpg” width=”360″ height=”600″ align=”none”]

I tried adjusting the size so that it would appear in an appropriate size on a blog, but I could not adjust. How would I make adjustments to make it smaller?

2. regarding the web stories button, if it pulls in the last 5 web stories, is the idea that I would create a short blog post inviting the viewer to watch the most recent web stories? I don’t quite understand what that purpose is. Would I have a published blog post generally speaking about the business and just include the web stories as a feature of the blog that keeps updating by itself?

Thank you very much.

@barbler

1. When I add the shortcode to a blog post, the outcome is way too large. again, here is an example…
[web_stories_embed url=”https://www.lepplerinjurylaw.com/web-stories/motorcycle-accident-causes/” title=”The Most Common Motorcycle Accident Causes” poster=”https://www.lepplerinjurylaw.com/wp-content/uploads/2022/03/cropped-Motorcyle-safety-is-priority-1-640×853.jpg” width=”360″ height=”600″ align=”none”]

I tried adjusting the size so that it would appear in an appropriate size on a blog, but I could not adjust. How would I make adjustments to make it smaller?

You can do this by adjusting the width and height values. You could also add in some of your own custom CSS for these however we are unable to advise on this as it falls out of the scope of the plugin.

2. regarding the web stories button, if it pulls in the last 5 web stories, is the idea that I would create a short blog post inviting the viewer to watch the most recent web stories? I don’t quite understand what that purpose is. Would I have a published blog post generally speaking about the business and just include the web stories as a feature of the blog that keeps updating by itself?

This can be used however you wish to use it. There is no right or wrong way to use this and different users will use these carousels and lists differently. You could for example have a ‘Latest Stories‘ blog page but as I say this is your choice on if you use this or how you use it.

Hope I have answered the questions for you.

Thank you, but when I change the size to: 180 x 300 or 90 x 150 the size doesn’t change. Why? is there something in this shortcode which makes it fill the width of the visual blog post?

Thank you

• This reply was modified 2 years, 6 months ago by barbler.
• This reply was modified 2 years, 6 months ago by barbler.
• This reply was modified 2 years, 6 months ago by barbler.

Please, the web stories plug-in is perfect except for the sizing. I am sure it would help a ton of people if the web story can be easily changed in size.

You say you don’t provide support for CSS to do it, but shouldn’t the plug-in be able to have a change of size?

Please advise how to move forward and get this accomplished.

Thank you

@barbler I have been testing the embed width and height and it appears that there may be a bug here that you have highlighted. I just need to do a little more testing on this and will be filing a bug report for this for the team to address.

Once I have filed the bug I will pass on the reference so that you can follow the progress on this. Thanks for highlighting this.

Here is the GitHub issue for you to follow: https://github.com/GoogleForCreators/web-stories-wp/issues/12241

Thanks @adamdunnage & @barbler ,
I came here with the same size problem – it was previously working fine earlier on my website (2 months ago), so I think it could be a recent WordPress update.

I tried to change the size in the embed code but nothing works, so I came here to have some clue…

@marsboul2d As mentioned above this looks to be a bug which I have filed a GitHub issue for. The team will look into this so please feel free to follow there for updates.