英语(美国)
  1. 亚博Zendesk帮助
  2. 指南
  3. 帮助中心使用指南
  4. 使用主题和自定义帮助中心

帮助中心JavaScript烹饪书

查尔斯Nadeau
  • 编辑
亚博Zendesk文档团队

我的计划是什么?

套件成长，专业，企业和企业Plus专业企业计划

您可以使用JavaScript和jQuery轻松地定制帮助中心的外观。这本食谱旨在帮助你使你的帮助中心看起来像你想要的那样。

默认情况下不提供jQuery。如果您想在主题中使用jQuery语句来代替普通的JavaScript，请确保导入了jQuery库。看到导入或升级jQuery了解更多信息。

注意:试用版用户将获得专业版计划，其中包括代码编辑选项，但如果他们购买团队版计划，则无法再访问该功能。
要访问和编辑帮助中心中的JavaScript，请参见自定义CSS或JavaScript．

您也可以使用帮助中心模板语言或CSS自定义帮助中心:

菜谱列表

随着时间的推移，我们会添加更多的食谱，但我们永远不可能做到面面俱到。您可以用JavaScript做的事情的数量只受限于您的想象力。请在评论区发布你的食谱，我们会把它们添加到这本食谱中。

更改“我的活动”链接文本

将my activities类添加到header中。哈佛商学院的模板:

{{link "my_activities" role="menuitem" class= " my-activities "}}

控件中添加以下jQuery语句$(文档)时函数()函数:

$(' .my-activities').html('查看我的请求');

重命名Request表单上的“Subject”和“Description”标签

控件中添加以下jQuery语句$(文档)时函数()函数:

$('标签(= request_subject) ') . html(“自定义主题”);$('标签(= request_description) ') . html(“自定义描述”);

预填充自定义票证表单的字段

注意:只有某些计划支持多种票务形式。有关列表以及票证表单如何工作的一般信息，请参见创建票证表单以支持多种请求类型．

假设您在帮助中心使用自定义票证表单让用户注册产品。当用户在帮助中心打开表单时，您可以检测表单并预填充其字段。

您需要ticket表单ID，您可以在帮助中心的表单URL中找到它。看到这个例子．

下面的jQuery示例用“Product registration”预填充Subject字段，用“This is a new Product registration”预填充Description字段。将语句添加到$(文档)时函数()函数:

