LinMinquan's Blog

Experience technology to change life

Hugo add meta for Facebook and Twitter share link preview

After analyze a example link that can preview in Facebook & Twitter and search Google, I found it just need to add some meta on blog post’s html header.  One guy give an example code below. <!DOCTYPE html <html lang="en" <head prefix="og: http://ogp.me/ns# article: http://ogp.me/ns/article# website: http://ogp.me/ns/website#" <meta http-equiv="content-type" content="text/html; charset=utf-8" <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1" <meta name="title" content="{{ .Title }} | {{ .Site.Title }}" <meta name="description" content="{{ .Description }}" <!-- Start of Open Graph -- <meta property=" Read more →

two simple http server tools

1 http-server install: npm install -g http-server start the server with http-server reference: NodeJS – Setup a Simple HTTP Server / Local Web Server 2 browser-sync install: npm install -g browser-sync start the server with browser-sync start --server   Read more →

Can’t display svg file when host on aws s3

.svg 文件上传到 aws s3 + cloudfront 时,有可能在网页上显示不出来,通过 chrome inspect 看的话,该 svg 的 content-type 并不是 image/svg+xml 。 解决办法是在 aws s3 网页上,选中该 svg 文件,右键 -> Properties -> Metadata 中将 content-type 改为 image/svg+xml Read more →

Hugo, Front Matter Variable, Type

Hugo V40.2 Hugo 的 Front Matter Variable 有一个是 Type,它的默认值是这篇 post 所在的 directory ,如果这篇 post (假设文件名为 aaa.md ) 所在的目录是 blog ,那它最终的 url 是 xxx.com/blog/aaa/ ,而 Type 可以修改其中的 blog 为其它字符。 我遇到的问题是我的 posts 都是从网站(基于 WordPress )上用插件导出来的,这样每个 post (markdown file) 里的 Front Matter 会有 Type: posts 的属性。有这个设置使得这些 posts (markdown file) 的 template 是基于 posts template ,但这些 posts (markdown file) 其实是放在 blog 目录下的,按照我原来的理解,放在 哪个目录下(例如 blog ),其 template 是基于哪个 template 的(放在 blog 下,就基于 blog template )。但其实这个是可以被 type 这个 Front Matter 给 override 的。 Read more →

Hugo pagination bootstrap4

Hugo V40.2 , Bootstrap 4.1.1 在做 pagination 时,Hugo 文档说可以用内置的跟 Bootstrap 兼容的一个 pagination ,但我在用的时候,出来的样式不对。我看 Jimmysong 的 博客源码 ,他用的就是官方说的内置的 pagination ,但他用的是 Bootstrap3 。 搜了下,有人也发现了 Hugo 说的跟 Bootstrap 兼容的 pagination 只是跟 Bootstrap3 兼容,而不是跟 Bootstrap4 兼容,并给出了解决办法。 Hugo Pagination Partial for Bootstrap4 Read more →

如何查看浏览器中文字当前在用的字体?

在 CSS 代码中会在 font-family 中指定了好几个字体,但最终用的是哪个字体呢? 在 Chrome 中,Inspect -> Element -> 右侧的 Computed -> 拉到最下面Rendered Fonts 参考链接:How can I determine what font a browser is actually using to render some text? Read more →

apache2 ssl configulation subdomain

Environment: Ubuntu 16.04, Apache 2.4.18, 主域名已经配置好了 ssl ,想给一个二级域名配置 ssl ,证书从 sslforfree.com 那配置下载后,上传到 /etc/apache2/ssl ,在 /etc/apache2/sites-available 里复制主域名已经配置好的 conf 进行修改,见下图。 <IfModule mod_ssl.c> <VirtualHost _default_:443> ServerAdmin account@gl-inet.com ServerName docs.gl-inet.com ServerAlias docs.gl-inet.com DocumentRoot /var/www/newdocs ErrorLog ${APACHE_LOG_DIR}/error.log CustomLog ${APACHE_LOG_DIR}/access.log combined SSLEngine on SSLCertificateFile /etc/apache2/ssl/docs_gl-inet_com_certificate.crt SSLCertificateKeyFile /etc/apache2/ssl/docs_gl-inet_com_private.key SSLCertificateChainFile /etc/apache2/ssl/docs_gl-inet_com_ca_bundle.crt DirectoryIndex index.php index.html <Directory /> Options FollowSymLinks AllowOverride None </Directory> <Directory /var/www/gl-inet.com/public_html/docs/> Options -ExecCGI AllowOverride None RemoveHandler .cgi .pl .py .php4 .pcgi4 .php .php3 .phtml .pcgi .php5 . Read more →

sslforfree wildcard Certificates https SSL

第一次用 sslforfree.com 的 wildcard 功能,成功。之前没倒腾成功。 在输入框内输入的是 *.linminquan.com linminquan.com ,要求验证的是两个 DNS TXT 记录。 之前一直不理解为什么是同样的一个 _acme-challenge.linminquan.com 要 DNS TXT 到两个不同的值,只好按它的要求操作,后来居然是可以的。 验证时,第一行有显示 TXT Record(s) Found. 就可以了。 chrome 中查看生效要过一会。 Read more →

js解析url

解析 URL Params 为对象,例如 ‘http://www.domain.com/?user=anonymous&id=123&id=456&city=%E5%8C%97%E4%BA%AC&enabled&#8217; parseParam(url) /* 结果 { user: 'anonymous', id:[123, 456], // 重复出现的 key 要组装成数组,能被转成数字的就转成数字类型 city: '北京', // 中文需要解码 enabled: true, // 未指定值的 key 约定为 true } */ let testUrl = 'http://www.domain.com/?user=anonymous&id=123&id=456&city=%E5%8C%97%E4%BA%AC&enabled'; function parseParam(url) { let urlObject = new URL(url); let result = {}; let user = urlObject.searchParams.get("user"); if ( user != 'null') { result.user = user; }; let id = urlObject.searchParams.getAll("id"); if ( id != 'null' ) { result. Read more →