目录
钥匙要点
如何工作?
>如何自定义Jekyll中的URL结构?允许您通过使用永久链接来自定义URL结构。您可以在帖子的前提中指定自定义的永久链接,该链接将覆盖默认的URL结构。这使您可以创建更具描述性和用户友好的URL,它可以改善您的网站的SEO和用户体验。
>如何将我的jekyll网站部署到第三方平台?第三方部署平台,包括GitHub页面,Netlify等。要部署网站,您需要在本地构建它,然后将生成的静态文件推到所选平台。每个平台都有自己的特定部署流程,因此请务必检查其文档以获取详细说明。
>
首页 科技周边 IT业界 在jekyll中黑客路由组件

在jekyll中黑客路由组件

Feb 20, 2025 am 09:10 AM

Hacking a Routing Component in Jekyll

在jekyll中黑客路由组件

钥匙要点

    Jekyll缺少内置的路由组件,当需要更改URL并且必须手动更新指向旧URL的所有链接时,这可能会出现问题。可以使用Liquid和Markdown创建解决方案,这是托管在GitHub页面上托管的网站的理想选择,无法使用插件和自定义Ruby代码。
  • >
  • >可以在jekyll中创建路由器,通过将URL映射到存储在_DATA文件夹中的YAML文件中的名称(路由)。这允许更改URL,而无需更新所有指向旧URL的链接,因为链接现在是指路由名称而不是URL路径。 为了使路由器更加用户友好,可以从路由器自动化降低链接引用,从而可以将路由用作任何文件中的参考。这是通过创建循环循环所有路线的液体部分来完成的,并为每个路线创建一个降价参考。
  • >该解决方案在Jekyll中提供了功能路由器,但存在一些局限性。它仅在降级中起作用,而不是普通的HTML,并且无法将锚添加到链接中。此外,HTML部分必须包含在所有页面中,这可能很乏味。尽管存在这些缺点,但这种解决方法为Jekyll中缺乏路由组件提供了可行的解决方案。
  • 最初,当用Markdown,Liquid和YAML
  • 托管在GitHub页面上时,我将在Jekyll中删除Jekyll中的路由组件的标题。显然,这有点长,所以我不得不缩短它。无论如何,这一点并没有改变:Jekyll缺少某种路由器,我想我发现一个不太可能的
  • 解决方案。
,但首先是第一件事:我来自Symfony背景,所以

路由器我是指将URL映射到名称的组件 - 又称A.K.A. 路由 - 因此您可以安全地更改URL不必爬行您的代码库即可更新前往已过时位置的所有链接。 为什么我们需要这样的东西?

>我目前正在为Sassdoc V2的文档努力工作(尚未发布,截至撰写本文时尚未发布)。我们有很多内容。超过20页,分别在包含许多代码示例和交叉参考的4个不同部分分开。 在重写期间,我希望更改URL。问题是,当我更改URL时,如果我不希望它们被打破,则必须更新到该URL的所有链接。爬行超过20页,以确保所有URL都还不错,远非理想……

这就是为什么我们需要路由组件的原因。然后,我们将用名称而不是通过其路径来指代URL,从而使我们更改路径,同时保持名称完全有效。

如何工作?

>

>那么,我们需要做什么才能完成这项工作?如果您正在运行Jekyll,但不限于安全模式(不幸的是,使用GitHub页面进行托管),则可以肯定地找到/构建一个Ruby插件来执行此操作。这将是最好的解决方案,因为这通常是服务器端语言处理的内容。

>现在,如果您在GitHub页面上托管您的网站,这比Jekyll更常见,您不能使用插件,也无法使用自定义Ruby代码扩展Jekyll的Core,因此您最终会用可用的内容来入侵一个解决方案:液体和降价。

>主要想法是将一个包含我们所有映射到实际URL的路由的文件。值得庆幸的是,Jekyll允许我们通过存储在_DATA文件夹中的YAML/JSON/CSV文件来定义自定义全局变量,后来通过site.data。data。访问。因此,我们可以以其名称直接在我们的页面中访问这些URL。

