alexandrev/xslt-lab
1
0
Fork 0
mirror of https://github.com/alexandrev/xslt-lab.git synced 2026-09-16 18:23:16 +00:00
Code Packages Releases Activity

Add sticky sidebar ad to blog articles, fix EA script loading

Browse Source 
- Article pages (single.html): two-column grid layout — article + 160px
  sidebar with sticky EA ad (id="xsltplayground-blog")
- Non-article pages (home, list): keep existing sticky header bar
  (id="xsltplayground-blog-header")
- Move EA script to <head> in baseof.html so it loads on all pages
  regardless of placement; remove script tag from ethicalads partial
- has-ethicalads body class now only applied on non-article pages
  (no 64px header-offset shift on article pages)
- Sidebar hidden on viewports <= 860px (mobile/tablet)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
alexandrev-tibco
2026-05-02 16:22:52 +02:00
parent a07f9df934
commit c48acd1a8c
4 changed files with 60 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/layouts/_default/baseof.html
+6 -2
View File
@@ -12,11 +12,15 @@
<meta property="og:url" content="{{ .Permalink }}">
{{ partial "schema-app.html" . }}
{{ partial "adsense/head.html" . }}
{{- if and .Site.Params.ethicalads.publisher (ne hugo.Environment "development") -}}
<script async src="https://media.ethicalads.io/media/client/ethicalads.min.js"></script>
{{- end -}}
<link rel="stylesheet" href="{{ "css/main.css" | relURL }}">
</head>
{{- $ethicalAds := and .Site.Params.ethicalads.publisher (ne hugo.Environment "development") -}}
<body{{ if $ethicalAds }} class="has-ethicalads"{{ end }}>
{{ partial "ethicalads.html" . }}
{{- $ethicalAdsHeader := and $ethicalAds (not .IsPage) -}}
<body{{ if $ethicalAdsHeader }} class="has-ethicalads"{{ end }}>
{{- if $ethicalAdsHeader -}}{{ partial "ethicalads.html" . }}{{- end -}}
<header class="site-header">
<div class="container header-grid">
<div>
site/layouts/_default/single.html
+24 -12
View File
@@ -1,14 +1,26 @@
{{ define "main" }}
<article class="post">
<p class="eyebrow">{{ .Section | title }}</p>
<h1>{{ .Title }}</h1>
<p class="muted">{{ .Date.Format "02 Jan 2006" }}</p>
{{ with .Params.description }}<p class="lead">{{ . }}</p>{{ end }}
{{ partial "adsense/in-article.html" . }}
<div class="content">
{{ .Content }}
</div>
<p class="muted back-link"><a href="{{ .CurrentSection.RelPermalink }}">← Back to {{ .CurrentSection.Title }}</a></p>
{{ partial "related-posts.html" . }}
</article>
{{- $showAd := and .Site.Params.ethicalads.publisher (ne hugo.Environment "development") -}}
<div class="article-layout{{ if not $showAd }} article-layout--no-ad{{ end }}">
<article class="post">
<p class="eyebrow">{{ .Section | title }}</p>
<h1>{{ .Title }}</h1>
<p class="muted">{{ .Date.Format "02 Jan 2006" }}</p>
{{ with .Params.description }}<p class="lead">{{ . }}</p>{{ end }}
{{ partial "adsense/in-article.html" . }}
<div class="content">
{{ .Content }}
</div>
<p class="muted back-link"><a href="{{ .CurrentSection.RelPermalink }}">← Back to {{ .CurrentSection.Title }}</a></p>
{{ partial "related-posts.html" . }}
</article>
{{- if $showAd -}}
<aside class="article-sidebar">
<div
id="xsltplayground-blog"
data-ea-publisher="{{ .Site.Params.ethicalads.publisher }}"
data-ea-type="image"
></div>
</aside>
{{- end -}}
</div>
{{ end }}
site/layouts/partials/ethicalads.html
+2 -6
View File
@@ -1,13 +1,9 @@
{{- $publisher := .Site.Params.ethicalads.publisher -}}
{{- if and $publisher (ne hugo.Environment "development") -}}
{{ if not (.Scratch.Get "ethicalads_loaded") -}}
<script async src="https://media.ethicalads.io/media/client/ethicalads.min.js"></script>
{{ .Scratch.Set "ethicalads_loaded" true }}
{{- end }}
{{- if $publisher -}}
<div class="ad-bar">
<div class="container ad-bar-inner">
<span class="muted">Sponsored</span>
<div class="ethical-ad" data-ea-publisher="{{ $publisher }}" data-ea-type="image"></div>
<div id="xsltplayground-blog-header" data-ea-publisher="{{ $publisher }}" data-ea-type="image"></div>
</div>
</div>
{{- end -}}
site/static/css/main.css
+28
View File
@@ -427,8 +427,36 @@ code {
letter-spacing: 0.05em;
}
/* ── Article + ad sidebar layout ───────────────────────────────── */
.article-layout {
display: grid;
grid-template-columns: 1fr 160px;
gap: 48px;
align-items: start;
}
.article-layout--no-ad {
grid-template-columns: 1fr;
}
.article-sidebar {
position: sticky;
top: 90px;
padding-top: 40px;
}
/* ── Media queries ─────────────────────────────────────────────── */
@media (max-width: 860px) {
.article-layout {
grid-template-columns: 1fr;
}
.article-sidebar {
display: none;
}
}
@media (max-width: 720px) {
.header-grid { grid-template-columns: 1fr; }
.nav { flex-wrap: wrap; }