infidel-cupper-theme/README.md
2022-11-14 23:16:26 +07:00

100 lines
2.7 KiB
Markdown

# Infidel Cupper
[![Maintenance](https://img.shields.io/badge/Maintained%3F-yes-green.svg)](https://GitHub.com/Naereen/StrapDown.js/graphs/commit-activity)
This is infidel's fork version of hugo [Cupper](https://github.com/zwbetz-gh/cupper-hugo-theme) theme. I use this theme for my own site [nnag.me](https://nnag.me).
## Added Feature
### Plausible integration
#### Shortcode
```go
{{ if and (.Site.Params.plsDomain) (.Site.Params.plsUrl) }}
<script defer data-domain="{{.Site.Params.plsDomain}}" src="{{.Site.Params.plsUrl | relURL}}"></script>
{{ end }}
```
#### Hugo Conf
```yml
...
params:
plsDomain : <Your Domain>
plsUrl : <Your Plausible script url>
...
```
### Plausible Bypass Adblock
Adblocker easyfilter has some filter on “plausible.js” string, especially if its routed towards external source . To bypass this you can setup a proxy rule on nginx to redirect this plausible api into the currently accessed site.
### nginx conf
```nginx
server {
...
location = /js/script.js {
# Change this if you use a different variant of the script
proxy_pass https://plausible.io/js/script.js;
# Tiny, negligible performance improvement. Very optional.
proxy_buffering on;
# Cache the script for 6 hours, as long as plausible.io returns a valid response
proxy_cache jscache;
proxy_cache_valid 200 6h;
proxy_cache_use_stale updating error timeout invalid_header http_500;
# Optional. Adds a header to tell if you got a cache hit or miss
add_header X-Cache $upstream_cache_status;
}
location = /api/event {
proxy_pass https://plausible.io/api/event;
proxy_buffering on;
proxy_http_version 1.1;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Forwarded-Host $host;
}
}
```
### Hugo Conf
```yml
...
params:
plsDomain : <Your Domain>
plsUrl : /js/script.js
...
```
### PDF.js
#### shortcode
- `layout/shortcodes/embed-pdf.html`
#### scripts
- `static/js/pdf.js`
- `static/js/pdf.worker.js`
### Layout & CSS
#### Homepage `layout/index.html`
Homepage splited into two main section, Greetings section and Recent Post section. Both of the section is wrapped using `inf-border` class to give them borders. The Greetings section now has subsection of important links which is paritally loaded from custom layout of `icon-links.html`.
The Recent Posts section is managed by `inf-patterns-list` class, using html table instead of html lists format.