Fixes #4798

7 files changed, 90 insertions, 0 deletions

diff --git a/config/privacy/privacyConfig.go b/config/privacy/privacyConfig.go
index d4820396d..a058c3593 100644
--- a/config/privacy/privacyConfig.go
+++ b/config/privacy/privacyConfig.go
@@ -77,6 +77,9 @@ type Twitter struct {
 	// When set to true, the Tweet and its embedded page on your site are not used
 	// for purposes that include personalized suggestions and personalized ads.
 	EnableDNT bool
+
+	// If simple mode is enabled, a static and no-JS version of the Tweet will be built.
+	Simple bool
 }
 
 // Vimeo holds the privacy configuration settingsrelated to the Vimeo shortcode.
diff --git a/config/privacy/privacyConfig_test.go b/config/privacy/privacyConfig_test.go
index 5593872de..8d9c9f14f 100644
--- a/config/privacy/privacyConfig_test.go
+++ b/config/privacy/privacyConfig_test.go
@@ -44,6 +44,7 @@ disable = true
 [privacy.twitter]
 disable = true
 enableDNT = true
+simple = true
 [privacy.vimeo]
 disable = true
 simple = true
@@ -69,6 +70,7 @@ simple = true
 	assert.True(pc.SpeakerDeck.Disable)
 	assert.True(pc.Twitter.Disable)
 	assert.True(pc.Twitter.EnableDNT)
+	assert.True(pc.Twitter.Simple)
 	assert.True(pc.Vimeo.Disable)
 	assert.True(pc.Vimeo.Simple)
 	assert.True(pc.YouTube.PrivacyEnhanced)
diff --git a/config/services/servicesConfig.go b/config/services/servicesConfig.go
index d78b80948..bc321141a 100644
--- a/config/services/servicesConfig.go
+++ b/config/services/servicesConfig.go
@@ -30,6 +30,7 @@ type Config struct {
 	Disqus          Disqus
 	GoogleAnalytics GoogleAnalytics
 	Instagram       Instagram
+	Twitter         Twitter
 }
 
 // Disqus holds the functional configuration settings related to the Disqus template.
@@ -52,6 +53,14 @@ type Instagram struct {
 	DisableInlineCSS bool
 }
 
+// Twitter holds the functional configuration settings related to the Twitter shortcodes.
+type Twitter struct {
+	// The Simple variant of Twitter is decorated with a basic set of inline styles.
+	// This means that if you want to provide your own CSS, you want
+	// to disable the inline CSS provided by Hugo.
+	DisableInlineCSS bool
+}
+
 func DecodeConfig(cfg config.Provider) (c Config, err error) {
 	m := cfg.GetStringMap(servicesConfigKey)
 
diff --git a/config/services/servicesConfig_test.go b/config/services/servicesConfig_test.go
index 69dec0350..367b40153 100644
--- a/config/services/servicesConfig_test.go
+++ b/config/services/servicesConfig_test.go
@@ -35,6 +35,8 @@ shortname = "DS"
 id = "ga_id"
 [services.instagram]
 disableInlineCSS = true
+[services.twitter]
+disableInlineCSS = true
 `
 	cfg, err := config.FromConfigString(tomlConfig, "toml")
 	assert.NoError(err)
diff --git a/tpl/tplimpl/embedded/templates.autogen.go b/tpl/tplimpl/embedded/templates.autogen.go
index e9fcc3325..44a330622 100644
--- a/tpl/tplimpl/embedded/templates.autogen.go
+++ b/tpl/tplimpl/embedded/templates.autogen.go
@@ -390,10 +390,47 @@ if (!doNotTrack) {
 {{- end -}}`},
 	{`shortcodes/twitter.html`, `{{- $pc := .Page.Site.Config.Privacy.Twitter -}}
 {{- if not $pc.Disable -}}
+{{- if $pc.Simple -}}
+{{ template "_internal/shortcodes/twitter_simple.html" . }}
+{{- else -}}
 {{- $url := printf "https://api.twitter.com/1/statuses/oembed.json?id=%s&dnt=%t" (index .Params 0) $pc.EnableDNT -}}
 {{- $json := getJSON $url -}}
 {{ $json.html | safeHTML }}
+{{- end -}}
 {{- end -}}`},
