Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >静态站点生成器:makesite.py

静态站点生成器:makesite.py

作者头像
IT派
发布于 2018-07-30 06:47:32
发布于 2018-07-30 06:47:32
2.3K0
举报
文章被收录于专栏:IT派IT派

通过在Python中编写自己的简单、轻量级、无魔法的静态站点生成器,完全控制静态网站/博客生成。对的!重新发明轮子,伙计们!

目录

  • 简介
  • 但是为什么呢?
  • 开始
  • 代码
  • 布局
  • 内容
  • 信用
  • 许可证
  • 支持

简介

这个库包含一个含两个静态博客和几个静态页面的网站例子的源代码。网站通过运行makesite.py生成。结果像这个例子(https://tmug.github.io/makesite-demo)。就这样!

因此,请继续,创建此库的分支,替换成自己的内容,并生成静态网站。 就这么简单!

您可以自由地为博客或网站复制,使用和修改此项目,因此请继续并分发此库并将其作为自己的项目。 如果愿意,可以更改布局,根据自己的想法改进样式表,如果需要可以增强makesite.py,并按照需要开发网站/博客。

但是为什么?

为了娱乐和利润! 好吧,也许不是为了赢利,而是希望有趣。

你有没有使用像Jekyll这样流行的静态网站生成器来生成你的博客? 我也有过。 它很简单,很棒。 但是,您是否渴望使用更简单的方式来生成您的博客? 你喜欢Python吗? 也许你也萌生过编写自己的静态网站生成器的想法,但你认为要付出相当大的工作量? 如果你对这些问题的回答“是”,那么这个项目就是为你准备的。

通过makesite.py,你可以完全控制。 没有隐藏的魔法! 无需阅读任何文档即可了解其工作原理。 没有必要学习如何编写配置文件来产生一些预期的效果。

通过makesite.py:

  • 代码即是文档。
  • 代码即是配置。

一切都按照简单易懂的Python代码进行布置,供您阅读和增强。 它少于120行代码(不包括注释,文档字符串和空白行)。 它让你快速开始。 你只需要执行makesite.py。

您可以在几分钟内开发一个体面的网站/博客,然后您可以开始修改源代码,布局和样式表,以自定义您的网站的外观和感觉,从而达到满意的效果。

开始

本节提供了一些快速步骤,让您尽快开始。

要在本地系统上进行快速演示,只需输入以下命令:

如果你没有make,但有Python 3.x,输入这个命令:

注意:在某些环境中,您可能需要使用python而不是python3来调用Python 3.x.

如果您只有Python 2.7,请输入以下命令:

然后访问http//localhost:8000/。 它应该看起来像这样。

注意:您可以使用Python 2.7或Python 3.x运行makesite.py。

您可能会在前一个命令的输出中看到一些Markdown的警告消息无法渲染。 这是由于这个项目中的一个示例博客有一些用Markdown编写的帖子。 要正确渲染它们,请使用以下命令安装commonmark软件包:

然后再次尝试上一步。

对于一个面向互联网的网站,您将静态网站/博客放在某个托管服务和/或Web服务器,如Apache HTTP服务器,Nginx等。您可能只需要生成静态文件,并知道这些静态文件在哪里,并将它们移动到您的托管位置。

如果您有make命令,请输入以下命令以生成您的网站:

如果你没有make但是有python3,输入这个命令:

注意:在某些环境中,您可能需要使用python而不是python3来调用Python 3.x.

如果你只有python,输入这个命令:

_site目录包含整个生成的网站。 该目录的内容可以被复制到您的网站托管位置。

代码

现在您已经知道如何生成此项目附带的静态网站,现在该查看makesite.py的功能了。 您可能并不需要阅读整个部分。 源代码非常明了,但以防万一,您需要详细了解它的功能,下面是详细信息:

  1. main()函数是网站生成的起点。 它调用了完成网站生成所需的其他功能。
  2. 首先它从头开始创建一个全新的_site目录。 静态目录中的所有文件都将复制到此目录中。 稍后将生成静态网站并写入此目录。
  3. 然后它创建一个带有一些默认参数的params字典。这个字典被传递给其他功能。其他函数将从此字典中选择值以填充布局模板文件中的占位符。 例如,让我们以副标题参数为例。它被设置为我们的示例网站的虚拟品牌名称:“Lorem Ipsum”。我们希望每个页面在标题中包含此品牌名称作为后缀。例如,关于页面的标题中有“About - Lorem Ipsum”。现在查看用作静态网站中所有页面布局的页面布局模板。此布局文件使用{{subtitle}}语法表示它是一个占位符,应该在呈现模板时填充该占位符。 另一个值得注意的事情是,内容文件可以通过在内容标题中定义自己的参数来覆盖这些参数。例如,查看主页的内容文件。在其内容标题中,即具有键值对的顶部的HTML注释中,它定义了一个名为title的新参数并且覆盖了副标题参数。 稍后我们将讨论占位符和内容标题的语法。这很简单。
  4. 然后加载所有布局模板。 这个项目中有6个。 layout/page.html:它包含适用于所有页面的基本模板。 它以和开头,并以结尾。 此模板中的{{content}}占位符将替换为页面的实际内容。 例如,对于关于页面,将{{content}}占位符替换为content/about.html中的全部内容。 这是通过在代码中进一步调用make_pages()完成的。 layout/post.html:它包含博客文章的模板。 请注意,它不以开头,也不包含和标签。 这不是一个完整的独立模板。 该模板仅定义博客帖子特定的一小部分博客帖子页面。 它包含HTML代码和占位符,用于显示博客文章的标题,发布日期和作者。 此模板必须与页面布局模板组合才能创建最终的独立模板。 为此,我们用页面布局模板中的HTML代码替换页面布局模板中的{{content}}占位符以获取最终的独立模板。 这是通过在代码中进一步调用render()来完成的。 生成的独立模板仍然包含帖子布局模板中的{{content}}占位符。 然后将此{{content}}占位符替换为博客文章中的实际内容。 layout/list.html:它包含博客列表页面的模板,该页面按反向时间顺序列出博客中的所有帖子。 除了在顶部提供一个标题和在底部提供一个RSS链接之外,这个模板并没有太多的作用。 {{content}}占位符以反向时间顺序填充博客帖子列表。 就像帖子版面模板一样,该模板必须与页面布局模板结合才能到达最终的独立模板。 layout/item.html:它包含博客列表页面中每个博客文章项目的模板。 make_list()函数使用此模板呈现每个博客文章项目,并将它们插入到列表布局模板中以创建博客列表页面。 layout/feed.xml:它包含RSS源的XML模板。 {{content}}占位符填充了订阅项目列表。 layout/item.xml:它包含每个要收入到RSS源中的博客文章项目的XML模板。 make_list()函数使用此模板呈现每个博客文章项目,并将它们插入到layout/feed.xml模板中以创建完整的RSS源。
  5. 加载完所有布局模板后,它会调用render()以将帖子布局模板与页面布局模板组合起来,以形成最终的独立帖子模板。 同样,它将列表布局模板模板与页面布局模板组合在一起以形成最终列表模板。
  6. 然后它会两次调用make_pages()来呈现主页和其他几个网站页面:联系页面和关于页面。
  7. 然后,它再两次调用make_pages()来呈现两个博客:一个名为blog,另一个名为news。 请注意,make_pages()调用接受三个位置参数: 作为glob模式提供的内容源文件的路径。 将路径模板输出为字符串。 布局模板代码作为一个字符串。

这三个位置参数之后是关键字参数。 这些关键字参数用作输出路径模板和布局模板中的模板参数,以便用占位符的相应值替换占位符。

如上面第2点所述,内容文件可以在其内容头中覆盖这些参数。

  1. 然后,它会两次调用make_list()来呈现两个博客的博客列表页面。 这些调用与make_pages()调用非常相似。 make_list()调用只有两点不同: 再次阅读由make_pages()读取的相同博客帖子是没有意义的,因此我们不会将路径传递给内容源文件,而是将make_pages()返回的博客帖子按时间顺序排序的反向排序索引提供给make_list()。 还有一个额外的参数可以将项目布局模板作为字符串传递。
  2. 最后,它再两次调用make_list()来为这两个博客生成RSS源。 除了我们在这里使用源XML模板来生成RSS源之外,这些调用与以前的调用没有什么不同。 快速回顾一下,我们创建一个_site目录来编写生成的静态网站,定义一些默认参数,加载所有布局模板,然后调用make_pages()来渲染带有这些模板的页面和博客帖子,调用make_list()来呈现博客列表页面和RSS源。 就这样! 看看make_pages()和make_list()函数是如何实现的。 它们非常简单,每个函数代码少于20行。 一旦你熟悉这段代码,你可以开始修改它来添加更多的博客或减少它们。 例如,您可能不需要新闻博客,因此您可以删除“新闻”的make_pages()和make_list()调用及其content/news处的内容。

布局

在这个项目中,布局模板文件位于布局目录中。 但他们不一定要在那里。 您可以将布局文件放在任何地方并相应地更新makesite.py。

本项目附带的makesite.py的源代码理解布局模板中占位符的概念。 模板占位符具有以下语法:

围绕的{{之前,}}之后的任何空白都会被忽略。应该是一个有效的Python标识符。 以下是模板占位符的示例:

这是在makesite.py中已经实现的一个非常简单的模板机制。 对于简单的网站或博客,这应该足够了。 如果您需要更复杂的模板引擎(如Jinja2或Cheetah),则需要修改makesite.py以添加对它的支持。

内容

在这个项目中,内容文件位于内容目录中。 大多数内容文件都是用HTML编写的。 但是,博客博客的内容文件是用Markdown编写的。

makesite.py支持内容文件中标题的概念。 每个内容文件可以以包含标题的一个或多个连续HTML注释开始。 每个头文件都有以下语法:

在标记之前,之后和周围的任何空白都将被忽略。 以下是一些示例标题:

它会在每个内容文件的顶部查找标题。 只要遇到一些非标题文本,就不会检查该标题的其余内容。

答谢

致谢:

Susam的文档和单元测试

Keith Gaughan改进了模板的单次渲染。

许可

这是免费的开源软件。 根据MIT许可证的条款,您可以使用,复制,修改,合并,发布,分发,再许可和/或出售其副本。

本软件按“原样”提供,不附有任何明示或暗示的担保。 详细信息请参见MIT许可证。

支持

要报告错误,提出改进建议或提出问题,请访问https://github.com/sunainapai/makesite/issues。

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2018-05-18,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 IT派 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
【译】用Go实现一个静态博客生成器
静态站点生成器是一种工具,给一些输入(例如,markdown),使用HTML,CSS和JavaScript生成完全静态的网站。 为什么这很酷?一般来说,搭建一个静态网站更容易,而且通常运行也会比较快一些,同时占用资源也更少。虽然静态网站不是所有场景的最佳选择,但是对于大多数非交互型网站(如博客)来说,它们是非常好的。 在这篇文章中,我将讲述我用Go写的静态博客生成器。 动机 您可能熟悉静态站点生成器,比如伟大的Hugo,它具有关于静态站点生成的所有功能。 那么为什么我还要来编写另外一个功能较少的类似工具呢?
李海彬
2018/03/27
2K0
静态网站生成器推荐:构建高性能网站的利器
这些开源项目都是优秀的静态网页构建工具,适合各种需求和技术栈。它们提供了简单易上手、可定制化、多语言支持等关键功能,并且具有快速构建、自动优化前端性能、SEO 友好等特点。无论您是个人博客还是企业门户,使用这些工具来构建静态网站都会带来高效且愉悦的经历。
小柒
2023/08/10
9200
静态网站生成器推荐:构建高性能网站的利器
Nue:一个挑战Next.js的新静态站点生成器
Nue 加入 Web 开发战场,推出一个针对渐进增强优化的 Markdown 框架。我们为前端开发者测试了它。
云云众生s
2024/11/25
2560
Nue:一个挑战Next.js的新静态站点生成器
尤小右:VitePress 初步实现小目标,极简静态站点生成器
VitePress:Vite & Vue 驱动的静态网站生成器 https://github.com/vuejs/vitepress
前端开发博客
2020/11/04
3.3K0
尤小右:VitePress 初步实现小目标,极简静态站点生成器
一个现代静态网站生成器Eleventy
我们展示了Eleventy如何提供一种流畅的Web开发过程,与现有技术协同工作,同时引导您采用良好的实践。
云云众生s
2024/03/28
2110
一个现代静态网站生成器Eleventy
如何利用机器学习和Gatsby.js创建假新闻网站​
我们生活在一个真理不再是非黑即白的世界。在我们生活的世界里,媒体明白,影响人们的最佳方式不是通过逻辑,而是通过情感。他们明白我们人类不是通过有意识的思考和逻辑处理来做决定,而是通过隐藏在我们心灵中的无意识倾向来做决定。对通过媒体赚钱的人来说是好事,对像我们这样消费媒体的人来说是坏事。
deephub
2020/07/29
4.8K0
如何利用机器学习和Gatsby.js创建假新闻网站​
ASP.NET MVC学习笔记03视图
早在ASP.NET MVC 3就引入了Razor视图引擎( Razor view engine)。Razor视图模板文件使用.cshtml文件扩展名,并提供了一个优 雅的方式来使用C#语言创建所要输出的HTML。用Razor编写一个视图模板文件时,将 所需的字符和键盘敲击数量降到了最低,并实现了快速,流畅的编码工作流程。 ---- 控制器返回指定视图 当前在控制器类中的Index方法返回了一个硬编码的字符串。更改HelloController方法返回一个 View对象,如下面的示例代码: 1 2 3 4
李郑
2018/03/01
2.3K0
ASP.NET MVC学习笔记03视图
5个最佳拖放式WordPress网页生成器比较(2018)
你想要一个简单的方法来建立和定制你的WordPress网站?这就是拖放WordPress网页生成器插件派上用场的地方。这些WordPress网页生成器允许您在不编写任何代码的情况下创建、编辑和自定义您的网站布局。在本文中,我们将比较和回顾5个最好的WordPress拖放网页构建器。
全栈程序员站长
2022/08/26
2.5K0
5个最佳拖放式WordPress网页生成器比较(2018)
Django学习
Django的基本命令 startproject  创建一个Django项目    django-admin startproject 项目名 startapp      创建一个Django应用    python manage.py startapp 应用名(blog) check         校验项目完整性 runserver     本地建议运行Django项目  python manage.py runserver shell         进入Django项目的python shell环境 test          执行Django用例测试 与数据库相关的命令 makemigrations  创建模型变更的迁移文件   python manage.py makemigrations migrate         执行上一个命令创建的迁移文件  python manage.py migrate dumpdate        把数据库数据导出到文件     loaddate        把文件数据导入到数据库
用户10443079
2023/03/21
7710
Django学习
『Django』模板
上一篇文章介绍了 Django 视图的基础用法,当时提到了“响应HTML模版”,用到的方式是渲染一段 HTML 内容的字符串,这种方式很不方便。更方便的方法是在 .html 文件里写页面内容,然后渲染这个 .html 文件。这个 .html 文件也叫 HTML 模版,就是本文要讲解的内容。
德育处主任
2024/05/21
3850
『Django』模板
Django实践-02创建应用
官网:https://www.djangoproject.com/ 博客:https://www.liujiangblog.com/ git:https://gitcode.net/mirrors/jackfrued/Python-100-Days
IT从业者张某某
2023/10/16
2420
Django实践-02创建应用
ASP.NET MVC 5 - 视图
在本节中,你要去修改HelloWorldController类,使用视图模板文件,在干净利索地封装的过程中:客户端浏览器生成HTML。 您将创建一个视图模板文件,其中使用了ASP.NET MVC 3所引入的Razor视图引擎(Razor view engine)。Razor视图模板文件使用.cshtml文件扩展名,并提供了一个优雅的方式来使用C#语言创建所要输出的HTML。用Razor编写一个视图模板文件时,将所需的字符和键盘敲击数量降到了最低,并实现了快速,流畅的编码工作流程。 当前在控制器类中的Inde
葡萄城控件
2018/01/10
3.7K0
ASP.NET MVC 5 - 视图
【腾讯云 Cloud Studio 实战训练营】沉浸式体验编写一个博客系统
欢迎参加腾讯云 Cloud Studio 实战训练营!在本次训练营中,我们将通过沉浸式体验,带您一步步编写一个基于 Nuxt.js 的静态博客系统。无论您是初学者还是有一定编程经验的开发者,本训练营都将为您提供一个深入了解和掌握 Nuxt.js 技术以及静态网站开发的机会。
全栈若城
2023/08/15
5270
Islands Architecture 孤岛(岛屿)架构
原文:https://www.patterns.dev/vanilla/islands-architecture
泯泷、
2024/03/16
3620
Islands Architecture 孤岛(岛屿)架构
一个PDF文档生成器.Net库
这是一个PDF文档生成器.Net开源库,提供了一个布局引擎,对分页功能完美的支持。
郑子铭
2023/12/13
2920
一个PDF文档生成器.Net库
【Web架构】静态站点生成器概述 Gatsby ,Hugo 和Jekyll对比
在本文中,您将看到三种最好的静态站点生成器的比较,它们的优点、缺点以及您应该使用它们的原因。
架构师研究会
2021/01/06
3.3K0
【Web架构】静态站点生成器概述 Gatsby ,Hugo 和Jekyll对比
ZendFrameWork组件Layout学习笔记
试图助手可以理解成为控制页面布局,按照这个顺序进行页面的渲染 $this->headLink() 只是生成link标记占位符,例如 <?php echo $this->headLink()->app
苦咖啡
2018/05/07
9000
用 Python 的 Template 类生成文件报告
很多时候,我发现自己需要进行生成报告、输出文件或字符串的任务。它们或多或少都会遵循某种模式,通常这些模式是如此相似,以至于我们希望拥有一个可以重用并直接输入数据的模板。幸运的是,Python提供了一个可以帮助我们的类:string.Template。
Python数据科学
2021/01/28
1.4K0
用 Python 的 Template 类生成文件报告
VitePress 强大的静态网站生成器
VitePress 是一个静态站点生成器 (SSG),专为构建快速、以内容为中心的网站而设计。简而言之,VitePress 获取用 Markdown 编写的源内容,为其应用主题,并生成可以轻松部署在任何地方的静态 HTML 页面。
用户10503220
2023/07/19
1.1K0
VitePress 强大的静态网站生成器
Python 自动化办公-玩转 PPT
如果你有一堆 PPT 要做,他们的格式是一样的,只是填充的内容不一样,那你就可以使用 Python 来减轻你的负担。
somenzz
2021/08/19
2.2K0
相关推荐
【译】用Go实现一个静态博客生成器
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档