var ticketForm = location.search.split('ticket_form_id=')[1];如果(ticketForm == 18570) {$('section ')主列h1').html('产品注册');$ (" # request_subject”)。瓦尔(“产品注册”);$ (" # request_description”)。val('有一个新产品注册');$ (' # request_subject ') .parent (.request_subject) hide ();//隐藏主题$('#request_description').parent('.request_description').hide();$("
请在此上传您的产品收据。
"). insertafter ('label:contains("Attachments")'); // Adds text below "Attachments" }

更改Request表单上自定义字段的顺序

您需要自定义字段的id，可以在Zendesk Support界面中找到。亚博看到这个例子．

var firstName = $('input#request_custom_fields_22231170').parent();var lastName = $('input#request_custom_fields_22231180').parent();输入# request_subject firstName.insertBefore ($ (' ') .parent ());输入# request_subject lastName.insertBefore ($ (' ') .parent ());

向Request表单添加标题

控件中添加以下jQuery语句$(文档)时函数()函数:

$ (' .form-field.request_anonymous_requester_email ')。preend ('
您的个人信息
') $('.form-field.request_subject')。预谋(“< h2 >你的问题< / h2 >”);$ (' .form-field.request_custom_fields_21875914 ')。preend ('
您的设备信息
');$ (' .form-field.request_custom_fields_22033620 ')。preend ('
您的购买信息
');$('。form-field > label:contains("Attachments")')。预先考虑(“< h2 >支持附件< / h2 >);

在“语言”下拉菜单中隐藏语言

如果使用该语言的内容尚未准备好发布，那么在语言选择器中隐藏该语言可能很有用。控件中添加以下jQuery语句$(文档)时函数()函数:

$ (" ul。dropdown-panel:contains(' franais ')").hide();

用标志图标替换语言选择器中的文本字符串

例如，如果您的帮助中心提供美国英语和德语的内容，您可以在语言选择器中显示国旗，而不是“美国英语”和“德语”。控件中添加以下jQuery语句$(文档)时函数()函数:

$((){$('一个函数。dropdown-toggle:contains("English (US)")').html('');$(' .dropdown-toggle:contains("Deutsch")').html('');$('a:contains("English (US)")').html('');$('a:contains("Deutsch")').html('');}）;

根据所选语言隐藏社区

控件中添加以下jQuery语句$(文档)时函数()函数:

如果(document.location.pathname。匹配((/ hc \ /德/)| | (/ hc \ / es /) )) { $('. 社区”)hide ();}
    回到顶端

    20的评论

    • 尼克公司

      是否有可能自动填充一个字段，是一个下拉菜单字段?还是只适用于文本输入字段?我可以成功地隐藏各种表单上的字段，并自动填充主题和描述等文本字段，但我还没有成功地使用下拉菜单。

      谢谢!

      0
    • Cheeny波斯历八月
      亚博Zendesk客户服务
      嗨,肖恩,

      您是否正在尝试自动填写票务表单上的下拉字段?如果是，则创建预先填写的票务表格会帮助你
      0
    • 亚当

      你好,

      我在帮助中心寻求关于票务表的帮助。我们目前在自定义字段的描述中有一个URL。这允许我们的客户在填写表单时引用该页上的信息。

      我们发现的问题是，当客户点击链接时，它会在与帮助中心相同的窗口中打开URL。

      有人知道如何通过Javascript捕获这个并强制链接打开到用户浏览器中的新选项卡吗?

      0
    • 小布埃纳维斯塔DJ
      亚博Zendesk客户服务
      你好亚当,

      关于您所关心的问题，下面的脚本涉及自定义编码。我建议在网上搜索解决方案，但我在网上找到了一些。

      你可以从StackOverflow查看一个例子，在这里．另一个可供参考在这里。

      谢谢大家，祝你们度过美好的一天!


      亲切的问候,
      0
    • 亚当

      嘿@……

      谢谢你的推荐。

      我和我们的一个Javascript工程师一起找到了另一个解决方案，并按预期工作。我当然会把你分享的选项放在我的口袋里，如果我用的那个有任何问题的话。

      const links = document.querySelectorAll("a");
      For (const link of links) {
      链接。addEventListener('click'， function (e) {
      如果(e。target。href== 'http://google.com') {
      e.preventDefault ();
      window.open(链接。href，'_newtab' + Date.now());
      }
      }）;
      }
      0
    • 小布埃纳维斯塔DJ
      亚博Zendesk客户服务
      你好亚当,

      听说你们找到了合适的解决办法，我很高兴。如果您需要进一步的帮助或问题，请随时联系我们。

      祝你度过美好的一天!



      亲切的问候,
      0
    • T5管理
      • 编辑

      嘿,

      我试图使自定义日期字段不能选择过去的日期。这可能吗?

      0
    • Tipene休斯
      亚博Zendesk开发者倡导

      嘿T5管理，

      你会介意通过您的自定义日期字段是如何运作的一个片段发送，我可以把一个基于您的代码工作的例子。

      谢谢!

      Tipene

      0
    • T5管理

      嘿Tipene休斯

      日期字段只是用户可以编辑的自定义日期字段。

      0
    • Tipene休斯
      • 编辑
      亚博Zendesk开发者倡导

      嗨T5管理，

      谢谢你为我澄清这一点!

      不幸的是，无法修改内置自定义字段日期选择器的行为。我可以肯定地看到这样一个功能的用例，所以我鼓励你在功能要求社区页面。这将使我们的产品团队有更大的可见度，也给其他人提供了投票的机会，并为这样的功能提供了额外的用例。你可以找到我们关于创建功能请求的指导方针，在这里．

      祝你今天愉快!

      Tipene

      0
    • 尼克公司

      我成功地使用script.js文件在票务表单中自动填充了一个自定义字段。我的方法是:
      if(ticketForm == 7386956538260) {
      $ (' .form-field.request_subject ') hide ();//隐藏主题
      / / / /自动字段
      $ (" # request_subject”)。val('机构/应用程序SPOC更改请求');
      $ (' # request_custom_fields_21608582 ') .亚博val(“zendesk_assistance”);
      $ (' # request_custom_fields_21626618 ') .val (' User_Management_incl_Permissions_ID_Req_ / _Passwd_Reset_etc ');
      $ (' # request_custom_fileds_21617267 ') .亚博val(“Zendesk_Support_Portal”);
      }

      我的主题(一个标准字段)和字段21608582(一个自定义字段)自动填充成功。另外两个字段不是自动填充的。

      了解吗?

      肖恩。

      0
    • 格雷格Katechis
      亚博Zendesk开发者倡导

      嗨,肖恩!我的第一个想法是，最后两个选项是下拉或多选择字段，它们要求您传递值的标记，而不是字段名称。语法略有不同，因为这是JSON而不是JQuery，但是一般信息可以从这篇文章．

      如果这不能解决你的问题，你能告诉我们如果你看到任何控制台错误，可以说明这个问题吗?

      0
    • 李尔赫尔曼

      是否可以在javascript文件中使用动态内容?我试图本地化联系我们按钮文本:

      $('。request-callout”)。文本(“联系我们”).attr(“href”、“/ hc /请求/新”);

      我有动态内容{{dc.kc-footer-contact-button}}。

      我知道如何将这些添加到.hbs文件中，并在许多地方使用它们。然而，我不确定如何，或者如果，它可以在javascript中使用。

      0
    • 尼克年代

      嗨，团队，Zendesk支持亚博主题字段中的自定义票证占位符吗?

      $ (" # request_subject”)。信用请求-代理名称:{{票。CID ticket_field_ID}}: {{ticket.ticket_field_ID}}”);
      $ (' .request_subject ') hide ();

      上面的代码成功地隐藏了主题，但不幸的是，自定义字段数据并没有传递到主题，而是像在代码中一样显示出来。

      0
    • 萨利姆Cheurfi
      亚博Zendesk客户服务
      嗨,尼克,

      票据占位符不会在自定义请求表单中呈现，它将按原样显示。票据占位符用于自动化、宏、目标、触发器和小部件中，作为动态生成票据和用户数据的容器。

      我希望这能帮到你，

      最好的
      0
    • Raphaël pembroguet -军官
      • 编辑

      嗨，有没有人有解决方案，轻松地把一个字段并排到另一个(保存和避免滚动)请

      最好的问候!

      0
    • Raphaël pembroguet -军官
      • 编辑

      我已经找到了我之前问题的解决方案(感谢一位慷慨的贡献者)，并把它放在了一篇特别的文章中在这里

      我现在还有一个问题

      在这里:

      你展示了如何预填充，你能展示一下当用户点击字段时，如何放文本淡出吗?(像一个建议)这里有一个例子:https://developer.mozilla.org/en-US/docs/Web/CSS/::placeholder

      非常感谢

      0
    • Gorka Cardona-Lauridsen
      • 编辑
      亚博Zendesk产品经理

      你好,

      我们正在进行研究，以改善我们的帮助中心开发人员的体验，并希望与你们中的任何一个试图编辑帮助中心主题代码的人交谈。

      如果你感兴趣，请回答在这里注册回答3个调查问题。我会联系你安排一个30分钟的视频通话。

      面试将是一个半结构化的面试，我们希望听到你向我们展示你已经做过或尝试过的定制的例子，以及你对你使用的工具、文档等的经验。

      期待与你们所有人交谈。

      Gorka Cardona-Lauridsen
      Zendesk Guide高级产品经理亚博

      0
    • Asafe Souza Ramos

      如何从script.js主题访问代理电子邮件?我找到了帮助中心，但有一个弃用/遗留通知，所以不能保证。还有别的办法吗?

      let agentEmail = HelpCenter.user.email;
      1
    • 雷米Saumet
      亚博Zendesk客户服务

      美好的一天Asafe Souza Ramos，

      谢谢你的帖子，希望你一切都好!

      要回答这个问题，当前最好的选择仍然是使用HelpCenter本机方法及其相关节点/属性，例如:

      HelpCenter.user.email

      我们确实建议不要依赖它来设定正确的期望，但我不知道这个功能会很快被删除。

      目前，这是要走的路，否则，通过一些DOM操作，您可以调用(via)getElementById ()例如)到

      className > "dropdown-menu"的第一个子节点(见attachmment)。


      ，其中包含当前登录用户的IDhref，您可以从最后一个URL段提取此ID(将其保存为变量)并创建后续对该用户配置文件的API GET调用使用ID，它将响应用户的电子邮件(以及其他“属性”)。

      • GET / api / v2 /用户/ {user_id}

      例如:

      这是另一个值得探索的选项。

      希望这对你有帮助!祝你今天过得愉快!

      最好的问候,

      0

    请登录留下评论。

    由Zendesk提供支亚博持