Skip to content

Feature : Improve Math Inline and Block UI#77743

Open
Vrishabhsk wants to merge 4 commits into
WordPress:trunkfrom
Vrishabhsk:add/improve-math-ui
Open

Feature : Improve Math Inline and Block UI#77743
Vrishabhsk wants to merge 4 commits into
WordPress:trunkfrom
Vrishabhsk:add/improve-math-ui

Conversation

@Vrishabhsk

@Vrishabhsk Vrishabhsk commented Apr 28, 2026

Copy link
Copy Markdown
Contributor

What?

Why?

  • The current Math interface assumes you already know LaTeX with no direction.

How?

Both the block-level popover and the inline toolbar popover were updated with the same UX improvements:

  • Added help text explaining what LaTeX can express
  • Expanded the placeholder to show three examples
  • Prefixed error messages with friendlier language
  • Added a link to the official Math block documentation page

Testing Instructions

  1. Open a post or page in the block editor.
  2. Insert a Math block and click into it.
  3. Confirm the label "LaTeX math syntax" is visible above the textarea.
  4. Confirm help text appears below the input.
  5. Confirm the placeholder shows three examples.
  6. Confirm a "Learn more about LaTeX syntax" link appears and points to the WordPress documentation.
  7. Type invalid LaTeX and confirm the error message starts with actionable text rather than raw parser output.
  8. Repeat steps 2–7 with the inline Math format inside a paragraph.
Before (Inline) Before (Block)
Screenshot 2026-04-28 at 4 19 09 PM Screenshot 2026-04-28 at 4 19 18 PM
After (Inline) After (Block)
Screenshot 2026-04-28 at 4 18 04 PM Screenshot 2026-04-28 at 4 17 54 PM

Use of AI Tools

  • This PR description was authored with the help of kimi-k2.6:cloud model from ollam.

@github-actions

github-actions Bot commented Apr 28, 2026 •
edited
Loading

Copy link
Copy Markdown

Warning: Type of PR label mismatch

To merge this PR, it requires exactly 1 label indicating the type of PR. Other labels are optional and not being checked here.

  • Required label: Any label starting with [Type].
  • Labels found: Needs Design Feedback, [Package] Block library, [Package] Format library, [Block] Math.

Read more about Type labels in Gutenberg. Don't worry if you don't have the required permissions to add labels; the PR reviewer should be able to help with the task.

@github-actions github-actions Bot added [Package] Block library /packages/block-library [Package] Format library /packages/format-library labels Apr 28, 2026
@github-actions

github-actions Bot commented Apr 28, 2026 •
edited
Loading

Copy link
Copy Markdown

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: Vrishabhsk <vrishabhsk@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: simison <simison@git.wordpress.org>
Co-authored-by: jameskoster <jameskoster@git.wordpress.org>
Co-authored-by: annezazu <annezazu@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@Vrishabhsk Vrishabhsk mentioned this pull request Apr 28, 2026
Open
t-hamano
t-hamano reviewed Apr 29, 2026
View reviewed changes
Comment thread packages/block-library/src/math/editor.scss Outdated
Comment thread packages/format-library/src/math/style.scss Outdated
Comment thread packages/block-library/src/math/edit.js Outdated
Comment on lines +137 to +139
<ExternalLink href="https://wordpress.org/documentation/article/math-block/">
{ __( 'Learn more about LaTeX syntax' ) }
</ExternalLink>

@t-hamano t-hamano Apr 29, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This document explains Math blocks only, not LaTeX syntax itself. There might be a better document available 🤔

@simison simison Apr 29, 2026 •
edited
Loading

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

latex-project.org seems pretty great, but might be worth linking first to .org docs, where there's a short blurb and then linking further to potentially multiple resources from there? That way, we get the short intro blurb at least in every language.

@Vrishabhsk Vrishabhsk May 19, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So should i keep it as is or replace it with https://www.latex-project.org/help/documentation/#typesetting-complex-mathematics.

@t-hamano t-hamano added the Needs Design Feedback Needs general design feedback. label Apr 29, 2026
@t-hamano t-hamano requested a review from a team April 29, 2026 02:08
simison
simison reviewed Apr 29, 2026
View reviewed changes
Comment thread packages/format-library/src/math/index.js Outdated
@jasmussen jasmussen mentioned this pull request May 13, 2026
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@simison simison simison left review comments

@jameskoster jameskoster jameskoster left review comments

@t-hamano t-hamano t-hamano left review comments

@ellatrix ellatrix Awaiting requested review from ellatrix ellatrix is a code owner

@ajitbohra ajitbohra Awaiting requested review from ajitbohra ajitbohra is a code owner

@fabiankaegy fabiankaegy Awaiting requested review from fabiankaegy fabiankaegy is a code owner

At least 1 approving review is required to merge this pull request.

Assignees

No one assigned

Labels

[Block] Math Needs Design Feedback Needs general design feedback. [Package] Block library /packages/block-library [Package] Format library /packages/format-library

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Math inline format & block: add more context/in block guidance

4 participants

@Vrishabhsk @simison @jameskoster @t-hamano