I'm using the latest version of the STOREFRONT template. In the HEAD of the site the Open Grapgh tags are automatically called, but the OG: IMAGE tag does not work.
Facebook Open Graph do not owrk properly
This problem is for all the website pages. You can try here: https://www.calabriatours.org/destinations/le-castella.html
The image doesn't work properly. And if you look the HTML code you find that the OPEN GRAPH OG:IMAGE tag is MISSING on the page (see image attached).
Have only 1 plugin (BT SOCIAL SHARE) that work properly and call paroperly OG:IMAGE tag for all my webpages, but its simple and i want to change it.
Thanks for your help
- Edited
Joomla Backend
[edited by moderator]
angelino
Hi,
It will take the fulltext image of article to show in og:image tag
I check the article above: https://www.calabriatours.org/destinations/le-castella.html and see that it did not have fulltext image, I just tried to add and the og:image tag is showing now.
Kindly check.
Yes Sir, but i can't add for all my articles a fulltext image.
I think that the STOREFRONT TEMPLATE must be set properly for INTROTEXT image also
It would be advisable for the template to take the first image inserted in the text of the article, regardless of the fulltext and introtext fields, is it possible? can I set something in joomla to solve this problem?
Thanks
angelino Hi. It actually takes it from joomla parameters.
But I believe it can be overwritten by using this script added to /layouts/blocks/head.php
<script type=“text/javascript">(function($) {$(document).ready(function() {
if( $('.itemBody img')>0 ){
$('head').append(('<meta property="og:image" content="'+$('.itemBody img').attr('src')+'" />');
}
});})(jQuery)</script>I try add this script on HEAD.PHP file of template, but do not work
I think the problem is to find on : /templates/gk_storefront/html/com_content/article/default.php
don't work properly OG:IMAGE and OG
ESCRIPTION tag
Please add it and make sure to disable cache (or clear it). Code needs to be present on the page so I will be able to check if it does what it should and adjust it for other metatags.Hello Sir, the code was added and the cache disabled (the website do not use it).
Please, tell-me if you can help me, thanks
angelino Hi. I can see the issue in my code. Please use this one instead:
<script type=“text/javascript">(function($) {$(document).ready(function() {
if( $('.itemBody img').size()>0 ){
$('head').append(('<meta property="og:image" content="'+$('.itemBody img').attr('src')+'" />');
}
});})(jQuery)</script>Hello Sir, unfortunately this doesn't seem to work either. I would like to understand where I have to enter it, if in a precise position on the page.
perhaps it should be inserted in the page /templates/gk_storefront/html/com_content/article/default.php ?
Thank you
Ok the code has been removed, now the original tepmlate file is back
angelino Hi. I've worked with the code and looks like og:image is appearing in code now.
a script I used is at the end of /layout/blocks/head.php
<script>(function($) {$(document).ready(function() {
if( $('.itemBody').size()>0 ){
$('head').append('<meta property="og:image" content="'+$('.itemBody img').attr('src')+'" />');
}
});})(jQuery)</script>Sorry my friend, but this code dont work properly. The OG:image tag do not appear!
I noticed that the problem concerns JOOMLA (sigh!).
The problem should be resolved in the file .../html/com_content/article/default.php
I found this tutorial : https://www.collectiveray.com/joomla/joomla-tutorials/add-facebook-open-graph-and-twitter-cards-to-joomla.html#h2-1-1-joomla-open-graph-tags-create-a-template-override-for-articles
and implemented it in my template. Unfortunately the problem is not solved because the script does not work with the images inserted in the content of the articles. But I think it's a good starting point.
thanks