Pull in Bookmarks into {{#get...?

Themes
1

Hello! I’ve searched and figured this might be easier to ask in the forum!

Is it possible to have the {{#get}} function pull in a kg-bookmark-publisher element if a post has it? For example, I have:

  {{#get "posts" limit="4" filter="tag:news" include="tags"}}
        {{#foreach posts visibility="all"}}
        <div class="col-xl-4 col-lg-5 f-left">
            <article class="post post-compact post-large{{#if feature_image}} has-img{{/if}}">
                <a href="{{url}}" aria-label="{{title}}" class="overlay-link"></a>
                <div class="post-content">
                    {{#if kg-bookmark-content}}
                    <span class="kg-bookmark-publisher">
                        {{kg-bookmark-publisher}}
                        </span>
                    {{/if}}
                    {{#primary_tag}}
                    <div class="tag-wrap">
                        <a href="{{url}}" class="tag tag-pill tc-{{slug}}">{{name}}</a>
                    </div>
                    {{/primary_tag}}
                    <h2 class="post-title h4">{{title}}</h2>
                </div>
            </article>
        </div>
        {{/foreach}}
    </div>
{{/get}}

Is this something that is even possible? Thanks so much!

2

Hi @wej023,
It is not possible. kg-bookmark-content is not a function. You can do using script.

Thanks

3

Thanks for the help on this! Is there any resource you could point me in the direction of? Thanks so much!

4

Hi @wej023,
Yes, I can give you resource but at first I have to what you exactly need.

Thanks

5

I’ve not used the bookmark-card much - so this is mostly guess-work :slight_smile:

I seems to me from a brief grep of the Casper theme that the kb-bookmark-xxx HTML is generated on the back-end and included in the Posts {{content}}.

This would indicate that the best way to access the data might be to include the {{content}} in a hidden div, and then use jQuery to extract the information you want, rewrite the innerHTML and display the element.

Something like (untested!):

<div class="post-content">
  <div class="my-post-html" style="display:none;">{{content}}</div>
  {{#primary_tag}}
  <div class="tag-wrap">
      <a href="{{url}}" class="tag tag-pill tc-{{slug}}">{{name}}</a>
  </div>
  {{/primary_tag}}
  <h2 class="post-title h4">{{title}}</h2>
</div>

and then in your code-injection (site/page etc):

<script type='text/javascript'>
  $(document).ready(function(){
    $('div.my-post-html').each( function() {
      let my_author = $(this).find('span.kg-bookmark-author').html()
      if ( my_author ) {
        $(this).html( my_author );      
        $(this).show();
      }
    })
  })
</script>

Not sure how performant that is going to be :octopus: