将图片重定向到发布网址答案

【问题标题】：Redirect image to post url将图片重定向到发布网址
【发布时间】：2017-07-23 04:14:58
【问题描述】：

当你点击“在新标签中打开图片”时，我在谷歌图片中看到了一些网站，它会重定向到原始帖子的网址。

我的网站有很多用 php gd 创建的图像，这些图像从帖子中获取数据并创建图像，它的 url 类似于：

example.com/img/(number-post-id)-some-text.jpg

并发布它的

example.com/post/(number-post-id)

当有人在新标签页中打开图片时，有没有办法将图片重定向到原始帖子？

谢谢

【问题讨论】：

把你的图片包裹在锚<a></a>标签中
检查片段！！

标签： php redirect gd

【解决方案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>

【讨论】：

【解决方案2】：

据我了解，这是一个可以解决您问题的 sn-p：

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

【讨论】：