Bläddra i källkod

feat: Add support for custom remote javascript files (#751)

### Prerequisites

Put an `x` into the box(es) that apply:

- [ ] This pull request fixes a bug.
- [X] This pull request adds a feature - #750 
- [ ] This pull request introduces breaking change.

### Description

Add a new configuration item and use resources.GetRemote to gather the
remote asset.

### Checklist

#### General

- [X] Describe what changes are being made
- [X] Explain why and how the changes were necessary and implemented
respectively

#### Resources

- [X] If you have changed any SCSS code, run `make release` to
regenerate all CSS files

#### Contributors

- [X] Add yourself to `CONTRIBUTORS.md` if you aren't on it already
Paolo Mainardi 3 år sedan
förälder
incheckning
c3bcde658b
3 ändrade filer med 22 tillägg och 6 borttagningar
  1. 7 6
      docs/configurations.md
  2. 4 0
      exampleSite/config.toml
  3. 11 0
      layouts/_default/baseof.html

+ 7 - 6
docs/configurations.md

@@ -130,11 +130,11 @@ These are all the parameters used by `hugo-coder` theme.
 | Name                          | Type   | Required | Description                                      | Default                          | Example                                          |
 | ----------------------------- | ------ | -------- | ------------------------------------------------ | -------------------------------- | ------------------------------------------------ |
 | author                        | string | Yes      | Author name.                                     |                                  | `"John Doe"`                                     |
-| info                          | string | Yes      | An headline, job title or similar.               |                                  | `"Full Stack Developer"`                         | 
+| info                          | string | Yes      | An headline, job title or similar.               |                                  | `"Full Stack Developer"`                         |
 | description                   | string | Yes      | Description of the site.                         |                                  | `"John Doe's personal website"`                  |
 | keywords                      | string | Yes      | Site keywords.                                   |                                  | `"blog,developer,personal"`                      |
-| avatarURL                     | string | No       | Photo of the author.                             |                                  | `"images/avatar.jpg"`                            | 
-| gravatar                      | string | No       | Gravatar photo of the author                     |                                  | `"john.doe@example.com"`                         | 
+| avatarURL                     | string | No       | Photo of the author.                             |                                  | `"images/avatar.jpg"`                            |
+| gravatar                      | string | No       | Gravatar photo of the author                     |                                  | `"john.doe@example.com"`                         |
 | favicon_32                    | string | No       | Custom path to a 32x32 favicon.                  | `"/img/favicon-32x32.png"`       | `"/img/favicon-32x32.png"`                       |
 | favicon_16                    | string | No       | Custom path to a 16x16 favicon.                  | `"/img/favicon-16x16.png"`       | `"/img/favicon-16x16.png"`                       |
 | touchIcon                     | string | No       | Custom path to a touch-icon                      | `"/images/apple-touch-icon.png"` | `"/images/apple-touch-icon.png"`                 |
@@ -149,13 +149,14 @@ These are all the parameters used by `hugo-coder` theme.
 | customCSS                     | list   | No       | Add extra CSS files to the website.              | []                               | `["css/extra-style.css"]`                        |
 | customSCSS                    | list   | No       | Add extra SCSS files to the website.             | []                               | `["scss/extra-style.scss"]`                      |
 | customJS                      | list   | No       | Add extra JS files to the website.               | []                               | `["js/extra-script.js"]`                         |
+| customRemoteJS                | list   | No       | Add extra remote JS files to the website.        | []                               | `["https://www.example.com/file.js"]` |
 | enableTwemoji                 | bool   | No       | Adds support for Twemoji                         | `false`                          | `true` or `false`                                |
 
 ### Social Icons Configuration
 
 Social Icons are optional. To use them you will need to set at least all the following required parameters for each icon.
 
-| Configuration  | Type   | Required | Description                              | Example                         | 
+| Configuration  | Type   | Required | Description                              | Example                         |
 | -------------- | ------ | -------- | ---------------------------------------- | ------------------------------- |
 | name           | string | Yes      | Icon name.                               | `"Github"`                      |
 | icon           | string | Yes      | ForkAwesome icon classes.                | `"fa fa-github"`                |
@@ -186,7 +187,7 @@ An example:
 
 Menu Items are optional. To use them you will need to set all the following required parameters for each icon.
 
-| Configuration  | Type   | Required | Description                              | Example                         | 
+| Configuration  | Type   | Required | Description                              | Example                         |
 | -------------- | ------ | -------- | ---------------------------------------- | ------------------------------- |
 | name           | string | Yes      | Menu Item name.                          | `"Posts"`                       |
 | weight         | int    | Yes      | Menu Item order.                         | `1`                             |
@@ -212,7 +213,7 @@ An example:
 
 CSP stands for [Content Security Policy](https://developers.google.com/web/fundamentals/security/csp). These configurations are optional. To use them you will need to set all the following required parameters. See [here](https://developers.google.com/web/fundamentals/security/csp#policy_applies_to_a_wide_variety_of_resources) for reference.
 
-| Configuration  | Type        | Required | Description | Example                         | 
+| Configuration  | Type        | Required | Description | Example                         |
 | -------------- | ----------- | -------- | ----------- | ------------------------------- |
 | childsrc       | string list | Yes      |             | `["'self'"]`                    |
 | fontsrc        | string list | Yes      |             | `["'self'"]`                    |

+ 4 - 0
exampleSite/config.toml

@@ -39,9 +39,13 @@ maxSeeAlsoItems = 5
 customCSS = []
 # Custom SCSS, file path is relative to Hugo's asset folder (default: {your project root}/assets)
 customSCSS = []
+
 # Custom JS
 customJS = []
 
+# Custom remote JS files
+customRemoteJS = []
+
 # If you want to use fathom(https://usefathom.com) for analytics, add this section
 # [params.fathomAnalytics]
 # siteID = "ABCDE"

+ 11 - 0
layouts/_default/baseof.html

@@ -49,6 +49,17 @@
   {{ end }}
   {{ end }}
 
+  {{ range .Site.Params.customRemoteJS }}
+  {{ if $.Site.IsServer }}
+  {{ $script := resources.GetRemote . }}
+  <script src="{{ $script.RelPermalink }}"></script>
+  {{ else }}
+  {{ $script := resources.GetRemote . | minify | fingerprint }}
+  <script src="{{ $script.RelPermalink }}" integrity="{{ $script.Data.Integrity }}"></script>
+  {{ end }}
+  {{ end }}
+
+
   {{ template "_internal/google_analytics.html" . }}
 
   {{ if and .Site.Params.fathomAnalytics .Site.Params.fathomAnalytics.siteID }}