>

>要在上面添加一点句法糖,我们将创建允许友好语法的Markdown链接引用 - 但让我们不要太快。

>

创建路由器

路由器的点是示出映射到URL(一对一)的路由(又称

名称)。可以在任何jekyll项目的_data文件夹中创建yaml/json/csv文件,所以让我们一起使用名为doutes.yml的yaml文件:> >您可能已经注意到,我们当然不限于内部链接。我们可以完全定义外部URL的路由,以避免一次又一次地键入它们,如果它们倾向于定期出现。按照相同的行,我们在4个路线上停下来示例,但是路由器可以包含数百条路线。

由于该文件位于_data中,因此我们可以使用site.data。访问其内容。因此,假设我们有一个包含以下代码的页面:
home: "/"
about: "/about-us/"
faq: "/frequently-asked-questions/"
repository: "https://github.com/user/repository"
登录后复制
登录后复制
>

如您所见,我们不再是指URL,而是参考路线。这不是魔术,它只告诉jekyll访问在给定路径上存储的全局变量(例如site.data.routes.faq)。

现在,如果存储库不再在Github上托管,或者“关于我们”页面的URL现在 /关于 /,请不要担心!通过更新路由器,我们可以使其正常工作,而无需回到我们的页面以更新我们的链接。

---
layout: default
title: "About us"
---

<span><!-- Content about us -->
</span>
Go to our [GitHub repository]({{ site.data.routes.repository }}).
Or read the section dedicated to [Frequently Asked Questions]({{ site.data.routes.faq }}).
登录后复制
登录后复制
添加句法糖

在这一点上,我们有一个功能性路由器,允许我们更改任何URL,而无需爬网即可修复损坏的链接。因此,您可以说这已经很酷了。但是,必须键入site.data.routes.faq并不是很方便。我们肯定可以使它更加优雅!

> 是的,是的。首先,我想到建立一个小路由()函数,该功能接受一个密钥名称并返回存储在site.data.routes. 的值。问题是我们正在安全模式下运行Jekyll,因此我们无法使用Ruby Code扩展它。没有运气。

然后,我想到了以前从未使用过的降价功能:链接引用。这就是在Markdown中表示链接的方式:

home: "/"
about: "/about-us/"
faq: "/frequently-asked-questions/"
repository: "https://github.com/user/repository"
登录后复制
登录后复制
>您还可以将链接设置为前往参考的链接 - 顺便说一句,该链接完全看不见,在页面中的任何地方定义了,就像:

---
layout: default
title: "About us"
---

<span><!-- Content about us -->
</span>
Go to our [GitHub repository]({{ site.data.routes.repository }}).
Or read the section dedicated to [Frequently Asked Questions]({{ site.data.routes.faq }}).
登录后复制
登录后复制

注意:使用参考而不是URL时,括号被括号替换为括号。

>这可以使您可以将所有链接定义在同一位置(例如在底部),而不是整个文档。我必须说我没有太多使用此功能,但是在这种情况下,它很方便。

>

>这个想法是从我们的路由器中自动化链接引用,以便我们可以将路由用作任何文件中的参考。事实证明,在液体中进行此操作非常容易:

[I am a link](http://link.url/)
登录后复制
>通过将其添加到页面中的任何位置,这将指示Jekyll作为液体代码处理,然后将其作为Markdown参考进行处理。因此,例如,回到我们以前的示例,我们可以做:

>

[I am a link][id_reference]

​[id_reference]: http://link.url
登录后复制
现在我们在说话,对吗?唯一的问题是必须在任何页面中包括此循环。首先,我想到将其添加到布局中,因此它会使用相关布局自动添加到任何页面。问题在于,布局在jekyll中没有作为降级处理,因此参考文献实际上在DOM的底部可见。更糟糕的是,它们在我们的页面中不可用,因为它们没有被作为Markdown处理……太糟糕了。

> 但是,我们仍然可以做一些使它变得更好的事情。我们可以将此循环放在液体部分中,并将部分包含在每个页面中,而不是复制循环。说我们在_的文件夹中创建一个路由。

>然后在我们的页面中:

# _includes/route.html
{% for route in site.data.routes %}
[{{ route[0] }}]: {{ route[1] }}
{% endfor %}
登录后复制

>

注意:您可以在页面中的任何位置都包含部分。您可以将其完全放在文件的最后一行中。
---
layout: default
title: "About us"
---

<span><!-- Content about us -->
</span>
Go to our [GitHub repository][repository].
Or read the section dedicated to [Frequently Asked Questions][faq].

{% for route in site.data.routes %}
[{{ route[0] }}]: {{ route[1] }}
{% endfor %}
登录后复制
最终想法

就是这样,我们已经在Jekyll Safe-Mode中砍了一些路由组件。现在这有什么缺点?有一些次要的:

>它可以在Markdown中工作;如果您碰巧在平原HTML中具有一个链接,则必须返回到{{site.data.Routes。}}}},这还不错,因为它仍然可以使链接免受URL更新的安全。

>

>您不能在链接中添加锚点;如果需要

>您必须在所有页面中包括HTML部分,这可能很乏味(即使您认为这是YAML前部问题的扩展,您还是必须写的)。
    除了那些缺点之外,这一切都很好。你怎么看?
  • >常见问题(常见问题解答)有关在jekyll中攻击路由组件的问题(常见问题解答) Jekyll中路由组件的重要性是什么?它负责将每个页面映射到特定的URL,这对于站点导航和SEO至关重要。通过黑客入侵路由组件,您可以自定义网站的URL结构以满足您的特定需求,改善用户体验和搜索引擎可见性。

    >如何自定义Jekyll中的URL结构?允许您通过使用永久链接来自定义URL结构。您可以在帖子的前提中指定自定义的永久链接,该链接将覆盖默认的URL结构。这使您可以创建更具描述性和用户友好的URL,它可以改善您的网站的SEO和用户体验。

    >

    >在我的网站上使用jekyll有什么好处? ,博客意识,静态网站生成器,非常适合个人,项目或组织网站。它非常灵活,并支持自定义的URL结构,主题,插件等。另外,由于它会生成静态站点,因此与传统的CMS平台相比,它非常快速,安全。

    >如何将我的jekyll网站部署到第三方平台?第三方部署平台,包括GitHub页面,Netlify等。要部署网站,您需要在本地构建它,然后将生成的静态文件推到所选平台。每个平台都有自己的特定部署流程,因此请务必检查其文档以获取详细说明。

    >使用Jekyll构建的网站的一些示例? ,从个人博客到大型组织网站。一些示例包括官方的Jekyll网站,GitHub页面等等。您可以在官方的Jekyll网站上找到Jekyll网站的展示。

    >我如何使用CloudFlare部署我的Jekyll网站?

    cloudflare页面是jamstack的平台,是jamstack的平台网站。它与Jekyll高度兼容,并提供了一个简单的简化部署过程。您可以将github存储库连接到CloudFlare页面,只要您推到存储库,它将自动构建和部署您的网站。

    有哪些有关jekyll的更多资源? Jekyll网站是了解有关Jekyll的更多资源。它提供了全面的文档,教程和Jekyll网站的展示。此外,还有许多可用的社区资源,包括论坛,博客和GitHub存储库。

    >如何将插件添加到我的jekyll网站?

    > jekyll支持各种插件,这些插件可以为您的网站添加新功能和功能。要添加插件,您需要安装它,然后将其添加到网站的_config.yml文件中。某些插件也可能需要其他配置,因此请确保检查插件的文档以获取详细说明。

    >我可以将jekyll与其他编程语言一起使用吗?

    jekyll是使用Ruby构建的,但它可以通过使用插件和集成与其他编程语言一起使用。例如,您可以将jekyll与JavaScript一起使用为您的站点添加动态功能,或者使用SASS(例如Sass)等CSS预处理程序来简化您的样式过程。

    >

    >如何优化SEO的Jekyll网站? > Jekyll提供了几个功能,可以帮助您优化SEO网站。这包括自定义URL结构,对元标签的支持以及生成XML站点地图的能力。此外,由于Jekyll会生成静态站点,因此它可以非常快,可以改善您网站的搜索引擎排名。

    >

