#33300 closed task (blessed) (fixed)
More text patterns
Reported by: | iseulde | Owned by: | iseulde |
---|---|---|---|
Milestone: | 4.5 | Priority: | normal |
Severity: | normal | Version: | |
Component: | TinyMCE | Keywords: | needs-patch dev-feedback |
Focuses: | javascript | Cc: |
Description
I'd like to add a pattern for a horizontal rule (probably ^-{3,}$
), and add support for inline patterns. Any other patterns that should be in core?
This will require some rethinking of the current code.
It'd be great if a WordPress plugin could add and remove patterns.
Attachments (8)
Change History (45)
#2
@
9 years ago
+1 for a horizontal rule text pattern, though I guess now it's semantically called a "thematic break":
In previous versions of HTML, it represented a horizontal rule. It may still be displayed as a horizontal rule in visual browsers, but is now defined in semantic terms, rather than presentational terms.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hr
Also definitely +1 for a PHP API to add new patterns if possible. I'm still looking to see if there is one but this ticket implies it doesn't exist yet.
I was hoping for something like add_text_pattern()
and remove_text_pattern()
, but even a guide similar to this one (about filtering tiny_mce_before_init
to insert custom formats) would be super useful.
https://codex.wordpress.org/TinyMCE_Custom_Styles
Personally I want to add shortcuts for code
and for our custom blockquote.translation
blocks.
#3
@
9 years ago
- Milestone changed from Future Release to 4.5
- Owner set to iseulde
- Status changed from new to assigned
#4
@
9 years ago
- Status changed from assigned to accepted
Aiming to put this in by the end of the weekend. This will include conversions on paste.
#5
@
9 years ago
Need an alternative for the bookmark as it does not remove itself. Also tests are timing out in PhantomJS, not sure why yet.
#7
@
9 years ago
Please test. Next meeting we should confirm if this is good behaviour, as well as decide whether or not to add some shortcuts on paste. @mikeschroder
This ticket was mentioned in Slack in #core by jorbin. View the logs.
9 years ago
#10
@
9 years ago
Few more possible patterns:
-..-
for striked through text<del></del>
.--..--
for underlined text<span style="text-decoration: underline;"></span>
.
Single patterns:
----
for<hr>
.
And single patterns for "WordPress tags":
++++
for<!--more-->
&&&&
for<!--nextpage-->
#12
follow-up:
↓ 14
@
9 years ago
@iseulde, the >
pattern for blockquotes is good for LRT view. We should add <
blockquote pattern for RTL view.
#14
in reply to:
↑ 12
@
9 years ago
Replying to ramiy:
the >
pattern for blockquotes is good for LRT view. We should add <
blockquote pattern for RTL view.
That's pretty easy to do however in RTL Chrome inserts <
when I type >
, so changing it will not work. Or we can add both <
and >
in RTL?
#16
follow-up:
↓ 19
@
9 years ago
@ramiy: Thanks for the feedback. Underlining is a bad practice for web documents if the underlined text is not a link. So that's a no. <del>
has no common pattern or markdown pattern, so we can't do that either, and I don't think it's a good idea to start adding custom WordPress shortcuts for more and next page...
#17
@
9 years ago
Maybe, at some point, it could be cool to have inline UI to switch between HR, more and nextpage.
#18
@
9 years ago
<del>
has no common pattern or markdown pattern
Apologies if I lack the background, but while it's true that <del>
is not part of the Markdown or CommonMark specs, it is a feature of GitHub Flavored Markdown:
https://help.github.com/articles/basic-writing-and-formatting-syntax/#styling-text
Example:
This is a ~~mistake~~ success.
Slack offers a similar single-tilde format:
https://get.slack.help/hc/en-us/articles/202288908-Formatting-your-messages
Example:
This is a ~mistake~ success.
#19
in reply to:
↑ 16
@
9 years ago
@iseulde, My way of thinking is a bit different. I was looking at the current TinyMCE buttons and I think we should create text patters for all those buttons, or at least for the basic buttons. To make it easy to write content without the mouse, only the keyboard.
The basic buttons are:
- Bold
<strong>
- introduced in wp4.3 - Italic
<em>
- introduced in wp4.3 - Strikethrough
<del>
- Unordered List
<ul>
- introduced in wp4.3 - Ordered List
<ol>
- introduced in wp4.3 - Blockquote
<blockquote>
- introduced in wp4.3 - Horizontal Rule
<hr>
- will be introduced in wp4.5
For now, only the strikethrough <del>
has no text pattern.
Also, you said that underlining is a bad practice, but we have an underline button in the editor. In my opinion we should probably add an underline pattern, but we don't have to do it in 4.5.
#22
@
9 years ago
@iseulde Shortcuts on paste would be a nice improvement.
I just tried inserting a backtick, pasting a word and adding another backtick.
Expected: The pasted word between <code></code>
Actual: The pasted word between backticks.
This ticket was mentioned in Slack in #core-flow by boren. View the logs.
9 years ago
#24
@
9 years ago
I ran through the new patterns on Macnchrome and an iPhone 6+. I noticed the lack of shortcut on paste as well, particularly with code. Otherwise, behaving well.
This ticket was mentioned in Slack in #core by chriscct7. View the logs.
9 years ago
#26
@
9 years ago
@iseulde: What's left here? Is it being considered to treat <code>
differently from the other text patterns (for paste reasons), or are we deciding that it is intended behavior?
#27
@
9 years ago
I've been using this for a bit and have the following thoughts. I would note that I am neither a fan nor a frequent user of Markdown and don't think that it should serve as a canonical source of patterns.
`code`
is awesome for the fairly small subset of people who need it, and is a perfectly good place to include a little bonus for these users. :)- It does seem like it should convert text that's been pasted between open/close patterns. Not sure if this is what was meant by converting on paste; I had interpreted that feature as converting patterns contained within the paste, which I don't think should be done.
- The open/close patterns seem a little too liberal with converting. I think there should be a space/newline before the start indicator and after the end indicator, with no space on the other side. Right now
wp_function_name
ends up as wpfunctionname andblah * blah * blah
ends up as blah blah blah, which seems a bit strange and very unlikely to actually be what most people want. - If there's only a single space between the open/close indicators, doesn't seem like it should convert. Right now it just ends up with your text disappearing, which is alarming.
- Generally I dislike that there are multiple patterns for the same thing. We should pick one and stick with it, preferably one that is memorable but not something that would commonly be used for other reasons/habits.
- Per above, for
<hr>
I would suggest just---
and not***
. Having it be of any length of 3 or more seems okay, though. I don't know if it's meant to work with spaces between the characters, but it doesn't make any sense to do so since they'll convert to an unordered list most of the time (exception is when you've backspaced to undo that conversion). - I am not very convinced of the utility of bold/italic. Asterisks/underscores are annoying to type on most of the touch screen keyboards I've used (where selecting text to format after the fact is burdensome), and the usual keyboard shortcuts when you can press multiple keys seem intuitive/generally learned enough. I can certainly be convinced that they are useful; would like to hear opinions on this.
- If we keep bold/italic, I would again go with just one pattern for each, and would suggest
**bold**
and__italic__
. I recognize that this is a pretty significant deviation from Markdown, but I think that the differentiation as well as the double characters make it more intentional. I am likely biased because I use*thing*
frequently and hate when it converts. If you ever see something from me in Slack that is bold and struck out, it's because I was trying to be *~flippant~* :) And speaking of Slack, they have a great line on why they use*bold*
and_italic_
: "Our message formatting is similar to other popular services like Skype and Google Talk, and is intended for a majority of our users who are unfamiliar with Markdown."
This ticket was mentioned in Slack in #core-editor by helen. View the logs.
9 years ago
This ticket was mentioned in Slack in #core by chriscct7. View the logs.
9 years ago
This ticket was mentioned in Slack in #core by helen. View the logs.
9 years ago
#34
@
9 years ago
The current patterns are confusing, I think we should reserve different chars to different actions:
#
for headings.#
,##
,###
,####
,#####
,######
*
for bold text.*
,**
_
for italic text._
,__
~
for strikethrough.~
,~~
`
for code.-
for horizontal lines.---
#35
in reply to:
↑ 33
@
9 years ago
Replying to ramiy:
Another thought: we can also use
~~~
for horizontal lines<hr>
.
--- (hyphens) already works for horizontal rules <hr />
#36
@
9 years ago
In 33300.6.patch: add editor settings to add or override the default text patterns.
Example:
add_filter( 'tiny_mce_before_init', 'textpatterns_test' ); function textpatterns_test( $init ) { $init['wptextpattern_inline_patterns'] = '{ strong: { start: "*", end: "*", format: "bold" }, strong2: { start: "**", end: "**", format: "bold" }, em: { start: "_", end: "_", format: "italic" } }'; return $init; }
Backticks
`
for<code>
blocks please!