将图像重定向到帖子网址

Question

当您单击"在新选项卡中打开图像"时，我在谷歌图片中看到了一些网站，它会重定向到原始帖子的URL。

我有一个我的网站，里面有很多使用 php gd 创建的图像，这些图像从帖子中获取数据并创建图像，网址类似于这样：

example.com/img/(数字后 ID(一些文本.jpg

和帖子

example.com/post/(数字后 ID(

当有人在新选项卡中打开图像时，有没有办法将图像重定向到原始帖子？

谢谢

Answer 1

/* add a little bottom space under the images */
.thumbnail {
	margin-bottom:7px;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"/>
<div class="container">
<h1>Image Grid</h1>

<b> NOTE: </b> Try To Open With <kbd>`Right Click`</kbd> <b> > </b> <kbd> `Open Link In New Tab`</kbd>  Or .. With  

<kbd>Ctrl<kbd> + <kbd> Click<kbd>

<hr>


<div class="row">
<div class="col-xs-3">
<a href="https://www.google.com" class="thumbnail"> Google
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="https://www.facebook.com" class="thumbnail"> facebook
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="https://www.stackoverflow.com" class="thumbnail"> stackoverflow
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="www.yahoo.in" class="thumbnail"> yahoo.in
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
</div>

<hr>
</div>

Answer 2

据我了解，这是一个应该解决你的问题的片段：

<a href="http://example.com/imagelink" target="_blank"> <!-- target _blank opens in new tab-->
<img src="http://example.com/image.extension">
</a>