facebook integratie: static gedeelte
This commit is contained in:
parent
f1311d3fa1
commit
9608f4a78b
|
@ -30,10 +30,6 @@ Bak ze!
|
|||
|
||||
[Wouter](/about).
|
||||
|
||||
<span class="smaller">
|
||||
Deze website gebruikt [anonieme IP](https://support.google.com/analytics/answer/2763052?hl=en)-gegevens in de vorm van Google Analytics om websiteverkeer beter op te kunnen volgen.
|
||||
</span>
|
||||
|
||||
[1]: https://redzuurdesem.be/wp-content/uploads/2012/06/693ef7d02022750cb1a7dae6eb7d1cf5_large.jpg
|
||||
[2]: https://redzuurdesem.be/wp-content/uploads/2012/06/photo-full.jpg
|
||||
[3]: https://redzuurdesem.be/wp-content/uploads/2012/06/16118a75dafdc72174fc6ca3a2d545b1_large.jpg
|
|
@ -11,6 +11,7 @@
|
|||
</h1>
|
||||
</section>
|
||||
|
||||
<!-- BLOCK: boek reclame -->
|
||||
<div class='post'>
|
||||
<article class='post_content'>
|
||||
<h3>Nu beschikbaar:</h3>
|
||||
|
@ -27,8 +28,9 @@
|
|||
</div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<!-- BLOCK: blogposts -->
|
||||
<div class = 'post post_content'>
|
||||
<h1>
|
||||
<a href="/post">Laatste blogposts</a> »
|
||||
|
@ -46,7 +48,7 @@
|
|||
</div>
|
||||
<hr/>
|
||||
|
||||
|
||||
<!-- BLOCK: content -->
|
||||
<div class = 'post'>
|
||||
<article class='post_content'>
|
||||
{{- .Content }}
|
||||
|
@ -54,5 +56,31 @@
|
|||
</div>
|
||||
<hr/>
|
||||
|
||||
<!-- BLOCK: facebook posts -->
|
||||
<div class='post post_content'>
|
||||
<h1>
|
||||
<a href="https://facebook.com/redzuurdesem">Facebook posts</a> »
|
||||
</h1>
|
||||
</div>
|
||||
<ul class='posts wrap' id = 'posts'>
|
||||
<li class = 'post_item'>
|
||||
<div class="fb-post" data-href="https://www.facebook.com/redzuurdesem/posts/3067948703326127"></div>
|
||||
</li>
|
||||
<li class = 'post_item'>
|
||||
<div class="fb-post" data-href="https://www.facebook.com/redzuurdesem/posts/3063110147143316"></div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class = 'post post_content'>
|
||||
<h4>
|
||||
<a href="https://facebook.com/redzuurdesem">Bekijk alle Facebook posts</a> »
|
||||
</h4>
|
||||
</div>
|
||||
<hr/>
|
||||
|
||||
<div class="post post_content">
|
||||
<span class="smaller">
|
||||
Deze website gebruikt <a href="https://support.google.com/analytics/answer/2763052?hl=en" target="_blank">anonieme IP</a>-gegevens in de vorm van Google Analytics om websiteverkeer beter op te kunnen volgen.
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{{ end }}
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -1 +1 @@
|
|||
{"Target":"css/styles.cc748accb4f720f2b3a2af6453af43b23282a2d121fa64e4c1550b8e0d0986fb266584159aef3adcd51e4f3c4002e2849a9fbe7c613451d4525d6f84f3139f7d.css","MediaType":"text/css","Data":{"Integrity":"sha512-zHSKzLT3IPKzoq9kU69DsjKCotEh+mTkwVULjg0JhvsmZYQVmu863NUeTzxAAuKEmp++fGE0UdRSXW+E8xOffQ=="}}
|
||||
{"Target":"css/styles.cc29ef9d17ff7b447777ba718235126b008747459c4030d7933e729c05c3d54535bfa27b35706cd750fbc65451d8fd15c15ba51feed433c62558bdb8c401a7eb.css","MediaType":"text/css","Data":{"Integrity":"sha512-zCnvnRf/e0R3d7pxgjUSawCHR0WcQDDXkz5ynAXD1UU1v6J7NXBs11D7xlRR2P0VwVulH+7UM8YlWL24xAGn6w=="}}
|
|
@ -1,64 +0,0 @@
|
|||
|
||||
body {
|
||||
font-size: 14pt !important;
|
||||
}
|
||||
|
||||
#body-inner {
|
||||
margin-bottom: 0;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.boek-row button {
|
||||
border: 1px solid black;
|
||||
padding: 0.7em;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.boek-row a {
|
||||
line-height: 1.4 !important;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.boek-row button:hover {
|
||||
background: black;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.boek-col-left {
|
||||
float: left;
|
||||
width: 45%;
|
||||
vertical-align: center;
|
||||
text-align: center;
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.boek-col-right {
|
||||
float: right;
|
||||
width: 45%;
|
||||
}
|
||||
|
||||
.boek-col-right img {
|
||||
-webkit-box-shadow: 6px 6px 3px 0px rgba(0,0,0,.75);
|
||||
-moz-box-shadow: 6px 6px 3px 0px rgba(0,0,0,.75);
|
||||
box-shadow: 6px 6px 3px 0px rgba(0,0,0,.75);
|
||||
}
|
||||
|
||||
#chapter, #body .padding {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
#body, #chapter p {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.wp-caption-text {
|
||||
font-size: smaller;
|
||||
color: grey;
|
||||
}
|
||||
|
||||
.aligncenter {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
|
@ -1,98 +0,0 @@
|
|||
/* 2020-04-26: copypaste hugo-learn, fix getUrlParameter returns undefined */
|
||||
|
||||
// Get Parameters from some url
|
||||
var getUrlParameter = function getUrlParameter(sPageURL) {
|
||||
var url = sPageURL.split('?');
|
||||
var obj = {};
|
||||
if (url.length == 2) {
|
||||
var sURLVariables = url[1].split('&'),
|
||||
sParameterName,
|
||||
i;
|
||||
for (i = 0; i < sURLVariables.length; i++) {
|
||||
sParameterName = sURLVariables[i].split('=');
|
||||
obj[sParameterName[0]] = sParameterName[1];
|
||||
}
|
||||
return obj;
|
||||
} else {
|
||||
return obj;
|
||||
}
|
||||
};
|
||||
|
||||
// Execute actions on images generated from Markdown pages
|
||||
var images = $("div#body-inner img").not(".inline");
|
||||
// Wrap image inside a featherlight (to get a full size view in a popup)
|
||||
images.wrap(function(){
|
||||
var image =$(this);
|
||||
var o = getUrlParameter(image[0].src);
|
||||
var f = o['featherlight'];
|
||||
// IF featherlight is false, do not use feather light
|
||||
if (f != 'false') {
|
||||
if (!image.parent("a").length) {
|
||||
return "<a href='" + image[0].src + "' data-featherlight='image'></a>";
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Change styles, depending on parameters set to the image
|
||||
images.each(function(index){
|
||||
var image = $(this)
|
||||
var o = getUrlParameter(image[0].src);
|
||||
if (typeof o !== "undefined") {
|
||||
var h = o["height"];
|
||||
var w = o["width"];
|
||||
var c = o["classes"];
|
||||
image.css("width", function() {
|
||||
if (typeof w !== "undefined") {
|
||||
return w;
|
||||
} else {
|
||||
return "auto";
|
||||
}
|
||||
});
|
||||
image.css("height", function() {
|
||||
if (typeof h !== "undefined") {
|
||||
return h;
|
||||
} else {
|
||||
return "auto";
|
||||
}
|
||||
});
|
||||
if (typeof c !== "undefined") {
|
||||
var classes = c.split(',');
|
||||
for (i = 0; i < classes.length; i++) {
|
||||
image.addClass(classes[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Stick the top to the top of the screen when scrolling
|
||||
$(document).ready(function(){
|
||||
$("#top-bar").sticky({topSpacing:0, zIndex: 1000});
|
||||
});
|
||||
|
||||
|
||||
jQuery(document).ready(function() {
|
||||
// Add link button for every
|
||||
var text, clip = new ClipboardJS('.anchor');
|
||||
$("h1~h2,h1~h3,h1~h4,h1~h5,h1~h6").append(function(index, html){
|
||||
var element = $(this);
|
||||
var url = encodeURI(document.location.origin + document.location.pathname);
|
||||
var link = url + "#"+element[0].id;
|
||||
return " <span class='anchor' data-clipboard-text='"+link+"'>" +
|
||||
"<i class='fas fa-link fa-lg'></i>" +
|
||||
"</span>"
|
||||
;
|
||||
});
|
||||
|
||||
$(".anchor").on('mouseleave', function(e) {
|
||||
$(this).attr('aria-label', null).removeClass('tooltipped tooltipped-s tooltipped-w');
|
||||
});
|
||||
|
||||
clip.on('success', function(e) {
|
||||
e.clearSelection();
|
||||
$(e.trigger).attr('aria-label', 'Link copied to clipboard!').addClass('tooltipped tooltipped-s');
|
||||
});
|
||||
$('code.language-mermaid').each(function(index, element) {
|
||||
var content = $(element).html().replace(/&/g, '&');
|
||||
$(element).parent().replaceWith('<div class="mermaid" align="center">' + content + '</div>');
|
||||
});
|
||||
});
|
|
@ -108,7 +108,6 @@ hr
|
|||
margin: 1rem 0
|
||||
|
||||
aside
|
||||
margin-top: 4rem
|
||||
h3
|
||||
position: relative
|
||||
margin: 0 !important
|
||||
|
|
|
@ -35,7 +35,7 @@ button
|
|||
font-family: 'Signika', sans-serif
|
||||
text-transform: uppercase
|
||||
margin-top: 0.5em
|
||||
color: #4f2c16
|
||||
color: var(--title)
|
||||
text-shadow: 1px 1px 2px lightgrey
|
||||
width: 30%
|
||||
|
||||
|
|
|
@ -90,7 +90,7 @@
|
|||
font-size: 1.5em !important
|
||||
padding-top: 0 !important
|
||||
padding-bottom: 0 !important
|
||||
color: #4f2c16 !important
|
||||
color: var(--title) !important
|
||||
|
||||
&-close
|
||||
display: flex
|
||||
|
|
|
@ -18,6 +18,7 @@ html
|
|||
--bg: var(--light)
|
||||
--text: var(--dark)
|
||||
--theme: #ef7f1a
|
||||
--title: #4f2c16
|
||||
--font: 'Metropolis', sans-serif
|
||||
|
||||
@media (prefers-color-scheme: dark)
|
||||
|
|
|
@ -59,7 +59,7 @@
|
|||
[errMsg]
|
||||
other = "Sorry, there was an error with the submission!"
|
||||
[moreFrom]
|
||||
other = "Meer lezen:"
|
||||
other = "Meer lezen"
|
||||
[discard]
|
||||
other = "discard"
|
||||
[discardComment]
|
||||
|
|
|
@ -30,15 +30,31 @@
|
|||
<div class = 'post_extra'>
|
||||
{{- partial "copy" . }}
|
||||
</div>
|
||||
{{- partial "author" . }}
|
||||
</article>
|
||||
{{- if .Site.Params.Staticman }}
|
||||
{{- partial "comments" . }}
|
||||
{{- end }}
|
||||
</div>
|
||||
<hr/>
|
||||
<div class='post'>
|
||||
<aside>
|
||||
{{- partial "aside" . }}
|
||||
</aside>
|
||||
</div>
|
||||
<div class='post'>
|
||||
<article class='post_content' style="text-align: center;">
|
||||
<h3>Facebook Community »</h3>
|
||||
|
||||
<p>Hulp nodig? Klik op '<em>Berichten</em>' en laat iets achter!</p>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// https://developers.facebook.com/docs/plugins/page-plugin/ - max is 600
|
||||
var width = 600;
|
||||
var vw = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
|
||||
if(vw < 600) width = vw - 10;
|
||||
document.write('<div class="fb-page" data-width="' + vw + '" data-href="https://www.facebook.com/redzuurdesem" data-hide-cover="false" data-tabs="timeline,messages" data-show-facepile="false"></div>');
|
||||
})()
|
||||
</script>
|
||||
</article>
|
||||
</div>
|
||||
<script src = '{{ absURL "js/autosize.min.js" }}'></script>
|
||||
{{- $timeagoScr := resources.Get "js/timeago.js" | resources.ExecuteAsTemplate "js/timeago.js" . }}
|
||||
<script src = '{{ $timeagoScr.Permalink }}'></script>
|
||||
|
|
|
@ -1,9 +0,0 @@
|
|||
{{- with .Site.Params.ga_analytics }}
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id={{ . }}"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
gtag('config', '{{ . }}');
|
||||
</script>
|
||||
{{- end -}}
|
|
@ -24,7 +24,7 @@
|
|||
{{- if isset .Params "posttitle" }}
|
||||
{{ .Params.posttitle }}
|
||||
{{- else }}
|
||||
{{ i18n "moreFrom" .Site.Title }}
|
||||
{{ i18n "moreFrom" .Site.Title }} »
|
||||
{{- end }}
|
||||
<span class='pages'>({{ .Paginator.PageNumber }}/{{ .Paginator.TotalPages }})</span> »
|
||||
</h1>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<h3>{{ i18n "moreFrom" .Site.Title }}</h3>
|
||||
<h3>{{ i18n "moreFrom" .Site.Title }} »</h3>
|
||||
<ul class='posts aside'>
|
||||
{{- $kin := (where .Site.RegularPages ".Params.tags" "intersect" .Params.tags) }}
|
||||
{{- $siblings := (where $kin ".Title" "!=" .Title) }}
|
||||
|
|
|
@ -1,16 +0,0 @@
|
|||
{{- $authors := .Site.Data.authors }}
|
||||
{{- $pageAuthor := lower .Params.author }}
|
||||
{{- with $authors }}
|
||||
{{- $author := index (where . (lower "name") $pageAuthor) 0 }}
|
||||
{{ with $author }}
|
||||
<div class = 'author'>
|
||||
<a href = '{{ .url }}' target = "{{ .name }}'s profile" class = 'author_pic'>
|
||||
<img src = '{{ absURL (printf "images/%s" .photo) }}' alt = ''>
|
||||
</a>
|
||||
<div class = 'author_meta'>
|
||||
<a class = 'author_name' href = '{{ .url }}'>{{ with .fullName }}{{ . }}{{ else }}{{ .name }}{{ end }}</a>
|
||||
<p class = 'pale author_bio solo'>{{ .bio }}</p>
|
||||
</div>
|
||||
</div>
|
||||
{{- end }}
|
||||
{{- end }}
|
|
@ -1,40 +0,0 @@
|
|||
{{- $vs := .Site.Params.staticman }}
|
||||
<span class = 'form_toggle btn'>{{ i18n "comment" }}</span>
|
||||
<form class = 'form' method = 'POST'>
|
||||
<!-- Start comment form display reply target -->
|
||||
<p class='reply_notice'>
|
||||
<span class='reply_to'></span>
|
||||
</p>
|
||||
<!-- End comment form display reply target -->
|
||||
|
||||
<input type = 'hidden' class = 'form_input form_slug' name = 'options[slug]' value = '{{ md5 .File.Path }}'>
|
||||
<input type='hidden' class='form_input reply_thread' name='fields[replyThread]'>
|
||||
<input type='hidden' class='form_input reply_id' name='fields[replyId]'>
|
||||
<input type='hidden' class='form_input reply_name' name='fields[replyName]'>
|
||||
{{- with $vs.reCaptcha -}}
|
||||
<input name = 'options[reCaptcha][siteKey]' type = 'hidden' value = '{{ .sitekey }}'>
|
||||
<input name = 'options[reCaptcha][secret]' type = 'hidden' value = '{{ .secret }}'>
|
||||
{{- end -}}
|
||||
|
||||
<label class = 'form_label'>{{ i18n "name" }}</label>
|
||||
<input name = 'fields[name]' type = 'text' placeholder = '{{ i18n "name" }}' class = 'form_input form_name' required>
|
||||
<label class = 'form_label'>{{ i18n "email" }}</label>
|
||||
<input name = 'fields[email]' type = 'email' placeholder = '{{ i18n "email" }}' class = 'form_input form_email' required>
|
||||
<label class = 'form_label'>{{ i18n "comment" }}</label>
|
||||
<textarea name = 'fields[comment]' placeholder = '{{ i18n "typeInComment" }}' class = 'form_input form_comment' required></textarea>
|
||||
|
||||
{{- with $vs.reCaptcha -}}
|
||||
<div class = 'g-recaptcha' data-sitekey = '{{ .sitekey }}' data-callback='enableSubmitComment'></div>
|
||||
<script type="text/javascript">
|
||||
function enableSubmitComment(){
|
||||
document.getElementById('submitComment').disabled = false;
|
||||
}
|
||||
</script>
|
||||
<script async src = 'https://www.google.com/recaptcha/api.js'></script>
|
||||
{{- end -}}
|
||||
|
||||
<div class = 'btn_group'>
|
||||
<input type = 'submit' id = 'submitComment' value = '{{ i18n "btnSubmit" }}' class = 'btn form_submit' {{- if $vs.reCaptcha }} disabled {{- end }}>
|
||||
<div class='form_reset btn_close icon'></div>
|
||||
</div>
|
||||
</form>
|
|
@ -1,42 +0,0 @@
|
|||
<h3>Comments</h3>
|
||||
<div class = 'comments'>
|
||||
{{- $entryId := md5 .File.Path -}}
|
||||
{{ if .Site.Data.comments }}
|
||||
{{- $comments := index $.Site.Data.comments $entryId -}}
|
||||
{{ if not $comments }}
|
||||
<p>{{ i18n "noComment" }}</p>
|
||||
{{ else }}
|
||||
{{ range $comments }}
|
||||
{{ if not .replyThread }}
|
||||
{{ $.Scratch.Set "threadID" ._id }}
|
||||
<div id = '{{ ._id }}' class = 'comment'>
|
||||
<img src = 'https://www.gravatar.com/avatar/{{ .email }}?s=100' alt = 'user icon' class = 'comment_pic'>
|
||||
<div class = 'comment_meta'>
|
||||
<a href='#{{ ._id }}'><div class = 'comment_heading pale' data-time = '{{ .date }}'></div></a>
|
||||
<div class = 'comment_author comment_name'><span class="comment_name_span">{{ .name }}</span></div>
|
||||
</div>
|
||||
<p class = 'solo comment_bio pale'>{{ .comment | markdownify }}</p>
|
||||
<div class = 'comment_thread hidden'>{{ ._id }}</div>
|
||||
<div class = 'reply_btn icon'></div>
|
||||
</div>
|
||||
|
||||
{{ range $comments }}
|
||||
{{ if eq .replyThread ($.Scratch.Get "threadID") }}
|
||||
<div id = '{{ ._id }}' class = 'comment comment_reply'>
|
||||
<img src = 'https://www.gravatar.com/avatar/{{ .email }}?s=100' alt = 'user icon' class = 'comment_pic'>
|
||||
<div class = 'comment_meta'>
|
||||
<a href='#{{ ._id }}'><div class = 'comment_heading pale' data-time = '{{ .date }}'></div></a>
|
||||
<div class = 'comment_author comment_name'><span class = 'comment_name_span'>{{ .name }}</span><span> ↷ </span><a href='#{{ .replyID }}' class='reply_target'>{{ .replyName }}</a></div>
|
||||
</div>
|
||||
<p class = 'solo comment_bio pale'>{{ .comment | markdownify }}</p>
|
||||
<div class = 'comment_thread hidden'>{{ .replyThread }}</div>
|
||||
<div class = 'reply_btn icon'></div>
|
||||
</div>
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{- partial "comments-form" . }}
|
||||
</div>
|
|
@ -7,3 +7,5 @@
|
|||
{{- $mainScriptPath := "js/index.js" }}
|
||||
{{- $scripts := resources.Get $mainScriptPath | resources.ExecuteAsTemplate $mainScriptPath . | resources.Minify | resources.Fingerprint "sha512" }}
|
||||
<script src = '{{ $scripts.Permalink }}'></script>
|
||||
<div id="fb-root"></div>
|
||||
<script async defer src="https://connect.facebook.net/nl_BE/sdk.js#xfbml=1&version=v3.2"></script>
|
||||
|
|
Loading…
Reference in New Issue