天道酬勤,学无止境

Pelican static site generator change fontsize

Dose anyone can give me a hint on how to change the fontsize with CSS for a Pelican Site. I use the pelican-bootstrap3 theme.

I do not want to fork and modify the Theme. I would like to change the size with the custom.css feature.

thanks for the help mathias

评论

Check out the pelican-bootstrap-3 help page on github.

What you can do is make a custom.css file that looks like this:

html {
   font-size:150%
}

The trick is putting your custom.css file in your content folder and telling pelican where it is and then where it should be put in your output. You must also tell the pelican-bootstrap-3 theme where this file is and it will add it to the headers in your rendered output.

First, generally you would make a folder called extras in your content folder and put your custom.css file in there. This is where the path notation on the github page comes in:

extras/custom.css

You must now edit your pelicanconf.py file to tell pelican where this file is located, and also to give this information to pelican-bootstrap-3. Add this to yours:

# tell pelican where your custom.css file is in your content folder
STATIC_PATHS = ['extras/custom.css']

# tell pelican where it should copy that file to in your output folder
EXTRA_PATH_METADATA = {
'extras/custom.css': {'path': 'static/custom.css'}
}

# tell the pelican-bootstrap-3 theme where to find the custom.css file in your output folder
CUSTOM_CSS = 'static/custom.css'

受限制的 HTML

  • 允许的HTML标签:<a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • 自动断行和分段。
  • 网页和电子邮件地址自动转换为链接。

