Facebook Open Graph og:image on Category Pages

[b7itzz]

Hi, I have this code below implemented for our facebook open graph. Everything works except the og:image for category pages. I get this error "Provided og:image URL, was not a valid URL". I'm stuck. Any help is greatly appreciated.

<?php /* Open Graph Protocol for Facebook and SEO START */ ?>
<?php if(Mage::registry('current_product')): ?>
<?php $product = Mage::registry('current_product'); ?>
<meta property="og:title" content="<?php echo ($product->getName()); ?>" />
<meta property="og:type" content="product" />
<meta property="og:image" content="<?php echo $this->helper('catalog/image')->init($product, 'small_image')->resize(200,200);?>" />
<meta property="og:url" content="<?php echo Mage::registry('product')->getProductUrl(); ?>" />
<meta property="og:description" content="<?php echo strip_tags(($product->getShortDescription())); ?>" />
<meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php elseif(Mage::registry('current_category')): ?>
<?php $category = Mage::registry('current_category'); ?>
<meta property="og:title" content="<?php echo $this->getTitle() ?>" />
<meta property="og:type" content="product.group" />
<meta property="og:image" content="<?php echo $category->getImageUrl(); ?>" />
<meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
<meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
<meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php elseif((Mage::getSingleton('cms/page')->getIdentifier() == 'home' &&
Mage::app()->getFrontController()->getRequest()->getRouteName() == 'cms')) : ?>
<meta property="og:title" content="<?php echo $this->getTitle() ?>" />
<meta property="og:type" content="website" />
<meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
<meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
<meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php else: ?>
<meta property="og:title" content="<?php echo $this->getTitle() ?>" />
<meta property="og:type" content="article" />
<meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
<meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
<meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php endif; ?>
<?php /* Open Graph Protocol for Facebook and SEO END */ ?>

[Sinisa]

Try with:

$categoryImageUrl = Mage::getBaseUrl('media') . 'catalog/category/' . $category->getImageUrl();
<meta property="og:image" content="<?php echo $categoryImageUrl; ?>" />

[b7itzz]

Hi Sinisa,

I went ahead and added the code you suggested (see below addition in bold). However it's still saying "Provided og:image URL, was not a valid URL."

<?php /* Open Graph Protocol for Facebook and SEO START */ ?>
<?php if(Mage::registry('current_product')): ?>
 <?php $product = Mage::registry('current_product'); ?>
 <?php $categoryImageUrl = Mage::getBaseUrl('media') . 'catalog/category/' . $category->getImageUrl(); ?>
 <meta property="og:title" content="<?php echo ($product->getName()); ?>" />
 <meta property="og:type" content="product" />
 <meta property="og:image" content="<?php echo $this->helper('catalog/image')->init($product, 'small_image')->resize(200,200);?>" />
 <meta property="og:url" content="<?php echo Mage::registry('product')->getProductUrl(); ?>" />
 <meta property="og:description" content="<?php echo strip_tags(($product->getShortDescription())); ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php elseif(Mage::registry('current_category')): ?>
 <meta property="og:image" content="<?php echo $categoryImageUrl; ?>" />
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="product.group" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php elseif((Mage::getSingleton('cms/page')->getIdentifier() == 'home' &&
 Mage::app()->getFrontController()->getRequest()->getRouteName() == 'cms')) : ?>
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="website" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php else: ?>
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="article" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php endif; ?>
<?php /* Open Graph Protocol for Facebook and SEO END */ ?>

[Sinisa]

You haven't inserted it correctly.

You have to put:

<?php $categoryImageUrl = Mage::getBaseUrl('media') . 'catalog/category/' . $category->getImageUrl(); ?>

between those two lines:

<?php elseif(Mage::registry('current_category')): ?>
...here...
<meta property="og:image" content="<?php echo $categoryImageUrl; ?>" />

In your code, you moved it in first IF, so $categoryImageUrl is not visible if your code satisfies second if condition related to categories.

[b7itzz]

That was actually the first one I tried but it gave me this error.

