Option to keep existing content instead of replacing content for count.js

[frisi]

trafficstars

Search Terms

count.js, coral-count

Suggestion

problem

currently count.js will replace the span marked with coral-count https://docs.coralproject.net/coral/v5/integrating/counts/

example:

<span class="coral-count" data-coral-url="http://example.com/blog-entry-1/"><span>hey there!</span></span>

will be replaced with

<span class="coral-count" data-coral-url="http://example.com/blog-entry-1/">
   <span class="coral-count-number">5</span>
  <span class="coral-count-text">Comments</span>
</span>

new proposal

a new data-coral-include="prepend" attribute could tell count.js to keep the exiting markup within the span and prepend or append the count data:

<span class="coral-count" data-coral-include="append" data-coral-url="http://example.com/blog-entry-1/"><span>hey there!</span></span>

would be replaced with

<span class="coral-count" data-coral-include="append" data-coral-url="http://example.com/blog-entry-1/">
  <span>hey there!</span>
   <span class="coral-count-number">5</span>
  <span class="coral-count-text">Comments</span>
</span>

Use Cases

if you have custom markup that should only be visible if there is a certain number of comments for an article you're currently lost.

example this div with an icon having the number of count as a badge should only be rendered for count>0

a workaround is to add it using css ::before (but this is limited to background images and simple text)