Opened 3 years ago

Closed 3 years ago

#14700 closed New Feature (wontfix)

Need to be able to configure colors to wrap links

Reported by: csmaclaga Owned by:
Priority: Normal Milestone:
Component: Core : Styles Version:
Keywords: Cc:

Description

I've read through the items I can find on this topic (ex #7212). If I missed something and the functionality already exists, please point me in the right direction.

We need to be able to select some text that also contains a link, select a foreground/background color, and have the style applied once. This would allow a user to select a block of text (that includes a link), color the text, and still have the link render as a link.

For example:

  1. Go to:

http://ckeditor.com/latest/samples/

  1. Enter some sample text
    before link after
    
  2. Select the link text, and click the link button to create a link.
  3. Select the entire contents and change the foreground color to red. The results will look like this:
    <span style="color:#FF0000;">before </span><a href="http://ckeditor.com" data-cke-saved-href="http://ckeditor.com"><span style="color:#FF0000;">link</span></a><span style="color:#FF0000;"> after<br></span>
    

We'd like to be able to make a configuration change that would change the results of these steps to look like this:

<span style="color:#FF0000;">before <a href="http://ckeditor.com" data-cke-saved-href="http://ckeditor.com">link</a> after<br></span>

Compare the actual results from above with slightly alternate steps (insert the link after colorizing the text):

  1. Go to:

http://ckeditor.com/latest/samples/

  1. Enter some sample text
    before  after
    
  2. Select the entire contents and change the foreground color to red.
  3. Place the cursor in the middle, type the word link, select the word link and click the link button to create a link. The results will look like this:
    <span style="color:#FF0000;">before <a href="http://ckeditor.com" data-cke-saved-href="http://ckeditor.com">link</a> after<br></span>
    

I understand that not everyone will want this behavior, which is why I'm asking for this to be a configuration option. In our case it's the desired behavior:

  • we'd like to leave links looking like links for this user gesture
  • we'd like to avoid the extra characters in the markup from contributing toward the field's character limit

Change History (1)

comment:1 Changed 3 years ago by Jakub Ś

Resolution: wontfix
Status: newclosed
Version: 4.5.10 (GitHub - master)

Here is the code responsible for applying color: https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/colorbutton/plugin.js#L152

Here is the code responsible for checking whether something is a link or not - https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/colorbutton/plugin.js#L147-L150.
As you can see we had two issues with links plus the behaviour described works as expected. If you select all, it makes sense to style all and not leaving links alone.

The only thing I can propose here is that you code it according to your needs. You can get code from here - http://docs.ckeditor.com/#!/guide/dev_source, make changes and build CKEditor according to http://docs.ckeditor.com/#!/guide/dev_build


Tip: The whole above code checks whether we are dealing with foreground or background color and next applies appropriate child rule. The child rule is used here: https://github.com/ckeditor/ckeditor-dev/blob/master/core/style.js#L917-L920, here: https://github.com/ckeditor/ckeditor-dev/blob/master/core/style.js#L773 and here: https://github.com/ckeditor/ckeditor-dev/blob/master/core/style.js#L797.

Probably the simplest solution for your needs would be removing link check https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/colorbutton/plugin.js#L149 but please make sure it doesn't introduce any unwanted behaviour based on two bugs mentioned.

Note: See TracTickets for help on using tickets.
© 2003 – 2019 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy