Skip Navigation

[Resolved] Javascript on custom archive

This thread is resolved. Here is a description of the problem and solution.

Problem:

have a custom archive type and I'm adapting it. I wanted the article layout to match the theme and I managed to do that.

However, I'm having a problem with the "heart" (like) under each article.

The "heart" comes "red" when I like the post post, as it should. However, if I refresh the page it reverts to "unliked" mode - white heart. I have attached a screenshot of it.

I have this html code in the page which I have copied from the theme and just adding the custom elements that I needed.

Solution:

It needs some custom PHP codes, for example you can try these:
1) Add below codes into your theme/functions.php:

function user_liked_post(){
    $post_id = get_the_ID();
    $res = penci_AlreadyLiked( $post_id );
    return $res;
}

2) Dashboard-> Toolset-> Settings-> Front-end Content

option "Functions inside conditional evaluations", fill above custom PHP function name: user_liked_post

3) Edit the wordpress archive "Categories, Tags": ID 1787
Edit this line from:

<a class="penci-post-like" ...

To:

<a class="penci-post-like [wpv-conditional if="user_liked_post()"]liked[/wpv-conditional]" ...

Relevant Documentation:

This support ticket is created 6 years, 11 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

This topic contains 16 replies, has 2 voices.

Last updated by Luo Yang 6 years, 10 months ago.

Assisted by: Luo Yang.

Author
Posts
#611370
Screen Shot 2018-01-31 at 10.02.36.png

Hello,

I have a custom archive type and I'm adapting it. I wanted the article layout to match the theme and I managed to do that.

However, I'm having a problem with the "heart" (like) under each article.

The "heart" comes "red" when I like the post post, as it should. However, if I refresh the page it reverts to "unliked" mode - white heart. I have attached a screenshot of it.

I have this html code in the page which I have copied from the theme and just adding the custom elements that I needed.

Would you be able to help me?

<a class="penci-post-like" data-post_id="[wpv-post-id]" title="Like" data-like="Like" data-unlike="Unlike"><i class="fa fa-heart-o"></i><span class="dt-share">0</span></a>

Do I need to add some javascript to the custom archive?

Note: This worked fine with the theme, but it's not working with the custom archive.

Thanks.

#611623

Dear Jorge,

It seems to be a compatibility problem, please provide detail steps to duplicate same problem:
1) How do you setup the "heart" (like), is it a custom field? if it is created with other plugin/theme, please provide a downloadable URL for it
2) How do you setup the custom archive? Are you using Views wordpress archive to setup it? if it is, please take a screenshot for it.

I need to duplicate same problem and debug it in my localhost, thannks

#611686
Screen Shot 2018-02-01 at 09.17.01.png

Hi Luo,

Thanks for the reply.

1) How do you setup the "heart" (like), is it a custom field? if it is created with other plugin/theme, please provide a downloadable URL for it

This comes as default in the theme and I just grabbed the code from the theme and added it to my custom wordpress archive. Original theme is here: hidden link

2) How do you setup the custom archive? Are you using Views wordpress archive to setup it? if it is, please take a screenshot for it.

I'm using a wordpress archive template.

I'm happy to give you access to the site if it makes it easier.

Thanks.

#611699

So it is a compatibility problem between your theme and Views wordpress archive, please provide a copy of your website, also point out the problem page URL and layout URL, I need to test and debug it in my localhost, thanks
https://toolset.com/faq/provide-supporters-copy-site/
You can put it into your own google drive disk, and share the link in the "private detail box", I need to duplicate same problem and debug it in my localhost, thanks

#611715

Please provide the file installer.php too, then update this thread, thanks

#611718

Sorry. I've added the installer link.

Thanks.

#612049

I am downloading the files, will feedback if there is anything found.

#612053

It needs some custom PHP codes, for example you can try these:
1) Add below codes into your theme/functions.php:

function user_liked_post(){
	$post_id = get_the_ID();
	$res = penci_AlreadyLiked( $post_id );
	return $res;
}

2) Dashboard-> Toolset-> Settings-> Front-end Content
option "Functions inside conditional evaluations", fill above custom PHP function name: user_liked_post

3) Edit the wordpress archive "Categories, Tags": ID 1787
Edit this line from:

<a class="penci-post-like" ...

To:

<a class="penci-post-like [wpv-conditional if="user_liked_post()"]liked[/wpv-conditional]" ...
#612109
Screen Shot 2018-02-02 at 09.25.15.png

Hi Luo,

Thanks for the reply.

I have tried that and it doesn't work. It is still not keeping the likes. As soon as I refresh the page it goes away.

I have this code now:

<a class="penci-post-like [wpv-conditional if="user_liked_post()"]liked[/wpv-conditional]" data-post_id="[wpv-post-id]" title="Unlike" data-like="Like" data-unlike="Unlike"><i class="fa fa-heart-o"></i><span class="dt-share">0</span></a>

The "liked" word is in red, which usually means that something is wrong with the code (see screenshot).

UPDATE: I have removed the inverted commas and the "red" liked error is gone. I now have:

<a class="penci-post-like" [wpv-conditional if="user_liked_post()"]liked[/wpv-conditional] data-post_id="[wpv-post-id]" title="Unlike" data-like="Like" data-unlike="Unlike"><i class="fa fa-heart-o"></i><span class="dt-share">0</span></a>

However, it is still not working..

Thanks.

#612617

It works fine in my localhost with your duplicator package, please a test site, and fill below private detail box with login details and FTP access, also point out where I can edit you PHP codes, I need a live website to test and debug, thanks

#613101

I tried the credential you provided above, it is not valid, I get this error:
ERRO: A senha que inseriu para o nome de utilizador toolse***17 está incorrecta.

Please check it, you can update it here:
https://toolset.com/forums/topic/javascript-on-custom-archive/#post-612666

#613674

Hi Luo,

Sorry about that.

I have updated the details. Could you please also make sure you remove the reference to the username mentioned above in the public message?

Thanks for your help.

#614025

Thanks for the details, I tried it in your website with steps as I mentioned above:
https://toolset.com/forums/topic/javascript-on-custom-archive/#post-612053

It works fine, see the pages here:
hidden link
hidden link

And the username has been modified as your request.

#614134
Screen Shot 2018-02-08 at 09.21.49.png

Hi Luo,

I've just tested it and I can see two problems:

1- I got an error at the top of the page showing weird numbers: "329732463230328132883163300229873196318229673190814
"
2 - It's not working on the home page.

Thanks.

#614153

1) I got an error at the top of the page showing weird numbers:
That is the PHP codes I added for debug, I have reversed it back:
from:
echo $post_id = get_the_ID();
To
$post_id = get_the_ID();

2) It's not working on the home page.
That means your home page is using another wordpress archive,
Dashboard-> Toolset-> WordPress Archive
Edit "Home/Blog", ID 1771, in section "Loop item in Home/Blog"
Then apply same change as I mentioned above:
https://toolset.com/forums/topic/javascript-on-custom-archive/#post-612053
step 2) Edit this line from ...