Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Can you put your excerpt under your Blog Post Page Title?


Rendy

Question

  • Answers 2
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

You can take advantage of the meta tag to get the excerpt content, paste this into Settings->Advanced->Code Injection <script> document.addEventListener('DOMContentLoaded', function()

Posted Images

2 answers to this question

Recommended Posts

  • 0
On 5/6/2021 at 9:31 AM, Rendy said:

Site URL: https://www.rendyreviews.com/movie-reviews/mortal-kombat-review

Hi,

I wanted to know if there's a way I can inject CSS to put like an excerpt under the blog post title before it proceeds my reviews in order to make it look professional. 

Make it look like similar to this in some way.

Screen Shot 2021-05-05 at 10.28.43 PM.png

You can take advantage of the meta tag to get the excerpt content, paste this into Settings->Advanced->Code Injection

<script>
document.addEventListener('DOMContentLoaded', function() {
    var element = document.querySelector('.BlogItem-title');
  	if (!element) {
    	return;
    }
    var newElement = document.createElement('h2');
    newElement.style.order = 2;
    newElement.className = "BlogItem-excerpt";
    newElement.innerHTML = document.querySelector('[property="og:description"]').getAttribute("content");
    var elementParent = element.parentNode;

    elementParent.insertBefore(newElement, element.nextSibling);
});
</script>

Target it as class name BlogItem-excerpt to style it. Btw, you made a great job with the blog, I hardly notice it was created in Squarespace

image.thumb.png.e868880f14d57203a84f9563ef77993d.png

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post
  • 0
On 5/9/2021 at 11:03 PM, bangank36 said:

<script> document.addEventListener('DOMContentLoaded', function() { var element = document.querySelector('.BlogItem-title'); if (!element) { return; } var newElement = document.createElement('h2'); newElement.style.order = 2; newElement.className = "BlogItem-excerpt"; newElement.innerHTML = document.querySelector('[property="og:description"]').getAttribute("content"); var elementParent = element.parentNode; elementParent.insertBefore(newElement, element.nextSibling); }); </script>

Oh my gosh, thank you.

Now additional question. Is there a way I can also add my share code to the under the header/excerpt instead of having to inject it into my reviews via the code block.

This is the code:

Thank you.

<!-- ShareThis BEGIN --><div class="sharethis-inline-share-buttons"></div><!-- ShareThis END -->

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...