PDA

View Full Version : Dynamically change data-identifier for a like btn



taverngames
06-21-2014, 12:31 PM
Hello!

I've bought the VIP version of the Like Btn and I'd like to do the following:

- I have one like button on my page - it's going to be displayed in a lightbox:


<p id="likebtn" class="likebtn-wrapper" data-style="drop" data-lang="auto" data-dislike_enabled="false" data-icon_dislike_show="false" data-identifier="setfromjs" data-unlike_allowed="true" data-popup_position="bottom" data-popup_enabled="false" style="margin-top:30px"></p>
<script type="text/javascript" src="//w.likebtn.com/js/w/widget.js" async="async"></script>

- I'm changing the data-identifier according to the item currently displayed in the lightbox (data-identifier="item10" etc)

- The problem is that the code doesn't take into consideration that the data-identifier was changed dynamically. So regardless of the data-identifier, it's the same like for all items.

---

So is there a way to get this to work? Without having to create ~50 like buttons - one for each item I'd like to display in the lightbox?

Thank you in advance!

LikeBtn
06-21-2014, 06:33 PM
Call the following function every time you change identifier:

if (typeof(LikeBtn) != "undefined") {
LikeBtn.init();
}


http://likebtn.com/en/faq#ajax

taverngames
06-21-2014, 07:17 PM
Thank you for your reply! But unfortunately that's not working for me.

I have the following code:


$( "#likebtn" ).attr( "data-identifier", "item" + item.index );

if (typeof(LikeBtn) != "undefined") {
console.log("asd init"); // I can see this in the web console
LikeBtn.init();
}

I can also see with the inspector that the data-identifier is changed properly.

What else could I try? Or why wouldn't it work?

I've also tried
$( "#likebtn" ).init();

Thank you!

LikeBtn
06-22-2014, 05:30 AM
Could you please provide a link to the page or send it to support@likebtn.com

taverngames
06-22-2014, 08:06 AM
Ok, thank you! I've sent an email because the page isn't officially launched yet.

LikeBtn
06-23-2014, 07:05 AM
You need to do the following:
1) Remove current Like Button: $("#likebtn").remove();
2) Insert the code of the Like Button with the new identifier.
3) Initialize the button:

if (typeof(LikeBtn) != "undefined") {
LikeBtn.init();
}

taverngames
06-23-2014, 11:30 AM
It works! Thank you very much for your help!

adam5
01-07-2016, 12:09 PM
Hello, I'm trying to do this in PHP using this approach...

First, in the PHP file for the page itself, I set a variable with the name:
<?php $button_unique_identifier = "this_button_name"; >

And then use it in the <span> like this:
<!-- LikeBtn.com BEGIN -->
<span class="likebtn-wrapper" data-theme="greenred" data-i18n_like=" Like" data-identifier="<?php $button_unique_identifier; ?>" data-show_like_label="false" data-counter_zero_show="true" data-popup_disabled="true" data-site_id="568df3b47d9c0c711b4c05a2"></span>
<script>(function(d,e,s){if(d.getElementById("likebtn_wjs"))return;a=d.createElement(e);m=d.getElementsByTag Name(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode.insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script>
<!-- LikeBtn.com END -->

When I inspect the code, it shows that the value of data_identifier is "". Is it a mistake in my PHP or does the button not allow this? Thanks.

support
01-08-2016, 10:12 AM
Hello,

Try to use the following code:

<!-- LikeBtn.com BEGIN -->
<span class="likebtn-wrapper" data-theme="greenred" data-i18n_like=" Like" data-identifier="item_1" data-show_like_label="false" data-counter_zero_show="true" data-popup_disabled="true" data-site_id="568df3b47d9c0c711b4c05a2"></span>
<script>(function(d,e,s){if(d.getElementById("like btn_wjs"))return;a=d.createElement(e);m=d.getEleme ntsByTagName(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode .insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script>
<!-- LikeBtn.com END -->

Also you can add like button to your website using shortcode: https://likebtn.com/en/wordpress-like-button-plugin.

adam5
01-09-2016, 12:31 AM
Figured out the problem, I just had a problem with the PHP within the LikeBtn code. Rather than using ="<?php $button_unique_identifier; ?>" I should have been using ="<?php echo $button_unique_identifier; ?>". It works great now. Thanks!


Hello, I'm trying to do this in PHP using this approach...

First, in the PHP file for the page itself, I set a variable with the name:
<?php $button_unique_identifier = "this_button_name"; >

And then use it in the <span> like this:
<!-- LikeBtn.com BEGIN -->
<span class="likebtn-wrapper" data-theme="greenred" data-i18n_like=" Like" data-identifier="<?php $button_unique_identifier; ?>" data-show_like_label="false" data-counter_zero_show="true" data-popup_disabled="true" data-site_id="568df3b47d9c0c711b4c05a2"></span>
<script>(function(d,e,s){if(d.getElementById("likebtn_wjs"))return;a=d.createElement(e);m=d.getElementsByTag Name(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode.insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script>
<!-- LikeBtn.com END -->

When I inspect the code, it shows that the value of data_identifier is "". Is it a mistake in my PHP or does the button not allow this? Thanks.

support
01-09-2016, 06:08 AM
Welcome!