Fatal error: Call to a member function getImageUrl() on a non-object

[Sinisa]

Somehow you've removed `<?php $category = Mage::registry('current_category'); ?>` which was in your first post. Let's try this way, try one of those two code snippets:

<?php /* Open Graph Protocol for Facebook and SEO START */ ?>
<?php if(Mage::registry('current_product')): ?>
 <?php $product = Mage::registry('current_product'); ?> 
 <meta property="og:title" content="<?php echo ($product->getName()); ?>" />
 <meta property="og:type" content="product" />
 <meta property="og:image" content="<?php echo $this->helper('catalog/image')->init($product, 'small_image')->resize(200,200);?>" />
 <meta property="og:url" content="<?php echo Mage::registry('product')->getProductUrl(); ?>" />
 <meta property="og:description" content="<?php echo strip_tags(($product->getShortDescription())); ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php elseif(Mage::registry('current_category')): ?>
 <?php $category = Mage::registry('current_category'); ?>
 <?php if ($category->getImageUrl()): ?>
    <meta property="og:image" content="<?php echo $category->getImageUrl(); ?>" />   
 <?php endif; ?>
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="product.group" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php elseif((Mage::getSingleton('cms/page')->getIdentifier() == 'home' &&
 Mage::app()->getFrontController()->getRequest()->getRouteName() == 'cms')) : ?>
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="website" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php else: ?>
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="article" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php endif; ?>
<?php /* Open Graph Protocol for Facebook and SEO END */ ?>

If that doesn't work, try this one:

<?php /* Open Graph Protocol for Facebook and SEO START */ ?>
<?php if(Mage::registry('current_product')): ?>
 <?php $product = Mage::registry('current_product'); ?> 
 <meta property="og:title" content="<?php echo ($product->getName()); ?>" />
 <meta property="og:type" content="product" />
 <meta property="og:image" content="<?php echo $this->helper('catalog/image')->init($product, 'small_image')->resize(200,200);?>" />
 <meta property="og:url" content="<?php echo Mage::registry('product')->getProductUrl(); ?>" />
 <meta property="og:description" content="<?php echo strip_tags(($product->getShortDescription())); ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php elseif(Mage::registry('current_category')): ?>
 <?php $category = Mage::registry('current_category'); ?>
 <?php if ($category->getImageUrl()): ?>
    <?php $categoryImageUrl = Mage::getBaseUrl('media') . 'catalog/category/' . $category->getImageUrl(); ?>
     <meta property="og:image" content="<?php echo $categoryImageUrl; ?>" />
 <?php endif; ?>
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="product.group" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php elseif((Mage::getSingleton('cms/page')->getIdentifier() == 'home' &&
 Mage::app()->getFrontController()->getRequest()->getRouteName() == 'cms')) : ?>
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="website" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php else: ?>
 <meta property="og:title" content="<?php echo $this->getTitle() ?>" />
 <meta property="og:type" content="article" />
 <meta property="og:url" content="<?php echo $this->helper('core/url')->getCurrentUrl();?>" />
 <meta property="og:description" content="<?php echo strip_tags($this->getDescription()) ?>" />
 <meta property="og:site_name" content="<?php echo Mage::app()->getStore()->getName(); ?>" />
<?php endif; ?>
<?php /* Open Graph Protocol for Facebook and SEO END */ ?>

[b7itzz]

Both of them gives me The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags.

[b7itzz]

This is the category page https://coveredperfectly.com/dresses.html. I'm trying to have facebook automatically pull those 2 images as choices when sharing the page on facebook. The product page pulls it just fine, it's just the category page that is not working.

[Sinisa]

Are you sure that you have set category image? Can you check for this particular category, if you have set image in Catalog -> Manage Categories?

[b7itzz]

Sorry for the confusion. We do not have a file selected under the category image (see below).

That's actually not what I'm trying to do. I wanted facebook to be able to give me a choice to display one of the images on that category when I share that category page. Right now this is what it's displaying (without an image).

I wanted it to show just like the product page below.