When I share a link on Facebook it isn't picking up the image that I've put on the page. I know that I need to get into the Header to provide a specific reference to the image but can you remind me how to do that for just that page? Thanks :)
Thanks for taking the time to reply. It definitely doesn't have the right meta on the social media as if I go to the Facebook Debugger tool it tells me that its an error on the page. Do I go back and change this on Facebook or do I need to go into the Umbraco html and change it there?
Apologies for the very basic question, I'm still very new to all this.
You need to go into your Master template and under section of your HTML add the relevant meta tags (there are more than the examples I gave so you will have to do some research) .
You will also need to add an opening tag < to each of the above examples I gave you because this text editor would not allow me to publish the full code snippets
You can then put in some logic to get the image from the media picker and the way you do this will depend on your version of Umbraco
Thanks, I've been working my way through the online tutorial and got to the bit where it said to add this at the bottom of the head:
@if(Model.Content is IOpenGraph){
@Html.Partial("openGraph")
}
I tried that on the master template but all that happened is that it then appeared as text across the top of our webpage? Have I put it in the wrong place? I scrolled down all through the head section and then put it just above where it ended?
Take a backup of the site and work + test locally, that way if you break anything you have a backup and customers won't see your error messages.
You should really migrate that to V7 or V8, your life will be so much easier and your version will be patched and up to date :)
The code you use and ways you do things can be completely different as well
Its been years since I used 6 but the below will work;
Create a Partial View Macro called Meta and add this into your head;
In addition to what Matthew has provided, don't forget you need to add the absolute path to the image including the domain, not just the relative path, with something like below (not tested on v6, agree you should upgrade):
Editing header
When I share a link on Facebook it isn't picking up the image that I've put on the page. I know that I need to get into the Header to provide a specific reference to the image but can you remind me how to do that for just that page? Thanks :)
You first need to make sure that you have the right meta on your page for social media, for example;
Twitter
meta name="twitter:image" content="yourImageLinkHere" />
meta name="twitter:image:alt" content="yourImageLinkHere" />
Facebook/Open Graph
meta property="og:image" content="yourImageLinkHere" />
meta property="og:image:alt" content="yourImageLinkHere" />
You could then grab the image from a Media Picker on the current page, which would give you the flexibility to change this per page.
As a fallback take an image from a property your Home node in case someone forgets to fill this in.
Thanks for taking the time to reply. It definitely doesn't have the right meta on the social media as if I go to the Facebook Debugger tool it tells me that its an error on the page. Do I go back and change this on Facebook or do I need to go into the Umbraco html and change it there?
Apologies for the very basic question, I'm still very new to all this.
Thanks
Hi Becky
Facebook will gather the meta from your site
You need to go into your Master template and under section of your HTML add the relevant meta tags (there are more than the examples I gave so you will have to do some research) .
You will also need to add an opening tag < to each of the above examples I gave you because this text editor would not allow me to publish the full code snippets
You can then put in some logic to get the image from the media picker and the way you do this will depend on your version of Umbraco
https://our.umbraco.com/documentation/Getting-Started/Backoffice/Property-Editors/Built-in-Property-Editors/Media-Picker/
If you get stuck give me a shout with your version of Umbraco and I will write you some code to do what you need.
Thanks, I've been working my way through the online tutorial and got to the bit where it said to add this at the bottom of the head:
@if(Model.Content is IOpenGraph){ @Html.Partial("openGraph") }
I tried that on the master template but all that happened is that it then appeared as text across the top of our webpage? Have I put it in the wrong place? I scrolled down all through the head section and then put it just above where it ended?
Its version 6 if that makes a difference?
First things first
Take a backup of the site and work + test locally, that way if you break anything you have a backup and customers won't see your error messages.
You should really migrate that to V7 or V8, your life will be so much easier and your version will be patched and up to date :) The code you use and ways you do things can be completely different as well
Its been years since I used 6 but the below will work;
Create a Partial View Macro called Meta and add this into your head;
For example;
Inside this Partial View Macro is where you want your logic
This will work
In addition to what Matthew has provided, don't forget you need to add the absolute path to the image including the domain, not just the relative path, with something like below (not tested on v6, agree you should upgrade):
is working on a reply...