I'm using addthis.com to share my pictures from an album (just a page with some pictures in it).
This is my addThis code:
<div class="addthis_toolbox addthis_default_style addthis_32x32_style"
addthis:url="<?php echo HTTP; ?>album.php?id=<?php echo $_GET['id']; ?>"
http://lasala-gastrobar.be/album.php?id=27
addthis:title="An Example Title"
addthis:description="An Example Description">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_print"></a>
<a class="addthis_button_email"></a>
I have this code for every image in my album, and the javascript at the bottom.
Now when I share on facebook, it shares all the images, but I want to be able to share one 1 image at a time.
Same when I click print, only print that 1 picture, not the rest.
got it: the link has to go to a separate page showing only 1 image with correct tags in the head
Related
I made a "musicbox" which shows a music cover and when hovered over it shows a toggleable playbutton, to either play or pause the music.
Now what i want to achieve is the following:
When clicked ON the play/pause button the music will play or pause (did this part)
when clicking anywhere on the cover except the play/pause button it should link (href?) to another page
I tried several things but cannot get the playbutton excluded from the href, i think it should remain inside the ".overlay" because they contents need to be hidden unless you hover over the div/musicbox
echo"
<div class='musicbox' align='center'>
<a>
<div class='overlay'>
<img data-value='../../admin/uploads/tracks/".$music_track."'
data-value='../../admin/uploads/tracks/".$music_oggfile."'
onclick='updateSource(this)' class='btnplay' src='../media/images/go.png'></img>
<img class='btnpause' src='../media/images/stop.png'></img>
<div class='desc'>".$music_title."</div>
</div>
</a>
<img class='cover' src='../../admin/uploads/images/".$music_image."' width='350' height='350'>
</div>";
I am doing a photo gallery with php, and my main page is a gallery with all thumbnail images. If you click on any thumbnail, it will link to another page with the original size image (like google images does). I do that with an hyperlink that contains an image inside :
<a href='".$row['image']."' class='image' title='".$row['title']."'>"."<img src=".$row['thumb']." class='thumb'/> </a>
Then if the user is now in the redirected page showing the big image selected, how can I do it so that if the user clicks on top of the big size image then it will be redirected to the main page with all the thumbnails?
<a href="<?php echo $row['image'];?>"class='image' title="<?php echo $row['title'];?>">
<img src="<?php echo ['thumb'];?>" class='thumb'/>
</a>
If you are able to link to a detail page using <a href, why are you not able to do the same from the detail page?
considering you are on listing page, say listing.php and images are listed from database. You can loop through the images as given below.
<a href="detail-image.php?id=<?php echo $image_from_database['id'];?>" class='image' title="image title">
<img src="<?php echo $image_from_database['thumb'];?>" class='large'/>
</a>
So, on clicking you will be redirected to detail-image.php where you can get the id using PHP $_GET/$_REQUEST
and then fetch the big image from database and show it. There you can do same to link to the listing page
<a href="listing.php" class='image' title="image title">
<img src="<?php echo $image_from_database['large_image'];?>" class='thumb'/>
</a>
Look I don't know exactly what's the problem,
but I think there wrong in your code,
must be like it,
<a href="<?php echo $row['image'];?>"class='image' title="<?php echo $row['title'];?>">
<img src="<?php echo ['thumb'];?>" class='thumb'/>
</a>
!! The page must be "Something.php"
i have an share button on my page and have too the op:image, op:width: and op:height on my meta tags.
When user's share the page, sometimes images get an crop of top left and not take the full image. In the box when user's preview what will share the image is fine, but when in the wall the image is get the crop.
I google it but not had any solid answer. Someone can help me ?
This is my code in symfony framework:
$response = $this->getResponse();
$response->addMeta("og:image", "http://www.mydomain/upload/noticias/". $this->tbnews[0]->getImagem());
$response->addMeta("og:title", $this->tbnews[0]->getTitulo());
$response->addMeta("og:description", $this->tbnews[0]->getApoio());
$response->addMeta("og:image:width", "400px");
$response->addMeta("og:image:height", "209px");
<div class="col-md-1">
<a href="http://www.facebook.com/share.php?u=http://www.mydomain/noticias/index/<?php echo $noticia[0]->getId()?>&title=<?php echo $noticia[0]->getTitulo()?>">
<img class="fb-share-button" src="/images/fb.png" with='48px' height='48px' alt="Compartilhe essa notÃcia no seu Facebook.">
</a>
</div>
the first image is on box before share, when you confirm that.
the second image is the shared on facebook feed news, is how appear to users.
I am using a script, blazy, to change my page's images as the user scrolls down. It works fine, and I would like the user to have the possibility to share each image to his friends on Facebook. I managed to link the url to an anchor to the image. When sharing a link, a little thumbnail is displayed with the link with a short description of the image. My problem is that only the logo of my website is displayed and not the image the user wants to share.
<a class="facebook_share" href="actualites.php#237" onclick="
window.open(
'https://www.facebook.com/sharer/sharer.php?u='+encodeURIComponent(location.href.split(location.hash||'#')[0] + '#237'),
'facebook-share-dialog',
'width=626,height=436');
return false;">
</a>
<div id="237">
<a href="content/posts/237/449.jpg" title="Voir en taille réelle">
<img class="b-lazy"
src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
data-src="content/posts/237/449_thumb.png" alt="image" width="700px">
</a>
</div>
Looking at The Open Graph protocol, I tried to create a meta tag when clicking on the Facebook share button. The result is the same -- the image I want to share is not displayed, this is because Facebook linter only looks at the HTML in the response and does not run any scripts. The content of my page always changes, I cannot write the meta tags "by hand".
<a class="facebook_share" href="actualites.php#237" onclick="
$('meta[name=og:image]').remove();
$('head').append('<meta name=\'og:image\' content=\'***/content/posts/237/449_thumb.png\'>');
window.open(...[see above]);
At the top of this page there's a <p> element that contains a button for Twitter, Facebook, and Stumbleupon. The code that produces these buttons is:
<p align="right"><kamran></p>
When I run the same app on a local Apache server, these buttons are not produced, I just get
<p align="right"><kamran></p>
Can someone explain what this <kamran> tag is and why it doesn't get converted to a series of buttons when I run the app locally?
The page in question is generated using Pixelpost, a photo-blogging platform written in PHP.
Kamran is a pixelpost add-on. The code in the page activates the kamran.php file, which inserts the "share" links.
This is what I see in the relevant paragraph when I click 'View Source' in my browser:
<p align="right"><a target='_blank' href='http://www.facebook.com/share.php?u=http%3A%2F%2Fwww.blork.org%2Fstreetscene%2Findex.php%3Fshowimage%3D12&t=Street+Scene+by+Blork-Street+Scenes+from+Montreal+and+Beyond%3A+Hommage+%C3%A0+F%C3%A9lix+%282%29'><img src='http://www.kamran.ir/icon/icon-facebook.png' alt='facebook icon' title='Facebook'/></a> <a target='_blank' href='http://twitter.com/home?status=Street+Scene+by+Blork-Street+Scenes+from+Montreal+and+Beyond%3A+Hommage+%C3%A0+F%C3%A9lix+%282%29 http%3A%2F%2Fwww.blork.org%2Fstreetscene%2Findex.php%3Fshowimage%3D12'><img src='http://www.kamran.ir/icon/icon-twitter.png' alt='twitter icon' title='Twitter' /></a> <a target='_blank' href='http://www.stumbleupon.com/refer.php?url=http%3A%2F%2Fwww.blork.org%2Fstreetscene%2Findex.php%3Fshowimage%3D12'><img src='http://www.kamran.ir/icon/icon-stumbleUpon.png' alt='stumbleUpon icon' title='stumbleUpon' /></a> </p>
You can see the URLs of the button icons in there. (They are from an Iranian site, www.kamran.ir.) I am not an html expert; I thought at first that kamran must be a macro defined in templates/egocentric/styles/egocentric.css, but it's not. Is it possible that the site has changed since you last looked at it?