added views icon and some alignment changes and code refactoring

This commit is contained in:
Bangara Raju Kottedi 2023-08-20 23:41:31 +05:30
parent 8d08147c91
commit fd8c860d35
2 changed files with 86 additions and 86 deletions

View File

@ -1,36 +1,32 @@
<em id="postvisitcounter"> <i class="fa fa-eye fa-fw me-1" {% if include.tooltip %} title="{{site.data.locales[include.lang].post.views}}"
data-bs-toggle="tooltip" data-bs-placement="bottom" {% endif %}></i>
<em id="visit-count">
</em> </em>
<!-- <script defer>
function postvisits(response) {
document.getElementById('postvisitcounter').innerText = response.value;
}
</script>
<script async src="http://localhost:5016/GetCounter/test?callback=postvisits"></script> -->
<script> <script>
function ajax(url) { document.getElementById("postvisitcounter").style.visibility = "hidden";
return new Promise(function(resolve, reject) { function ajax(url) {
var xhr = new XMLHttpRequest(); return new Promise(function (resolve, reject) {
xhr.onload = function() { var xhr = new XMLHttpRequest();
resolve(this.responseText); xhr.onload = function () {
}; resolve(this.responseText);
xhr.onerror = reject; };
xhr.open('GET', url); xhr.onerror = reject;
xhr.send(); xhr.open('GET', url);
}); xhr.send();
} });
}
var siteId = "{{ site.id }}"; var siteId = "{{ site.id }}";
var postId = "{{ page.title }}"; var postId = "{{ page.title }}";
ajax("{{site.custom-config.blog-services.service_url}}/GetPostViews?siteId="+ siteId + "&postId=" + postId) ajax("{{site.custom-config.blog-services.service_url}}/GetPostViews?siteId=" + siteId + "&postId=" + postId)
.then(function(result) { .then(function (result) {
console.log(result); // Code depending on result console.log(result); // Code depending on result
document.getElementById('postvisitcounter').innerText = result; document.getElementById('visit-count').innerText = result;
}) document.getElementById("postvisitcounter").style.visibility = "visible";
.catch(function() { })
// An error occurred .catch(function () {
}); // An error occurred
});
</script> </script>

View File

