Skip to content

Commit b2e4d6e

Browse files
manid2manid2
committed
feat: Add adtserra ads
Update npm run test targets to include exampleSite.
1 parent 8a7b545 commit b2e4d6e

File tree

4 files changed

+199
-6
lines changed

4 files changed

+199
-6
lines changed

‎exampleSite/assets/scripts/ads.js

Lines changed: 173 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,173 @@
1+
// ad locations in page
2+
const postHeader = document.querySelector(".post-header");
3+
const postContent = document.querySelector(".post-content");
4+
const postPagination = document.querySelector(".post-footer > .pagination");
5+
const postFooter = document.querySelector(".post-footer");
6+
7+
// media queries
8+
const phoneQuery = getComputedStyle(document.body).getPropertyValue(
9+
"--phone",
10+
);
11+
const isPhone = () => window.matchMedia(phoneQuery).matches;
12+
13+
// ad configuration options
14+
const adBannerLeaderConfDesktop = {
15+
key: "bee96be5c69e7af0f2691329a379a004",
16+
format: "iframe",
17+
height: 90,
18+
width: 728,
19+
params: {},
20+
};
21+
22+
const adBannerLeaderConfMobile = {
23+
key: "684d5fd86fbcfeea0b3b2c8dac191a20",
24+
format: "iframe",
25+
height: 50,
26+
width: 320,
27+
params: {},
28+
};
29+
30+
const adDirectLink = document.createElement("a");
31+
adDirectLink.href =
32+
"https://www.highcpmrevenuegate.com/tk17ncqp?key=484c772258d73d54a528cc874518bfaa";
33+
adDirectLink.title = "Ad";
34+
adDirectLink.textContent = "Click here for ad ...";
35+
36+
const adReferralLink = document.createElement("a");
37+
adReferralLink.href =
38+
"https://beta.publishers.adsterra.com/referral/YiXLaw9kEU";
39+
adReferralLink.title = "Adsterra referral";
40+
adReferralLink.textContent = "Click here to join Adsterra ...";
41+
42+
const adNativeBanner = document.createElement("div");
43+
adNativeBanner.id = "container-9a0b7e3f5ef184780fa822e1002f7dbe";
44+
45+
function getAdBannerLeaderDevice(adDevice, adConf) {
46+
const atOptionsScript = document.createElement("script");
47+
atOptionsScript.type = "text/javascript";
48+
atOptionsScript.textContent = "atOptions = " + JSON.stringify(adConf);
49+
50+
const adSrcScript = document.createElement("script");
51+
adSrcScript.type = "text/javascript";
52+
adSrcScript.src =
53+
"https://www.profitablecreativeformat.com/" + adConf.key + "/invoke.js";
54+
55+
const adBanner = document.createElement("div");
56+
adBanner.classList.add("banner", "banner--" + adDevice);
57+
adBanner.append(atOptionsScript);
58+
adBanner.append(adSrcScript);
59+
return adBanner;
60+
}
61+
62+
function setAdBannerLeader(isResize = false) {
63+
let postHeaderAds = null;
64+
65+
if (!isResize) {
66+
postHeaderAds = getAdBlock();
67+
} else {
68+
postHeaderAds = postHeader.querySelector(".ads");
69+
postHeaderAds.removeChild(postHeaderAds.firstElementChild);
70+
}
71+
72+
if (!isPhone()) {
73+
postHeaderAds.append(
74+
getAdBannerLeaderDevice("desktop", adBannerLeaderConfDesktop),
75+
);
76+
} else {
77+
postHeaderAds.append(
78+
getAdBannerLeaderDevice("mobile", adBannerLeaderConfMobile),
79+
);
80+
}
81+
82+
if (!isResize) {
83+
postHeader.prepend(postHeaderAds);
84+
}
85+
}
86+
87+
function setAdReferralBanner(isResize = false) {
88+
let postFooterAds = null;
89+
90+
if (!isResize) {
91+
postFooterAds = getAdBlock();
92+
} else {
93+
postFooterAds = postFooter.querySelector(".ads");
94+
postFooterAds.removeChild(postFooterAds.firstElementChild);
95+
}
96+
97+
const adBanner = document.createElement("div");
98+
adBanner.classList.add("banner");
99+
100+
const adReferralLink = document.createElement("a");
101+
adReferralLink.href =
102+
"https://beta.publishers.adsterra.com/referral/YiXLaw9kEU";
103+
adReferralLink.title = "Adsterra referral";
104+
105+
const adReferralGif = document.createElement("img");
106+
adReferralGif.alt = "Adsterra referral banner";
107+
108+
if (!isPhone()) {
109+
adBanner.classList.add("banner--desktop");
110+
adReferralGif.src =
111+
"https://landings-cdn.adsterratech.com/referralBanners/gif/720x90_adsterra_reff.gif";
112+
} else {
113+
adBanner.classList.add("banner--mobile");
114+
adReferralGif.src =
115+
"https://landings-cdn.adsterratech.com/referralBanners/gif/300x250_adsterra_reff.gif";
116+
}
117+
adReferralLink.append(adReferralGif);
118+
adBanner.append(adReferralLink);
119+
postFooterAds.append(adBanner);
120+
121+
if (!isResize) {
122+
postFooter.prepend(postFooterAds);
123+
}
124+
}
125+
126+
setAdBannerLeader();
127+
setAdReferralBanner();
128+
129+
function handleWinResize() {
130+
setAdBannerLeader(true);
131+
setAdReferralBanner(true);
132+
}
133+
134+
window.addEventListener("resize", handleWinResize);
135+
136+
function getAdBlock(adContent, styles) {
137+
const adBlock = document.createElement("div");
138+
adBlock.classList.add("ads");
139+
140+
if (styles) {
141+
adBlock.classList.add(styles);
142+
}
143+
144+
if (adContent) {
145+
adBlock.append(adContent);
146+
}
147+
148+
return adBlock;
149+
}
150+
151+
const adDirectLinkButtons = document.createElement("div");
152+
adDirectLinkButtons.classList.add("ads", "buttons", "fill");
153+
154+
const adDirectLinkButtonLeft = document.createElement("a");
155+
adDirectLinkButtonLeft.classList.add("button", "outline", "left");
156+
adDirectLinkButtonLeft.href = adDirectLink.href;
157+
adDirectLinkButtonLeft.title = adDirectLink.title;
158+
adDirectLinkButtonLeft.textContent = adDirectLink.textContent;
159+
160+
const adDirectLinkButtonRight = document.createElement("a");
161+
adDirectLinkButtonRight.classList.add("button", "outline", "right");
162+
adDirectLinkButtonRight.href = adReferralLink.href;
163+
adDirectLinkButtonRight.title = adReferralLink.title;
164+
adDirectLinkButtonRight.textContent = adReferralLink.textContent;
165+
166+
adDirectLinkButtons.append(adDirectLinkButtonLeft);
167+
adDirectLinkButtons.append(adDirectLinkButtonRight);
168+
169+
postContent.prepend(adDirectLinkButtons);
170+
171+
if (postPagination) {
172+
postPagination.append(getAdBlock(adNativeBanner, "native--banner"));
173+
}

