Problem/Motivation

When using "NodeLink" for a "Read more" link you can add some CSS classes in the field configuration form in "Link class" input.

In the output the CSS classes are added twice.

Not blocking, juste anoying :)

Steps to reproduce

  • On a display mode of a content, use the "Read more" link added by Display Suite.
  • Setup the settings of the link by adding some classes in the "Link Class" input.
  • Save :)
  • Edit a content with this display, use Preview to change the view mode and use the one with "Read more" link
  • Check the classes in the DOM

Analyse

When checking the code in https://git.drupalcode.org/project/ds/-/blob/8.x-3.x/src/Plugin/DsField/... & https://git.drupalcode.org/project/ds/-/blob/8.x-3.x/src/Plugin/DsField/...

The classes are added both :

  • on the entity and the link_attributes, the first one as an array
  • the second one as a string.

It use the Drupal twig function link some line before https://git.drupalcode.org/project/ds/-/blob/8.x-3.x/src/Plugin/DsField/...

On a Drupal 10.4.5 https://github.com/drupal/drupal/blob/10.4.5/core/lib/Drupal/Core/Templa...

We can see that it merge the attributes, but the classes dont have the same type.

It result on the list of classes in the array + the string of same classes added in the output.

Proposed resolution

My easy solution, send an array too! Drupal will only keep one class if added twice or more.

Here https://git.drupalcode.org/project/ds/-/blob/8.x-3.x/src/Plugin/DsField/...

Change
$link_attributes->addClass($config['link class']);
For
$link_attributes->addClass(explode(' ', $config['link class']));

Et voilà :)

Issue fork ds-3517942

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

stephane aimar created an issue. See original summary.

stephane aimar’s picture

Just FYI as they use the same Field extending DSFieldBase all DS fields got the same issue with this Link Class config.

swentel’s picture

Ha, funny! Could you create a merge request from that, the fix is working indeed!

swentel’s picture

nvm, was able to create a merge request myself

  • swentel committed 6535ce79 on 8.x-3.x
    Issue #3517942: NodeLink add classes twice
    
swentel’s picture

Status: Active » Fixed

Merged, thanks!

stephane aimar’s picture

Thanks :)

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.