@ -2,11 +2,11 @@
layout: page layout: page
refactor: true refactor: true
panel_includes: panel_includes:
- toc - toc
tail_includes: tail_includes:
- related-posts - related-posts
- post-nav - post-nav
- comments - comments
--- ---
{% include lang.html %} {% include lang.html %}
@ -14,65 +14,70 @@ tail_includes:
<h1 data-toc-skip>{{ page.title }}</h1> <h1 data-toc-skip>{{ page.title }}</h1>
<div class="post-meta text-muted"> <div class="post-meta text-muted">
<!-- published date -->
<span>
{{ site.data.locales[lang].post.posted }}
{% include datetime.html date=page.date tooltip=true lang=lang %}
</span>
<!-- lastmod date --> <div class="d-flex justify-content-between">
{% if page.last_modified_at and page.last_modified_at != page.date %} <div>
<span> <!-- published date -->
{{ site.data.locales[lang].post.updated }} <span>
{% include datetime.html date=page.last_modified_at tooltip=true lang=lang %} {{ site.data.locales[lang].post.posted }}
</span> {% include datetime.html date=page.date tooltip=true lang=lang %}
{% endif %} </span>
<!-- lastmod date -->
{% if page.last_modified_at and page.last_modified_at != page.date %}
<span>
{{ site.data.locales[lang].post.updated }}
{% include datetime.html date=page.last_modified_at tooltip=true lang=lang %}
</span>
{% endif %}
</div>
<!-- post counter --> <!-- post counter -->
<span> <div id="postvisitcounter">
{{ site.data.locales[lang].post.views }} <!-- {{ site.data.locales[lang].post.views }} -->
{% include post-counter.html %} {% include post-counter.html tooltip=true lang=lang %}
</span> </div>
</div>
{% if page.image %} {% if page.image %}
{% capture src %}src="{{ page.image.path | default: page.image }}"{% endcapture %} {% capture src %}src="{{ page.image.path | default: page.image }}"{% endcapture %}
{% capture class %}class="preview-img{% if page.image.no_bg %}{{ ' no-bg' }}{% endif %}"{% endcapture %} {% capture class %}class="preview-img{% if page.image.no_bg %}{{ ' no-bg' }}{% endif %}"{% endcapture %}
{% capture alt %}alt="{{ page.image.alt | xml_escape | default: "Preview Image" }}"{% endcapture %} {% capture alt %}alt="{{ page.image.alt | xml_escape | default: "Preview Image" }}"{% endcapture %}
{% capture lqip %} {% capture lqip %}
{% if page.image.lqip %} {% if page.image.lqip %}
lqip="{{ page.image.lqip }}" lqip="{{ page.image.lqip }}"
{% endif %} {% endif %}
{% endcapture %} {% endcapture %}
<div class="mt-3 mb-3"> <div class="mt-3 mb-3">
<img {{ src }} {{ class }} {{ alt }} w="1200" h="630" {{ lqip | strip }}> <img {{ src }} {{ class }} {{ alt }} w="1200" h="630" {{ lqip | strip }}>
{%- if page.image.alt -%} {%- if page.image.alt -%}
<figcaption class="text-center pt-2 pb-2">{{ page.image.alt }}</figcaption> <figcaption class="text-center pt-2 pb-2">{{ page.image.alt }}</figcaption>
{%- endif -%} {%- endif -%}
</div> </div>
{% endif %} {% endif %}
<div class="d-flex justify-content-between"> <div class="d-flex justify-content-between">
<!-- author(s) --> <!-- author(s) -->
<span> <span>
{% if page.author %} {% if page.author %}
{% assign authors = page.author %} {% assign authors = page.author %}
{% elsif page.authors %} {% elsif page.authors %}
{% assign authors = page.authors %} {% assign authors = page.authors %}
{% endif %} {% endif %}
{{ site.data.locales[lang].post.written_by }} {{ site.data.locales[lang].post.written_by }}
<em> <em>
{% if authors %} {% if authors %}
{% for author in authors %} {% for author in authors %}
<a href="{{ site.data.authors[author].url }}">{{ site.data.authors[author].name }}</a> <a href="{{ site.data.authors[author].url }}">{{ site.data.authors[author].name }}</a>
{% unless forloop.last %}</em>, <em>{% endunless %} {% unless forloop.last %}</em>, <em>{% endunless %}
{% endfor %} {% endfor %}
{% else %} {% else %}
<a href="{{ site.social.links[0] }}">{{ site.social.name }}</a> <a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>
{% endif %} {% endif %}
</em> </em>
</span> </span>
@ -96,8 +101,8 @@ tail_includes:
<div class="post-meta mb-3"> <div class="post-meta mb-3">
<i class="far fa-folder-open fa-fw me-1"></i> <i class="far fa-folder-open fa-fw me-1"></i>
{% for category in page.categories %} {% for category in page.categories %}
<a href='{{ site.baseurl }}/categories/{{ category | slugify | url_encode }}/'>{{ category }}</a> <a href='{{ site.baseurl }}/categories/{{ category | slugify | url_encode }}/'>{{ category }}</a>
{%- unless forloop.last -%}, {%- endunless -%} {%- unless forloop.last -%}, {%- endunless -%}
{% endfor %} {% endfor %}
</div> </div>
{% endif %} {% endif %}
@ -106,12 +111,11 @@ tail_includes:
{% if page.tags.size > 0 %} {% if page.tags.size > 0 %}
<div class="post-tags"> <div class="post-tags">
<i class="fa fa-tags fa-fw me-1"></i> <i class="fa fa-tags fa-fw me-1"></i>
{% for tag in page.tags %} {% for tag in page.tags %}
<a href="{{ site.baseurl }}/tags/{{ tag | slugify | url_encode }}/" <a href="{{ site.baseurl }}/tags/{{ tag | slugify | url_encode }}/" class="post-tag no-text-decoration">
class="post-tag no-text-decoration" > {{- tag -}}
{{- tag -}} </a>
</a> {% endfor %}
{% endfor %}
</div> </div>
{% endif %} {% endif %}
@ -121,13 +125,13 @@ tail_includes:
{% if site.data.locales[lang].copyright.license.template %} {% if site.data.locales[lang].copyright.license.template %}
{% capture _replacement %} {% capture _replacement %}
<a href="{{ site.data.locales[lang].copyright.license.link }}"> <a href="{{ site.data.locales[lang].copyright.license.link }}">
{{ site.data.locales[lang].copyright.license.name }} {{ site.data.locales[lang].copyright.license.name }}
</a> </a>
{% endcapture %} {% endcapture %}
{{ site.data.locales[lang].copyright.license.template | replace: ':LICENSE_NAME', _replacement }} {{ site.data.locales[lang].copyright.license.template | replace: ':LICENSE_NAME', _replacement }}
{% endif %} {% endif %}
</div> </div>
@ -136,4 +140,4 @@ tail_includes:
</div><!-- .post-tail-bottom --> </div><!-- .post-tail-bottom -->
</div><!-- div.post-tail-wrapper --> </div><!-- div.post-tail-wrapper -->