Automattic / Automattic/jetpack
Related Posts block in Single template shows as a list block on sites where related posts prerequisites are not met
- Dominant language
- PHP
- Stars
- 1.8k
- Forks
- 898
- Avg merge
- 1d 18h
- Merged PRs (30d)
- 774
Description
**2023-06-01 Update** - This has been narrowed down to pretty specific parameters: _The Related Posts block CSS does not loading correctly when used on a Single Template AND when the Related Posts requirements are not met on the site._
**Workaround / Solution for now**
Testing and user examples show that the issue resolves once the requirements are met, and the related posts cache is refreshed. With that in mind, users who encounter this issue should remove the block from their template until they have met all the requirements [listed here](https://wordpress.com/support/related-posts/#requirements) (and possibly 12 hours has past since that point). After that, they should be fine to set up the block on their single template. -[cuemarie](https://github.com/Automattic/jetpack/issues/30577#issuecomment-1572926047)
---
### Quick summary
If you add the Related Posts block to a template, the posts are shown vertically and with list markers. It looks correct in the Editor, but on the live site, it doesn't.
I tested it with the themes Rainfall and Iotix, and it happens on both. I didn't test on other blockbase themes.
### Steps to reproduce
1. Activate the Rainfall theme.
2. Open the Single template in the Site Editor.
3. Add the Related Posts block.
4. Save the changes and open the live site.
### What you expected to happen
The related posts should appear in a horizontal format if you are using the grid view, or a vertical format if you are using the list view as seen using the Site Editor.
### What actually happened
The Related posts are shown always in a vertical format regardless of what you have chosen and as a list with markers that shouldn't be there even when using the List View.
### Impact
Some (< 50%)
### Available workarounds?
Yes, difficult to implement
### Platform (Simple and/or Atomic)
Simple
### Logs or notes
I found that if you also add a related posts block, directly inside the content of the post, both of them, the one in the template and the one in the post, are shown correctly. As a workaround, I inserted a related posts block as the content of a post, making it show only the title of one post in white so it can't be seen. Not the best workaround.
Here is a video of the problem and the workaround.
https://user-images.githubusercontent.com/46269032/235639852-ae5e876e-ddb1-47ac-906e-cc84689edb79.mp4
Contributor guide
Research direction
Start by reproducing the Related Posts block in the Single template with the site's prerequisites unmet, comparing the Site Editor with the live site and checking the grid and list views. Done means the live block uses the selected layout and does not show unwanted list markers under those conditions.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- wordpress
- Domain
- content, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100