How to define custom class, title, and target in L

Question

Prerequisites

[x] Can you reproduce the problem on TYPO3 8.7 LTS - YES

[x] Did you [perform a cursory search] to see if your bug or enhancement is already reported? -YES

Description

How do I configure default link target, class, and title for the Link Browser in any element link (usually element titles and images) AND in rte_ckeditor in Typo3 8 LTS? I've spent several hours trying to configure it, but no success and no documentation out there. The fields are empty as you can see on the images below.

Steps to Reproduce the problem

1. Create any element that you can link the title or image.
2. Click to open the Link Browser
3. The options come empty for any type of link (Page, File, Folder, External URL, Email).

Expected behavior: I want to define default classes, link targets and titles for each type of link if they are empty. For example External URL, I want to automatically populate with target="_blank", class "external-link", title="Link to External Website", if the link wasn't configure previously. Basically for any new link I just want to have it auto populated with my custom values and not empty values.

This used to work for rtehtmlarea only on previous Typo3 versions, but not I'm not able to set this option system wide on Typo3 8 LTS and ckeditor.

The PageTS that used to work only for rtehtmlarea was something like this:

RTE {
    classesAnchor {
        externalLink {
            class = external-link
            type = url
            titleText = Opens external link in new window
            target = _blank
            image =
        }
        externalLinkInNewWindow {
            class = external-link-new-window
            type = url
            titleText = Opens external link in new window
            target = _blank
            image =
        }
        internalLink {
            class = internal-link
            type = page
            titleText =  Opens internal link in this window
            target = _top
            image =
        }
        internalLinkInNewWindow {
            class = internal-link-new-window
            type = page
            titleText = Opens internal link in new window
            target = _blank
            image =
        }
        folder {
            class = folder
            type = folder
            titleText =
            target =
            image =
        }
        download {
            class = download
            type = file
            titleText = Initiates file download
            target = _blank
            image =
        }
        mail {
            class = mail
            type = mail
            titleText = Email Address
            image =
        }
    }
}

I would like this to work for the new rte_ckeditor as well for any element options that I can link using the Link Browser.

Answer 1

Here is the solution,

RTE.default {

     # This will provide only basic tool in the text RTE
     preset = default

     ## Bootstrap CSS
     contentCSS {
         20 = fileadmin/Resources/Public/Bootstrap/css/bootstrap.css
     }


     classesAnchor {
        url {
            class = externalLink
            type = url
            titleText = Opens external link in new window
            target = _blank
            image =
         }

        page {
            class = internalLink
            type = page
            titleText =  Opens internal link in this window
            target = _top
            image =
        }

        file {
            class = download
            type = file
            titleText = external file
            target = _blank
            image =
        }

        folder {
            class = folder
            type = folder
            titleText = folder file
            target = _blank
            image =
        }

        mail {
            class = mail
            type = mail
            titleText = Email Address
            image =
        }
    }

    buttons.link{
        page.properties.class.default = internalLink

        url.properties.class.default = externalLink

        folder.properties.class.default = folder

        file.properties.class.default = download

        mail.properties.class.default = mail

        properties.class.allowedClasses = internalLink,externalLink,folder,mail,download
    }
}

Check out this, i have added default link title as well as its targer too. you can see the output of my backend:

Answer 2

There is a bug in TYPO3 8.7.8 (only) - see: https://forge.typo3.org/issues/82865

[EDIT] the classesAnchor stuff works only in version 8.7.5 to 8.7.7 and will hopefully work again in 8.7.9

But the correct answer whould be (like Ghanshyam Bhava pointed out in his comment) to switch to YAML configuration.

https://typo3worx.eu/2017/02/configure-ckeditor-in-typo3/

# Load default processing options
imports:
    - { resource: "EXT:rte_ckeditor/Configuration/RTE/Default.yaml" }

classesAnchor:

  externalLink:
    class: 'external-link'
    type: 'url'

  downloadLink:
    class: 'download-link'
    type: 'file'

  mailLink:
    class: 'mail-link'
    type: 'mail'

buttons:
  link:
    properties:
      class:
        allowedClasses: 'external-link,download-link,mail-link'

Link Browsers for other fields outside RTE should be possible via TCA-Overrides.

Answer 3

So after days and days and days!!! of search, trials, and errors, I finally found a way to enable the auto populated parameter of a link according to their type outside rte_ckeditor or even outside rtehtmlarea. It's not exactly what I wanted but is almost there!

Adding this to my Page TSConfig solved part of the problem:

TCEMAIN.linkHandler {
    # I don't want to load the folder link handler so I reset it.
    folder >
    # Leaving page type empty on purpose.
    page {
    }
    file {
        addParams = onclick="jumpToUrl('?act=file&linkAttributes[target]=_blank&linkAttributes[title]=Opens or downloads file in new window&linkAttributes[class]=download&linkAttributes[params]=');return false;"
    }
    url {
        addParams = onclick="jumpToUrl('?act=url&linkAttributes[target]=_blank&linkAttributes[title]=Opens external link in new window&linkAttributes[class]=externalLink&linkAttributes[params]=');return false;"
    }
    mail {
        addParams = onclick="jumpToUrl('?act=mail&linkAttributes[title]=Opens email manager to send an email&linkAttributes[class]=mail&linkAttributes[params]=');return false;"
    }
}

I didn't configure anything for page because if it's populated and I click on File, External Url, Email, or any other custom link handler, the attributes are passed along from the Page link handler, which defeats the purpose of the pre-populated parameters for each link handler type.

The only remaining issue is if I click for example on External URL, the target will be "_blank", title will be "Opens external link in new window" and class will be "externalLink". So far so good. Then if you click to link a File or even to link an internal Page, those parameters that pre-loaded for External URL will be passed along, which I think it shouldn't happen. Since I'm trying to pre-populate each link type, why would I want to keep the attribute of a previous link type? This might be just a matter of opinion, but I would like to have the option for force pre-populated parameters for each link type. Maybe I'm just missing a small config to achieve this behavior.