“基友遍四海,友链不可少”
本文介绍如何在 hugo 中添加友情链接
一、前言
使用 Hugo 搭建博客的你是否还在为没有友情链接而烦恼,阅读本文将为你制作属于自己的友情链接提供解决方案。
二、友情链接
2.1 效果
先看咋们的效果图
首页:
点击后:
手机端:
2.2 制作过程
2.2.1 增加菜单栏
[languages]
[languages.en]
......
[languages.en.menu]
......
[[languages.en.menu.main]]
identifier = "friend"
pre = ""
post = ""
name = "Friend"
url = "/friend/"
title = ""
weight = 5
......
[languages.en.params]
......
首先在 menu
增加一个菜单项为 friend
表示友情链接,上面是多语言的版本,不是多语言也是一样的逻辑。
2.2.2 制作 shortcodes
2.2.2.1 创建 html
在你博客的路径 /xxx/blog/layouts/shortcodes/
下创建 friend.html
文件。
{
{ if .IsNamedParams }}
{
{- $src := .Get "logo" -}}
{
{- $small := .Get "logo_small" | default $src -}}
{
{- $large := .Get "logo_large" | default $src -}}
<div class="flink" id="article-container">
<div class="friend-list-div" >
<div class="friend-div">
<a target="_blank" href={
{
.Get "url" | safeURL }} title=<