Hello, I install the fancybox plugins, if I apply Pagination enabled with manual or automatic transition and AJAX, the fancybox function can only be worked on the first page. If I apply the Pagination enabled with manual transition and page reload, fancybox can work on every page, any solution that I can apply the AJAX?
I am setting this ticket as waiting for a response until you provide us with a copy of your website to check why is the Fancybox not working for youtube videos after paginating the view with AJAX.
Dear Jamal,
Please enable the private message for me, so that I can provide the login credential.
Of course. Your next reply will be private to let you share credentials safely. ** Make a database backup before sharing credentials. **
It seems that we can fix the fancybox issue on Youtube videos by adding the class "iframe" to the <a> tag handler.
But, I encountered another issue. Check this screenshot hidden link
Refused to display '<em><u>hidden link</u></em>' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
I think that it has something to do with server security. I wanted to add custom code to update that, but the server security does not allow me to update files.
add_filter('allowed_http_origins', 'add_allowed_origins');
function add_allowed_origins($origins) {
$origins[] = '<em><u>hidden link</u></em>';
return $origins;
}
As I explained while having the chat, I'll need to take a copy of your website and test it against our servers, this will let us check if it is a server related issue, and at the same time, it will be needed if I can't find a solution and I had to escalate this ticket. Please let me know if I can take a copy.
I remember that we have fixed the fancy box for images while in chat. Is that correct or are you having troubles with image fancyboxes too? If yes, please let me know exactly what posts to test with, If you can record a screencast of your tests that would be great.
Dear Jamal,
I duplicated the production site to this dev.vwcm.hk, you can feel free to test it. Or you need me to duplicate the site and send you the image? Please advise what I should do.
Best regards,
Kelvin.
I just wanted your approval to take a copy of your website. As you are willing to provide one, I am already running a migration of this website to our online platform. I'll let you know what I will find.
Dear Jamal,
Sure, please feel free to duplicate it, once finished, please delete the source is fine.
best regards,
Kelvin.
Of course, I'll delete the migrated site once we fix this issue. hidden link
Let me escalate this issue to our 2nd Tier for further assistance. I'll get back to you as soon as possible.
It seems that the AJAX calls changes the referrer of the page to the full URL of the page instead of the site URL which creates an issue when the strict policy for same-origin requests is enabled.
As a workaround, we need to change the URLs of the videos to a less restricted URL. According to this article we need to use the /embed/ endpoint for the URL hidden link
So I suggest one of the following solutions:
- Changing the URL in the browser using Javascript by adding the following code to the view:
jQuery(function($){
$('.fancybox-youtube').each(function(){
var $this = $(this);
var url = $this.attr('href');
if ( /https:\/\/youtu.be\//.test(url) ) {
$this.attr('href', url.replace('<em><u>hidden link</u></em>','<em><u>hidden link</u></em>'))
}
$this.fancybox();
})
});
-Changing the URL in the server, by wrapping the URL shortcode inside a custom shortcode "youtube". Add the following code to your theme's functions.php file:
add_shortcode('youtube', function ($atts = [], $content = null) {
$output = str_replace( '<em><u>hidden link</u></em>', '<em><u>hidden link</u></em>', $content );
return $output;
});
Then wrap the shortcode in the view's content template:
<a target="_blank" class="fancybox-youtube iframe " href="[youtube][types field='recording-url' output='raw'][/types][/youtube]" rel="noopener noreferrer"><i class="fa fa-video-camera" aria-hidden="true"></i></a>
You can check the second solution on the migrated site hidden link
Let me know once you implement it in your live site so I can delete the migrated site.
Dear Jamal,
Sorry for my late review of this ticket. As the site was cracked, I think I will continue this after this ticket be solved. https://toolset.com/forums/topic/unserialize-error-at-offset-error-message-from-wp-content-plugins-types/
