ショートコードの自作、Quote

 Hugo 0.15   ShortCode   Sample 

ショートコードの自作、本文参照及び引用のためのテンプレート


{{< quote “引用本文” “引用元” >}}

本文引用本文引用本文引用本文引用本文引用本文引用本文引用

ココ迄引用


本文引用本文引用本文引用文引用本文引用

Prester


本文引用本文引用本文引用

http://prester.org/



ShortCode

layouts/shortcodes フォルダに quote.html というファイル名で保存

1
2
3
4
5
6
<div class="myshortcode-quote">
  <div class="row"><img src="/images/quote.png" />
    <div class="one-half columns">{{ .Get 0 }}</div>
  </div>
    <p>{{ .Get 1 }}</p>
</div>

CSS

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
.myshortcode-quote {
  width: 85%;
  max-width: auto;
  border: dashed 1px #3696FF; padding: 30px;
  background-color: #EFF9FF;
  color: #005C93;
}

.myshortcode-quote p {
font-size: 1.0rem;
color: #B5B5B5;
text-align: right;
margin:2.0rem -1.5rem 0 0;
}




次へ

前へ