‎exampleSite/config/production/config.toml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
googleAnalytics = "G-FX00ZBCNBW"
22
enableGitInfo = true
33

4+
[params]
5+
show_ads = true
6+
47
[params.git_info]
58
host = "github"
69
user = "manid2"

‎exampleSite/layouts/partials/extend_footer.html

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{{- $showAds := false -}}
2+
{{- if isset .Params "show_ads" -}}
3+
{{- $showAds = .Params.show_ads -}}
4+
{{- else if isset site.Params "show_ads" -}}
5+
{{- $showAds = site.Params.show_ads -}}
6+
{{- end -}}
7+
8+
{{- if $showAds -}}
9+
{{- $ads := resources.Get "scripts/ads.js" | js.Build -}}
10+
{{- $bundle := slice $ads | resources.Concat "bundle.ads.js" -}}
11+
{{- if hugo.IsProduction -}}
12+
{{- $bundle = $bundle | resources.Minify -}}
13+
{{- end -}}
14+
<script type="text/javascript" src="{{ $bundle.RelPermalink }}"></script>
15+
<script type="text/javascript" src="//pl20220116.highcpmrevenuegate.com/7f/c4/72/7fc4729b41e6def7678efe899c1db986.js"></script>
16+
<script async="async" data-cfasync="false" src="//pl20260188.highcpmrevenuegate.com/9a0b7e3f5ef184780fa822e1002f7dbe/invoke.js"></script>
17+
{{- end -}}

‎package.json

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,12 @@
44
"description": "Hugo theme for terminal users.",
55
"main": "index.js",
66
"scripts": {
7-
"g-fmt": "prettier --config '.prettier.json' --write 'layouts/**/*.html'",
8-
"g-fmt-check": "prettier --config '.prettier.json' --check 'layouts/**/*.html'",
9-
"j-fmt": "prettier --config '.prettier.json' --write 'assets/scripts/*.js'",
10-
"j-fmt-check": "prettier --config '.prettier.json' --check 'assets/scripts/*.js'",
11-
"j-lint": "eslint 'assets/scripts/*.js'",
12-
"j-lint-fix": "eslint --fix 'assets/scripts/*.js'",
7+
"g-fmt": "prettier --config '.prettier.json' --write 'layouts/**/*.html' 'exampleSite/layouts/**/*.html'",
8+
"g-fmt-check": "prettier --config '.prettier.json' --check 'layouts/**/*.html' 'exampleSite/layouts/**/*.html'",
9+
"j-fmt": "prettier --config '.prettier.json' --write 'assets/scripts/*.js' 'exampleSite/assets/scripts/*.js'",
10+
"j-fmt-check": "prettier --config '.prettier.json' --check 'assets/scripts/*.js' 'exampleSite/assets/scripts/*.js'",
11+
"j-lint": "eslint 'assets/scripts/*.js' 'exampleSite/assets/scripts/*.js'",
12+
"j-lint-fix": "eslint --fix 'assets/scripts/*.js' 'exampleSite/assets/scripts/*.js'",
1313
"m-links-check": "linkinator --config '.linkinator.config.json' 'README.md' 'exampleSite/content/**/*.md'",
1414
"m-lint": "markdownlint --config '.markdownlint.json' 'README.md' 'exampleSite/content/**/*.md'",
1515
"s-fmt": "prettier --config '.prettier.json' --write 'assets/styles/*.scss'",

0 commit comments

Comments
 (0)