[#47705] - Fix HTML issue
- Closed
- 6 May 2026
- Medium
- Build: 5.4-dev
- # 47705
- Diff
- devesht-ML:fix/readmore-html-balance
User tests: Successful: Unsuccessful:
Pull Request resolves #47587
- I read the Generative AI policy and my contribution is compatible with GNU/GPL 2 or later.
Summary of Changes
Fix unbalanced HTML caused by splitting content at the readmore tag in the Content table bind() method.
When an HTML element (e.g. <div>) spans across the readmore boundary, the current implementation uses preg_split() which results in:
- unclosed tags in
introtext - closing tags in
fulltext
This leads to invalid DOM structure and can cause nested .blog-item elements and layout issues in blog/featured views.
This patch ensures that both introtext and fulltext are balanced after splitting.
Testing Instructions
- Create a new article
- Click Toggle Editor (code view)
- Paste the following HTML:
<div class="test-wrapper">
Intro content before readmore
<hr id="system-readmore">
Full content after readmore
</div>-
Save the article and mark it as Featured
-
Create 2–3 similar articles
-
Create a menu item of type Featured Articles
-
Set:
- Leading Articles = 0
- Intro Articles = 3
- Columns = 2 or 3
-
Open the frontend page and inspect
.blog-itemelements
Actual result BEFORE applying this Pull Request
introtextcontains unclosed HTML tags- Browser auto-corrects DOM
.blog-itemelements become nested- Layout breaks (stacked or inconsistent grid)
Expected result AFTER applying this Pull Request
- HTML structure remains valid after readmore split
.blog-itemelements are rendered as siblings- No DOM nesting issues
- Layout behaves correctly according to column configuration
Screenshots
Before Fix (nested structure / broken layout):
After Fix (correct DOM structure):
Link to documentations
- No documentation changes for guide.joomla.org needed
- No documentation changes for manual.joomla.org needed
| Status | New | ⇒ | Pending |
joomla-cms-bot
- | Category | ⇒ | Front End com_content Libraries NPM Change |
| Labels |
Added:
NPM Resource Changed
PR-5.4-dev
|
||
| Category | Front End com_content Libraries NPM Change | ⇒ | Front End com_content Libraries |
I agree that the fix should be in the library where the content is actually split but this PR also includes changes at the template layer
| Labels |
Removed:
NPM Resource Changed
|
||
| Category | Front End com_content Libraries | ⇒ | Front End com_content Libraries NPM Change |
| Labels |
Added:
NPM Resource Changed
|
||
Thank you for the review and for pointing that out.
I have now removed the unintended template-level changes from default_item.php and ensured that the fix is limited strictly to the content processing layer.
I’ve also updated the implementation to handle a broader set of block-level elements, as suggested, to make the solution more robust.
Please let me know if any further adjustments are needed.
| Category | Front End com_content Libraries NPM Change | ⇒ | Libraries NPM Change |
| Category | Libraries NPM Change | ⇒ | Libraries |
| Labels |
Removed:
NPM Resource Changed
|
||
| Category | Libraries | ⇒ | Libraries NPM Change |
Thanks for the PR, Unfortunately, this is not a propper solution for the problem. It is also not a big problem because TinyMCE fixes some of the situations.
| Status | Pending | ⇒ | Closed |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2026-05-06 17:48:38 |
| Closed_By | ⇒ | rdeutz | |
| Labels |
Added:
NPM Resource Changed
|
||
Additional Notes
During testing, it may appear that articles are displayed unevenly (for example, two items in the first row and one item below). This is expected behavior based on Joomla’s blog layout configuration.
The number of columns determines how many items are displayed per row. When the total number of articles is not evenly divisible by the column count, the remaining items naturally flow into the next row. For example, with 3 articles and 2 columns, the layout will show 2 items in the first row and 1 item in the second row.
This behavior is unrelated to the reported issue.
Implementation Details
While investigating the problem, I initially explored applying a fix at the template level (
default_item.php) by adjusting howintrotextis rendered. Although this resolved the issue locally, it only acted as a presentation-layer workaround and did not address the root cause.The actual issue originates earlier during the
readmoresplit in the Content tablebind()method. Whenpreg_split()is used, it can produce unbalanced HTML if an element spans across the readmore boundary.For this reason, the fix has been implemented in:
This ensures that the HTML is corrected at the data-processing stage, making the solution consistent across all views rather than limited to a specific template.