I am trying to share my page on Google Plus.. but the problem is that google plus is using my website logo to display as my post image on google Plus screen. I want it to display my posts image not the website logo.. how can i do that.. i am using following code to share the link
/+1/confirm?hl=ru&url=">https://plusone.google.com//+1/confirm?hl=ru&url=
Is there any way by which i can also set my iimage url which will display as my post image on Google Plus.
Some thing like this /+1/confirm?hl=ru&url=URL&img=ImageUrl">https://plusone.google.com//+1/confirm?hl=ru&url=URL&img=ImageUrl
i have also tried this but no success, may be i am trying wrong url. If somebody knows please share the URL here.
Thanks.
I have hit the same snag also. You cannot use a +1 with your own functions or callers. You need to use the google code to make that happen.
What you can do however is use a javascript share window to pass your own parameters.
This is what I use.
function shareToGooglePlus(destination,title,description,imageurl)
{
var go = "https://plus.google.com/share?";
var url = "url="+encodeURIComponent(destination);
var title = "title="+encodeURIComponent(title);
var description = "content="+encodeURIComponent(description);
var images = "image="+encodeURIComponent(imageurl);
this.openWindow(go+url+"&"+title+"&"+description+"&"+images)
}
The resulting url is a new window opened with the url:
https://plus.google.com/share?url=http%3A%2F%2Fwww.ortho.nl%2Forthomoleculair-blog%2Fnieuws%2F2014%2Fvitamine-c-en-chemo%2F&title=Vitamine%20C%20en%20chemotherapie&content=Vitamine%20C%20en%20chemotherapie%0A%0AHet%20ondergaan%20van%20een%20behandeling%20met%20chemotherapie%20is%20%C3%A9%C3%A9n%20van%20de%20zwaarste%20beproevingen%20die%20iemand%20met%20kanker%20vaak%20moet%20d&image=https%3A%2F%2Fwww.ortho.nl%2Fcss%2Fafbeeldingen%2Fwebsite%2Ftwitter_photo.jpg
if you wish to use google's +1 button I suggest using microformats in your website
https://support.google.com/webmasters/answer/146897?hl=en
try to use og:image meta-property:
<meta property="og:image" content="http://mylink.com/myimg.png">
see, it works on my webpage
Related
Hello, I am making a jQuery YouTube search and display web application and I need to send the link of a specific video to the database using PHP.
In the application, the user searches for a video and the unique code for that video gets inserted into a set YouTube link using an "id" variable. I want to capture the full link (including the unique id) and put it into the database without having to open a new page (which is how AJAX does it, I think).
Here are links to some similar problems, but they haven't worked for me. (getting youtube video id the PHP, How do I find all YouTube video ids in a string using a regex?, https://stackoverflow.com/questions/19977278/how-to-get-php-data-in-javascript, Data transfer from JavaScript to PHP, http://www.webdeveloper.com/forum/showthread.php?249863-pass-jquery-value-to-php-variable (sorry for the massive amount of links, Stack told me to include them if they were similar and didn't work))
Here is the code that makes it work so far.
<script type="text/javascript">
//on thumbnail click
$videoDiv.click(function(e) {
displayVideo(entry.media$group.yt$videoid.$t, entry.title.$t);
});
//Display the video
function displayVideo(id, title) {
//embed player
swfobject.embedSWF('http://www.youtube.com/e/' + id + '?enablejsapi=1&playerapiid=ytplayer&autoplay=1',
'video-placeholder', '544', '408', '9.0.0', null, null, { allowScriptAccess: "always" },
{ id: "youtubevideo" } );
}
</script>
Obviously, this isn't the whole function, but hopefully it should be enough.
Please help me, I've run out of places to look.
Hi Niklas,
Thank you for answering me, I’ve tried that out and it turns out that my code is a bit more complicated to allow for that.
My project for university also needs to have information sent to the page that the video is on, currently I have the form for the user on one page and the code to search YouTube and display the user’s information as well as the video on the next (external) page.
Unfortunately AJAX is still one of the languages I haven’t yet learnt, so the documentation you linked me to didn’t make much sense.
My code is very complicated as it uses the YouTube API as well as JavaScript, jQuery and PHP. The main js file for this searches YouTube and once the user clicks on the thumbnail, it fires up a displayVideo function, which also features the information from the previous page.
I can’t redirect the user to a new page after they select the video, just to get the id into PHP, because that would wipe the data from the first form when the user gets redirected back to the YouTube form.
I’m hoping you could please assist me.
Answer
Okey, know I understand what you're asking. That you would do something like this:
<script type="text/javascript">
$(function() {
//on thumbnail click
$videoDiv.click(function(e) {
var videoURL = displayVideo(entry.media$group.yt$videoid.$t, entry.title.$t);
$.post('url-to-your-php-file', {videoURL: videoURL}, function(response) {
// Do stuff with the response given/echoed by the PHP file
});
});
//Display the video
function displayVideo(id, title) {
//embed player
var videoURL = 'http://www.youtube.com/e/' + id + '?enablejsapi=1&playerapiid=ytplayer&autoplay=1';
swfobject.embedSWF(videoURL,
'video-placeholder', '544', '408', '9.0.0', null, null, { allowScriptAccess: "always" },
{ id: "youtubevideo" } );
return videoURL;
}
});
</script>
Hope this helps and good luck!
Answer before revised question
I won't write the code for you, but you're right in your thinking and I will give you some links that may help. You need to make an AJAX call to a PHP file which saves the link to the database.
AJAX Call
You're using jQuery, which makes AJAX calls real easy. Have a look at the jQuery .ajax() documentation. Though in this case it being a really small and "unadvanced" call you need to make, the shorthand wrapper function .post() will do nicely for you.
Retrieve the link in PHP
After that you can retrieve the link in the PHP using the global $_POST variable.
Adding the link to the database
For adding it to the database, I would recommend the PHP PDO library for making the connection and queries.
Hope this helps and don't hesitate to ask if there's anything you wonder!
<a href="http://www.linkedin.com/shareArticle?url=MY_URL" class="in-share-button" target="_blank">
<img src="my_img" alt="linkedin share button" title="Share on Linked In" /> </a>
This is currently my share button. I want it to share the url that's currently in the address bar, and not a fixed preset url like it does atm.
I found
<?php $url="http://".$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']; echo $url; ?>
what seems to fit my needs. But when I change "MY_URL" with this it just creates a link to the main page of my website.
The URL it SHOULD display looks like "www.myurl.de/#/id_of_a_post".
I feel like the # is the problem. . .
can you provide me any help with this?
You cannot read the hash portion of the URL in your server side code. The part that follows # is never sent to the server by the browser. So if you're trying to tackle this issue with PHP, you won't get the behavior that you're are expecting.
It looks like you're relying on static links to perform the sharing. I can only answer for Google+, but with Google+ you have two options:
Use the Google+ widget rather than a static link and do not specify the HREF parameter:
<div class="g-plusone" data-annotation="none"></div>
<!-- Place this tag after the last +1 button tag. -->
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
When the href is not specified and you do not specify a canonical URL, the widget falls back to default to the URL value that comes from document.location.href, which will be your visitor's current page, including the hash portion of the URL.
Use JavaScript to rewrite the URLs in your links to append your current hash location, for example, lets assume that you placed all your social links into a div with class "sharing" and then you need to modify all the hrefs within that div using jQuery:
var hash = document.location.hash;
// Loop through each link in the sharing div
$('.sharing a').each(function(){
// Append the hash to the end of each already populated URL
$(this).attr('href', $(this).attr('href') + encodeURIComponent('#' + hash));
});
It just worked another way.
My friend created a script that saves the ID of the individual posts:
(function(){
var numbers = document.URL.match(/\d+/g);
if(numbers != null){
$('#right-col').addClass('shown').removeClass('hidden');
$('#left-col').addClass('colPositioning');
$('#right_'+numbers).addClass('shown1');
;}
}());
Afterwards I was able to use:
<img src="img_src">
The trick about it was to replace the # with the "%23". I think it's called encodedURI.
What do you guys think about this solution?
The share might not work exactly the way you think it will. You're using the anchor part of your URL to link to a specific place on your page, and probably using some javascript to then process that and load new or different information, or display/hide other parts of the page, depending on the value of that anchor.
While this works for people who visit your website, it won't work for bots that visit your website (such as the bots used by Facebook and Google+, although I don't know if Linkedin does this as well) which try to get a snippet of information to show as a preview. So while the link itself might work, the preview shown on the website will almost certainly not reflect the contents of the anchored URL.
Can anyone tell me how Facebook Like identifies the page domain of where the iFrame is placed?
Reason I am asking is say I have an iFrame in http://www.firstdomain.com that loads a http://www.mysite.com/page.php?appid=111&userid=5". I only want http://www.firstdomain.com to be allowed to view that page, but if some other domain name (http://www.anotherwebsite.com) tries to put the same iFrame, it should not work.
Any thoughts? How to make this in PHP/JavaScript and be secure at the same time. I am trying to avoid using Proxy Pages on the server requesting the page.. just pure Javascript and iFrame.. any help is greatly appreciated!
I think you have to put a js in client pages that generates the iframe in the dom, passing as parameter to the src page the url of "hosting" page, and so the domain.
Like this:
<script src="http://example.com/ilikeapp.js" />
Where ilikeapp is something like (almost pseudo code):
var hosting_page = window.location;
$(body).append("<iframe src='http://example.com/apage.php?client="+hosting_page+"' .... />");
I have an issue of passing the ? and = through my url since I am using drupal (although i think it doesn't matter drupal or static site).
Each media content type I have needs a path of localhost/media/video?open=?cbox10
Pathauto module has this for each media asset content type.
media/videos?open=?cbox[nid]
The node url then looks like
http://localhost/media-gallery/images%3Fopen%3D%3Fcbox14
Let me know if I'm wrong but i believe I need to now encode/decode the url using php. Each of these node urls needs to directly open color box on the videos page.
I was looking into urlEncodeComponent but not sure how to implement it. I imagine it would be in my page.tpl.php and be decoded whenever those characters are present.
Can I possibly encode the value of the URL's within my jquery or php?
If anyone has knowledge of path auto module that I am not utilizing, please let me know. I have already tried to 'not replace' specific characters in my aliased url but its not working as expected, since it still shows up decoded.
I need this url encoded in order to pass the correct link to open graph tags for each unique piece of content on my page.
Currently have this displaying for each video asset page:
<meta property="og:url" content="http://localhost/media-
gallery/images%3Fopen%3D%3Fcbox14" />
which needs to be encoded to media/videos?open=?cbox14
Jquery to directly open color box according to unique asset ID
// Colorbox direct linking
// Get the cb id in url or set false if not found
var colorboxId = (window.location.href.indexOf('open=')==-1) ?
false :
window.location.href.slice(window.location.href.indexOf('open=') + 'open='.length + 1).split('&')[0];
// Instantiate all colorboxes on the page
$(".colorbox-inline").colorbox();
// If id of colorbox was sent in url, open it now
if(colorboxId !== false) {
$("#" + colorboxId).colorbox({open:true});
}
Currently Testing...doesn't work:
<script>
$(document).ready(function() {
var ogurl = $('meta[property="og:url"][content]').prop("content");
$( ogurl ).prop("content",
decodeURIComponent( ogurl );
});
</script>
It works for what it is but how can I ensure my url is encoded properly so that facebook og:url can pick up the decoded url.
thanks so much!
If you're writing this in PHP you'll better decode it in PHP too.
echo '<meta property="og:url" content="' . urldecode("http://localhost/media-
gallery/images%3Fopen%3D%3Fcbox14") . '" />';
Otherwise use jQuery but I'm not sure if this can be done because Facebook executes JavaScript too and you should maybe modify it for (ex. click event).
$('meta[property="og:url"][content]').each(function() {
$(this).prop("content", decodeURIComponent($(this).prop("content")));
});
I am creating a mobile app that displays a "students" classes. For example, a list is generated on a jQm page ("entity_list") which when clicked will take them to another section on the same page where it will pull a list of information regarding that list. This is done via an id embedded in the url like so:
'.$class['title'].'
When clicked this code is used to extract that information:
$("a[href=#entity]").live("click",
function(e) {
navIdentity = $(this).data("identity");
$.post("entity.php", { entity_id: navIdentity} );
$("#entity").page();
}
);
The problem I am facing is that I can't then extract that id to then load more via php.
Does ANYONE know if theres a better way or how to fix this. Thanks a bunch!
How about this?
navIdentity = $(this).attr("data-identity");
Will it work?
There is probably an issue with the selector. Yours is
$("a[href=#entity]")
I assume you need to add quotes, like this
$("a[href='#entity']")
See the jQuery API at http://api.jquery.com/attribute-equals-selector/