RTE - 根据条件包装链接 [英] RTE - wrap link based on condition

问题描述

我的 TYPO3 网站使用带有 RTE 的 TYPO3 6.1.我想要存档的是在满足条件(链接具有类)时用 DIV 包装链接.

编辑器应该只执行以下操作:

1. 在 RTE 中创建一个新文本(例如我的链接")
2. 为 RTE 中的新文本创建新链接
3. 为链接选择一个类(例如myClass")

这将产生以下 HTML:

我的链接

在网站前端，我希望用户创建的链接用 DIV 包装 - 但前提是链接具有myClass"类.

我已经尝试了以下

tt_content.text.20.parseFunc.tags.link.typolink.wrap = <div class="anotherClass">|</div>

用 DIV 包装所有链接.

当编辑器为它选择了myClass"时，TS 中是否有一种方法可以只包装链接?

如果没有，是否有另一种(对编辑器友好的)方式来存档?

我已经看过自定义 userElements 和 blockformats，但对于编辑器来说，这两者似乎都太复杂了，因为他们必须执行多个操作才能创建具有特殊样式的单个链接.

我在前端生成的 HTML 应该是这样的

<a href="#" class="internal-link" title="sometitle">我的链接</a>

我最后的选择是使用 JQuery - 但实际上这不是一个非常干净的解决方案，所以我更喜欢 TYPO3/TS 解决方案.

解决方案

经过几个小时的 Typoscript 调试后，我终于找到了解决这个问题的方法.我使用了一种类似的技术，如下所示 http://wiki.typo3.org/External_links

一般来说，我只是创建一个包含链接类名的新寄存器，然后我使用类名将包装添加到链接中.

lib.parseFunc.tags.link {Tyrelink.parameter.append = LOAD_REGISTER错字link.parameter.append {链接类{cObject = 文本对象{stdWrap.data = 参数:allParams}# 按空格字符拆分链接参数.第三个值是链接类名分裂 {令牌.char = 32cObjNum = 1||2||33 = 文本3.电流 = 1}}}newWrap.cObject = CASEnewWrap.cObject {key.data = register:linkClass# 根据类名设置链接的外包装默认值 = 文本默认值 = |myClass = 文本myClass.value = <div class="anotherClass">|</div>内部链接 = 文本internal-link.value = <div class="anotherClassForInternalLink">|</div>}}lib.parseFunc_RTE.tags.link {Typlink.parameter.append <lib.parseFunc.tags.link.typolink.parameter.append包裹 <lib.parseFunc.tags.link.newWrap}

看起来是有线的，但效果很好:-)

My TYPO3 website uses TYPO3 6.1 with the included RTE. What I want to archive is to wrap links with a DIV when a condition (link has class) it met.

The editor should only do the following:

1. Create a new text in the RTE (e.g. "My link")
2. Create a new link for the new Text in the RTE
3. Select a class for the link (e.g. "myClass")

This results in the following HTML:

<a href="#" class="myClass" title="sometitle">My Link</a>

In the website frontend, I want the user created link to be wrapped with a DIV - but only, if the link has the class "myClass".

I have tried the following

tt_content.text.20.parseFunc.tags.link.typolink.wrap = <div class="anotherClass">|</div>

which wraps all links with the DIV.

Is there a way in TS to only wrap the link, when the editor has selected "myClass" for it?

If not, is there another (editor friendly) way to archive this?

I have already looked at custom userElements and blockformats, but both seems to be too complicated for the editors, since they have to do more than one operation to create a single link with a special styling.

My resulting HTML in the frontend should look like this

<div class="anotherClass">
  <a href="#" class="internal-link" title="sometitle">My Link</a>
</div>

My last choise would be to use JQuery - but actually this is'nt a very clean solution so I would prefer a TYPO3/TS solution.

解决方案

After some hours of debugging with Typoscript I finally figured out how to solve this issue. I used a similar technique as shown here http://wiki.typo3.org/External_links

Generelly, I just create a new register containing the class name of the link and then I use the class name to add the wrap to the link.

lib.parseFunc.tags.link {
  typolink.parameter.append = LOAD_REGISTER
  typolink.parameter.append {
    linkClass {
      cObject = TEXT
      cObject {
        stdWrap.data = parameters:allParams
      }
      # Split link params by space-char. 3rd value is the link class name
      split {
        token.char = 32
        cObjNum = 1||2||3
        3 = TEXT
        3.current = 1        
      }
    }
  }
  newWrap.cObject = CASE
  newWrap.cObject {
    key.data = register:linkClass
    # Set outer wrap for links depending on class name
    default = TEXT
    default.value = |
    myClass = TEXT
    myClass.value = <div class="anotherClass">|</div>
    internal-link = TEXT
    internal-link.value = <div class="anotherClassForInternalLink">|</div>
  }
}

lib.parseFunc_RTE.tags.link {
  typolink.parameter.append < lib.parseFunc.tags.link.typolink.parameter.append
  wrap < lib.parseFunc.tags.link.newWrap
}

Looks wired, but works perfectly :-)

这篇关于RTE - 根据条件包装链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！