以上是在jekyll中黑客路由组件的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

<🎜>:泡泡胶模拟器无穷大 - 如何获取和使用皇家钥匙
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系统,解释
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆树的耳语 - 如何解锁抓钩
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
<🎜>掩盖:探险33-如何获得完美的色度催化剂
2 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1677
14
CakePHP 教程
1430
52
Laravel 教程
1333
25
PHP教程
1278
29
C# 教程
1257
24
使用AWS ECS和LAMBDA的无服务器图像处理管道 使用AWS ECS和LAMBDA的无服务器图像处理管道 Apr 18, 2025 am 08:28 AM

该教程通过使用AWS服务来指导您通过构建无服务器图像处理管道。 我们将创建一个部署在ECS Fargate群集上的next.js前端,与API网关,Lambda函数,S3桶和DynamoDB进行交互。 Th

21个开发人员新闻通讯将在2025年订阅 21个开发人员新闻通讯将在2025年订阅 Apr 24, 2025 am 08:28 AM

与这些顶级开发人员新闻通讯有关最新技术趋势的了解! 这个精选的清单为每个人提供了一些东西,从AI爱好者到经验丰富的后端和前端开发人员。 选择您的收藏夹并节省时间搜索REL

CNCF触发了ARM64和X86的平台平等突破 CNCF触发了ARM64和X86的平台平等突破 May 11, 2025 am 08:27 AM

Arm64 架构开源软件的 CI/CD 难题与解决方案 在 Arm64 架构上部署开源软件需要一个强大的 CI/CD 环境。然而,Arm64 和传统 x86 处理器架构的支持水平之间存在差异,Arm64 通常处于劣势。面向多种架构的基础设施组件开发人员对工作环境有一定的期望: 一致性:跨平台使用的工具和方法保持一致,避免因采用不太流行的平台而需要改变开发流程。 性能:平台和支持机制具有良好的性能,确保在支持多个平台时部署方案不会因速度不足而受影响。 测试覆盖率:对所有平台同时进行效率、合规性和

定制电信软件的好处 定制电信软件的好处 May 11, 2025 am 08:28 AM

定制电信软件开发无疑是一项相当大的投资。然而,从长远来看,您可能会意识到,这样的项目可能更具成本效益,因为它可以像市场上任何现成的解决方案一样提高您的生产力。了解构建定制电信系统的最重要优势。 获取您所需的确切功能 您可以购买的现成电信软件有两个潜在问题。有些缺乏可能显着改善您工作效率的有用功能。有时您可以通过一些外部集成来增强它们,但这并不总是足以使它们变得出色。 其他软件功能过多,使用起来过于复杂。您可能不会使用其中的一些(永远不会!)。大量的功能通常还会增加价格。 基于您的需求

为什么您的自动化需要AI决策(以及Wordware如何提供) 为什么您的自动化需要AI决策(以及Wordware如何提供) May 15, 2025 am 10:47 AM

我们都体验过传统自动化平台如Zapier和IFTTT的神奇之处。它们擅长连接应用程序并自动化简单的“如果这样,则那样”序列:新表单提交创建电子表格行,传入邮件触发Slack警报。简单、有效,且对于基本任务来说是巨大的时间节省者。但是,你的实际工作流程有多么简单?一旦你的工作流程需要理解细微的上下文、优雅地处理错误或处理非结构化数据,这些工具往往会遇到障碍。它们的简单性使其易于使用,但也成为一种限制。当简单规则不够用时:考虑一下客户支持。票务系统涌入非结构化数据——聊天片段、屏幕截图、复杂的用户描

See all articles