+	{`shortcodes/twitter_simple.html`, `{{- $pc := .Page.Site.Config.Privacy.Twitter -}}
+{{- $sc := .Page.Site.Config.Services.Twitter -}}
+{{- if not $pc.Disable -}}
+{{- $id := .Get 0 -}}
+{{- $json := getJSON "https://api.twitter.com/1/statuses/oembed.json?id=" $id "&omit_script=true" -}}
+{{- if not $sc.DisableInlineCSS -}}
+{{ template "__h_simple_twitter_css" $ }}
+{{- end -}}
+{{ $json.html | safeHTML }}
+{{- end -}}
+
+{{ define "__h_simple_twitter_css" }}
+{{ if not (.Page.Scratch.Get "__h_simple_twitter_css") }}
+{{/* Only include once */}}
+{{  .Page.Scratch.Set "__h_simple_twitter_css" true }}
+<style type="text/css">
+  .twitter-tweet {
+  font: 14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
+  border-left: 4px solid #2b7bb9;
+  padding-left: 1.5em;
+  color: #555;
+}
+  .twitter-tweet a {
+  color: #2b7bb9;
+  text-decoration: none;
+}
+  blockquote.twitter-tweet a:hover,
+  blockquote.twitter-tweet a:focus {
+  text-decoration: underline;
+}
+</style>
+{{ end }}
+{{ end }}`},
 	{`shortcodes/vimeo.html`, `{{- $pc := .Page.Site.Config.Privacy.Vimeo -}}
 {{- if not $pc.Disable -}}
 {{- if $pc.Simple -}}
diff --git a/tpl/tplimpl/embedded/templates/shortcodes/twitter.html b/tpl/tplimpl/embedded/templates/shortcodes/twitter.html
index 472bd8572..ea7f10c38 100755
--- a/tpl/tplimpl/embedded/templates/shortcodes/twitter.html
+++ b/tpl/tplimpl/embedded/templates/shortcodes/twitter.html
@@ -1,6 +1,10 @@
 {{- $pc := .Page.Site.Config.Privacy.Twitter -}}
 {{- if not $pc.Disable -}}
+{{- if $pc.Simple -}}
+{{ template "_internal/shortcodes/twitter_simple.html" . }}
+{{- else -}}
 {{- $url := printf "https://api.twitter.com/1/statuses/oembed.json?id=%s&dnt=%t" (index .Params 0) $pc.EnableDNT -}}
 {{- $json := getJSON $url -}}
 {{ $json.html | safeHTML }}
+{{- end -}}
 {{- end -}}
\ No newline at end of file
diff --git a/tpl/tplimpl/embedded/templates/shortcodes/twitter_simple.html b/tpl/tplimpl/embedded/templates/shortcodes/twitter_simple.html
new file mode 100644
index 000000000..45d594fd9
--- /dev/null
+++ b/tpl/tplimpl/embedded/templates/shortcodes/twitter_simple.html
@@ -0,0 +1,33 @@
+{{- $pc := .Page.Site.Config.Privacy.Twitter -}}
+{{- $sc := .Page.Site.Config.Services.Twitter -}}
+{{- if not $pc.Disable -}}
+{{- $id := .Get 0 -}}
+{{- $json := getJSON "https://api.twitter.com/1/statuses/oembed.json?id=" $id "&omit_script=true" -}}
+{{- if not $sc.DisableInlineCSS -}}
+{{ template "__h_simple_twitter_css" $ }}
+{{- end -}}
+{{ $json.html | safeHTML }}
+{{- end -}}
+
+{{ define "__h_simple_twitter_css" }}
+{{ if not (.Page.Scratch.Get "__h_simple_twitter_css") }}
+{{/* Only include once */}}
+{{  .Page.Scratch.Set "__h_simple_twitter_css" true }}
+<style type="text/css">
+  .twitter-tweet {
+  font: 14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
+  border-left: 4px solid #2b7bb9;
+  padding-left: 1.5em;
+  color: #555;
+}
+  .twitter-tweet a {
+  color: #2b7bb9;
+  text-decoration: none;
+}
+  blockquote.twitter-tweet a:hover,
+  blockquote.twitter-tweet a:focus {
+  text-decoration: underline;
+}
+</style>
+{{ end }}
+{{ end }}
\ No newline at end of file