相关推荐
  • Pelican 3.3 pelican-quickstart错误“ ValueError:未知语言环境:UTF-8”(Pelican 3.3 pelican-quickstart error “ValueError: unknown locale: UTF-8”)
    问题 When I was trying to use pelican3.3, I typed the commend "pelican-quickstart", some errors showed up. These are the errors: (PelicanEnv)59-127-113-90:myblog Richo$ pelican-quickstart Traceback (most recent call last): File "/Users/Richo/Dropbox/Github/PelicanEnv/bin/pelican-quickstart", line 9, in <module> load_entry_point('pelican==3.3', 'console_scripts', 'pelican-quickstart')() File "/Users/Richo/Dropbox/Github/PelicanEnv/lib/python2.7/site-packages/pkg_resources.py", line 378, in load_entry_point return get_distribution(dist).load_entry_point(group, name) File "/Users/Richo/Dropbox
  • Pelican 3.3 pelican-quickstart error “ValueError: unknown locale: UTF-8”
    When I was trying to use pelican3.3, I typed the commend "pelican-quickstart", some errors showed up. These are the errors: (PelicanEnv)59-127-113-90:myblog Richo$ pelican-quickstart Traceback (most recent call last): File "/Users/Richo/Dropbox/Github/PelicanEnv/bin/pelican-quickstart", line 9, in <module> load_entry_point('pelican==3.3', 'console_scripts', 'pelican-quickstart')() File "/Users/Richo/Dropbox/Github/PelicanEnv/lib/python2.7/site-packages/pkg_resources.py", line 378, in load_entry_point return get_distribution(dist).load_entry_point(group, name) File "/Users/Richo/Dropbox/Github
  • 使用 pelican-quickstart 时出错“No module named html_parser”(Error using pelican-quickstart “No module named html_parser”)
    问题 我决定尝试一下pelican ,但是当我运行pelican-quickstart ,我得到以下对话框: $ pelican-quickstart Traceback (most recent call last): File "/usr/local/bin/pelican-quickstart", line 9, in <module> load_entry_point('pelican==3.4.0', 'console_scripts', 'pelican-quickstart')() File "/System/Library/Frameworks/Python.framework/Versions/2.7/Extras/lib/python/pkg_resources.py", line 357, in load_entry_point return get_distribution(dist).load_entry_point(group, name) File "/System/Library/Frameworks/Python.framework/Versions/2.7/Extras/lib/python/pkg_resources.py", line 2394, in load_entry_point return ep.load() File "
  • Error using pelican-quickstart “No module named html_parser”
    I decided to give pelican a try, but when I run pelican-quickstart, I get the following dialog: $ pelican-quickstart Traceback (most recent call last): File "/usr/local/bin/pelican-quickstart", line 9, in <module> load_entry_point('pelican==3.4.0', 'console_scripts', 'pelican-quickstart')() File "/System/Library/Frameworks/Python.framework/Versions/2.7/Extras/lib/python/pkg_resources.py", line 357, in load_entry_point return get_distribution(dist).load_entry_point(group, name) File "/System/Library/Frameworks/Python.framework/Versions/2.7/Extras/lib/python/pkg_resources.py", line 2394, in load
  • 静态网站(博客)生成器Static Site Generators(SSGs)大集合
    生成静态网站的工具的大集合 Table of Contents.NETAwkBashC++C#C and PerlClojureCommon LispDDenoDropboxElixirErlangGoGroovyHaskellJavaLanguage AgnosticLuaNimrodNode.jsOCamlPHPPythonRacketRubyRustScalaSchemeShellTcl.NETPretzelWyamAwkzodiacBashbakerbashblogNanoBloggerPagegenSKFC++LeoC SharpGrazeC and PerlBlazeBloggerblosxomBryarDapperExposeHiDikiwikiPaperyQgodaQuietly::ConfidentStaticVoltStatoclesTemplerWebsite Meta LanguageXDOZucchiniClojureCryogenincisemisakiperunStasisStaticCommon LispcoleslawregenerateDDSSGDenoLumePagicssgoDropbox900dpiBlogmarkBraceCalepinChiliCloud CannonDrapacheDropPagesKI***Pancake
  • markdown/pandoc 的全站编译? [关闭](Whole site compilation of markdown/pandoc? [closed])
    问题 关闭。 此问题不符合 Stack Overflow 准则。 它目前不接受答案。 想改善这个问题吗? 更新问题,使其成为 Stack Overflow 的主题。 3年前关闭。 改进这个问题 使用 Sphinx-doc,您可以创建一堆 ReStructureText 文件,其中包含一个目录宏的index.rst文件,该宏从其他包含的文件中自动生成目录,以及一个用作编译的conf.py配置。 然后,您可以将该批次编译为一个 Python 文档样式的站点,并配有索引、导航工具和搜索功能。 有没有类似的降价工具(最好是 pandoc 风格的降价)? 回答1 一些使用 Markdown 的静态站点生成器: Jekyll 非常流行,也是 GitHub 页面背后的引擎。 Python 变体:Hyde 或 Pelican nanoc(在 GitHub API 文档中使用 f.ex) Middlemanapp:也许是最好的一个? 我认为他们都没有使用 pandoc(可能是因为它是用 Haskell 编写的),但是他们都使用了增强的 Markdown 语法或者可以配置为使用 pandoc。 从 Markdown 生成站点的其他有趣方法: Markdown - 基于文件的Wiki :f.ex。 Gollum,GitHub 也使用的 Wiki 引擎电报:商业; 由 David Pollak 编写
  • reStructuredText 工具支持(reStructuredText tool support)
    问题 这个问题的答案是社区的努力。 编辑现有答案以改进这篇文章。 它目前不接受新的答案或互动。 我是 reStructuredText 的忠实粉丝,但是支持它的工具散落在互联网上。 官方工具列表不完整和/或过时,只能通过提交权限更新。 一段时间以来,维基百科 reStructuredText 页面上有一个综合列表,但这显然“不符合 Web 内容的关注度指南”并被删除。 因此,以问题形式提出:在使用 reStructuredText 时,可以期望找到哪些工具支持,例如文本编辑器、Wiki 软件、与 reStructuredText 之间的转换器等? 回答1 从旧版维基百科页面中挽救(并扩展)列表: 文档 底漆备忘单快速参考 实现 尽管 reStructuredText 的参考实现是用 Python 编写的,但也有其他语言的 reStructuredText 解析器。 Python - Docutils reStructuredText 的主要发行版是 Python Docutils 包。 它包含几个转换工具: rst2html - 从 reStructuredText 到HTML rst2xml - 从 reStructuredText 到XML rst2latex - 从 reStructuredText 到LaTeX rst2odt - 从 reStructuredText
  • How to link your own articles on a Pelican blog?
    I tried to link with the html file name, but it works because they are on the same folder. [Title](./this-is-the-file.html) But it is possible that another article would appear on another folder because of the ARTICLE_URL pattern. Examples: [Title 1](/2014/02/article1.html) [Title 2](/2014/01/25/article2.html) Is it possible to link your own articles with a reference to the slug ? Any other better solution than the generated HTML file name ?
  • Python - ValueError: unknown locale: UTF-8 [duplicate]
    This question already has answers here: Pelican 3.3 pelican-quickstart error “ValueError: unknown locale: UTF-8” (6 answers) Closed 5 years ago. I run the python script that contain Pandas (that one cause the problem) library I got this error: Traceback (most recent call last): File "test.py", line 2, in <module> import pandas ImportError: No module named pandas But if I import from package path to make sure it detects Pandas library, I got this error message Traceback (most recent call last): File "test.py", line 3, in <module> import pandas File "/usr/local/lib/python2.7/site-packages/pandas
  • IPython Notebook语言环境错误[重复](IPython Notebook locale error [duplicate])
    问题 这个问题已经在这里有了答案: Pelican 3.3 pelican-quickstart错误“ ValueError:未知语言环境:UTF-8” (6个答案) 4年前关闭。 安装最新的Mac OSX 64位Anaconda Python发行版后,尝试启动IPython Notebook时,我始终收到ValueError。 启动ipython可以正常工作: 3-millerc-~:ipython Python 2.7.3 |Anaconda 1.4.0 (x86_64)| (default, Feb 25 2013, 18:45:56) Type "copyright", "credits" or "license" for more information. IPython 0.13.1 -- An enhanced Interactive Python. ? -> Introduction and overview of IPython's features. %quickref -> Quick reference. help -> Python's own help system. object? -> Details about 'object', use 'object??' for extra details. 但是启动ipython笔记本: 4-millerc
  • How to use VisualState AdaptiveTrigger to change ListView Item FontSize
    I am using Visual State Adaptive Trigger to change page appearance depending on effective screen resolution. This works great, but I cannot get it to work for ListView Items. My ListView looks something like this: <ListView x:Name="listView" > <ListView.ItemTemplate> <DataTemplate> <TextBlock FontSize="20" Text="{Binding MyItem}"/> </DataTemplate> </ListView.ItemTemplate> </ListView> I can change the TextBlock font size statically in XAML. But I don't know how to reference this in VisualState setter target. Being automatically generated child, I cannot give TextBlock a name. My Visual State
  • Plotting dataframe raises error of ordinal value must be >= 1
    I follow the tutorial at http://nbviewer.ipython.org/github/jvns/pandas-cookbook/blob/v0.1/cookbook/Chapter%205%20-%20Combining%20dataframes%20and%20scraping%20Canadian%20weather%20data.ipynb I have a pandas dataframe weather_mar2012['Temp (°C)'] Out[30]: Date/Time 2012-03-01 00:00:00 -5.5 2012-03-01 01:00:00 -5.7 2012-03-01 02:00:00 -5.4 When trying to plot it i get an error weather_mar2012['Temp (°C)'].plot(figsize=(15, 5)) --------------------------------------------------------------------------- ValueError Traceback (most recent call last) <ipython-input-31-21c79ba7d5ef> in <module>() -
  • Querying for specific articles (via tag/category) in Pelican themes
    Is it possible to set query parameters via jinja in Pelican template files? index.html {% if articles %} {% for article in articles_page.object_list if article.category == 'article' %} #stuff {% endfor %} {% endif %} This will return articles in the article category, but only if they happen to be in the articles already queried for. The desirable setup would be to grab x articles in y category (or with y tag) - is that possible?
  • vue学习(1)——模板语法、过滤器、判断循环和样式
    一、了解vue Vue.js 是一套构建用户界面的渐进式框架。 Vue 只关注视图层, 采用自底向上增量开发的设计。 Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 1.vue.js起步 每个 Vue 应用都需要通过实例化 Vue 来实现。、 语法格式如下: var vm = new Vue({ // 选项 }) 在 Vue 构造器中有一个el 参数,它是 DOM 元素中的 id。 data 用于定义属性。 methods 用于定义的函数,可以通过 return 来返回函数值。 {{ }} 用于输出对象属性和函数返回值。 <div id="vue_det"> <h1>hello:{{ hello }}</h1> <h1>world:{{ world() }}</h1> </div> <script type="text/javascript"> var vm=new Vue({ el:"#vue_det", data:{ hello:"world" }, methods:{ world:function(){ return this.hello+" you like "; } } }) </script> data 对象中的属性的值发生改变时,html 视图将也会产生相应的变化(所有引用这个属性值都会变成修改后的值)。 除了数据属性,Vue
  • 在 X 轴上带有双标签的谷歌折线图(google Line chart with double label on X axis)
    问题 我正在处理谷歌折线图,我想在 x 轴上加倍标签(日期明智的过程),我可以用下面的代码绘制没有日期的图表,但不能填充日期, <html> <head> <title>Google Charts Tutorial</title> <script type="text/javascript" src="loader.js"></script> <script type="text/javascript"> google.charts.load('current', {packages: ['corechart']}); </script> </head> <body> <div id="container" style="width: 1610px; height: 400px; margin-left:-120px;"></div> <script language="JavaScript"> \ function drawChart() { // Define the chart to be drawn. var data = new google.visualization.DataTable(); data.addColumn('string', ''); data.addColumn('number', 'Suceess'); data.addColumn('number
  • Python - 翻译Talk Python To Me (和我聊Python) 播客
    一、背景介绍 “和我聊Python”是一个美国的聊天播客,英文名Talk Python To Me,类似于喜马拉雅的音频课程节目,只不过这个主题是编程语言Python。该节目从2015年的节目到现在,已经超过265期多了,几乎每期都邀请行业专家过来座谈,涉及编程、模块、背后故事等方方面面,为Python的传播做出了非常大的贡献。 也许是语言障碍的原因,这个播客在国内基本上很少有资料介绍,更加没有文本的翻译,所以本人在这里试图做一个意译翻译,供各位爱好者了解Python社区正在发生和讨论的事情,或者Python语言的趋势动态等。因为是意译,并非一对一的直译,部分广告直接过滤,专业术语保留不翻译,也保留了时间戳,万一你想看原文,也可以找得到。 当出现【】时,里面的John,也就是译者,开始“嗡嗡嗡”了,知道背景可以忽略。 官方的介绍如下: 和我聊Python是Michael Kennedy主持的每周播客。 该节目涵盖了各种Python主题以及许多相关主题(例如MongoDB,AngularJS,DevOps)。节目的形式是与行业专家进行45分钟左右时长的自由对话。 二、播客全文翻译 下面是第224期:从网络设计的100天中学到的12个教训(12-lessons-from-100-days-of-web) 原文在此:https://talkpython.fm/episodes/show
  • 如何更改graphviz的默认字体大小?(how to change default font size for graphviz?)
    问题 我使用 doxygen + graphviz 来记录我的代码。 graphviz 在生成图像方面做得很好。 有没有办法更改graphviz的默认字体大小? 默认值为 14,但我想改用 12。 更改单个元素(如节点、子图、边等)的字体大小真的很痛苦。 更新: 这里参考的是我在 doxygen 中使用的代码(当然,文本字段已重命名) @dot strict digraph { node [shape = box, fontsize = 12]; subgraph cluster_main { fontsize = 12; shape = box; label = "main"; subgraph cluster_main_common { fontsize = 12; shape = box; label = "common"; subgraph cluster_main_common_source { fontsize = 12; shape = box; label = "source" subgraph cluster_file1 { fontsize = 12; shape = box; label = "file1.c"; gSystem [label = "var1" URL = "\ref var1"]; } subgraph cluster_file2 {
  • 将笔画应用于WPF中的文本块(Apply stroke to a textblock in WPF)
    问题 如何在WPF中将笔画(文本周围的轮廓)应用于xaml中的文本块? 回答1 下面是我较为习惯的WPF,对此功能进行了全面介绍。 它支持几乎所有您期望的东西,包括: 所有字体相关的属性,包括拉伸和样式文字对齐(左,右,居中,对齐) 文字换行文字修剪文字装饰(下划线,删除线等) 这是使用它可以实现的简单示例: <local:OutlinedTextBlock FontFamily="Verdana" FontSize="20pt" FontWeight="ExtraBold" TextWrapping="Wrap" StrokeThickness="1" Stroke="{StaticResource TextStroke}" Fill="{StaticResource TextFill}"> Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit </local:OutlinedTextBlock> 结果是: 这是控件的代码: using System; using System.ComponentModel; using System.Globalization; using System.Windows; using System.Windows
  • google Line chart with double label on X axis
    I'm working on google line chart and I want to double label on x axis(date wise processes ), I'm able to draw chart without dates with below code but not able to populate dates, <html> <head> <title>Google Charts Tutorial</title> <script type="text/javascript" src="loader.js"></script> <script type="text/javascript"> google.charts.load('current', {packages: ['corechart']}); </script> </head> <body> <div id="container" style="width: 1610px; height: 400px; margin-left:-120px;"></div> <script language="JavaScript"> \ function drawChart() { // Define the chart to be drawn. var data = new google
  • JS
    文章目录 一、BOM 对象1. BOM 介绍2. 对象方法网页弹框定时器方法 3. 对象属性historylocation 二、DOM节点操作1. 节点对象2. 访问节点3. 操作元素样式4. 模拟点击 三、实现除重的开奖码生成1. 页面效果2. 代码分析页面元素元素样式创建函数点击事件 一、BOM 对象 1. BOM 介绍 ​ BOM全称为“Browser Object Model”,浏览器对象模型。提供一系列操作浏览器的属性和方法。核心对象为window对象,不需要手动创建,跟随网页运行自动产生,直接使用,在使用时可以省略书写。 2. 对象方法 网页弹框 alert() //警告框 confirm() //确认框 定时器方法 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Ic21XCmA-1577963198594)(assets\setInterval函数2.png)] 周期性定时器 作用:每隔一段时间就执行一次代码 //开启定时器: var timerID = setInterval(function,interval); /* 参数 : function : 需要执行的代码,可以传入函数名;或匿名函数 interval : 时间间隔,默认以毫秒为单位 1s = 1000ms 返回值 : 返回定时器的ID,用于关闭定时器 */ 关闭定时器