[英]Wordpress image description link
I've modified this code that displays the description of an image: 我已经修改了显示图像描述的代码:
function the_post_thumbnail_caption() {
global $post;
$thumbnail_id = get_post_thumbnail_id($post->ID);
$thumbnail_image = get_posts(array('p' => $thumbnail_id, 'post_type' => 'attachment'));
if ($thumbnail_image && isset($thumbnail_image[0])) {
echo '<p>'.$thumbnail_image[0]->post_content.'</p>';
}
}
What I need is on how to display the description of an image on a popup window once it was clicked. 我需要的是如何在单击图像后在弹出窗口中显示图像的描述。 What am I missing?
我想念什么? Any help would be much appreciated!
任何帮助将非常感激! Thanks!
谢谢!
The file goes like this: 该文件如下所示:
<?php get_header(); ?>
<div id="primary">
<!-- <div id="content" role="main"> -->
<!--</div><!-- #content -->
<?php if($_SERVER['REQUEST_URI'] == '/wordpress/?page_id=5'): ?>
<!--<div style="float:right">-->
<div style="width:640px; float:left;min-height:290px;word-wrap: break-word">
<?php
$myposts = get_posts('');
foreach($myposts as $post) :
setup_postdata($post);
?>
<div class="post-item">
<div class="post-info">
<h2 class="post-title">
<!--<a href="<?php //the_permalink() ?>" title="<?php //the_title_attribute(); ?>"><?php //the_title(); ?></a>-->
<b><?php the_title(); ?></b>
</h2>
<!--<p class="post-meta">Posted by <?php the_author(); ?></p>-->
</div>
<div class="post-content">
<?php the_content(); ?>
<div style="margin:25px 0px;border:1px dotted #ccc; width: 640px;"></div>
</div>
</div>
<?php //comments_template(); ?>
<?php endforeach; wp_reset_postdata(); ?>
</div>
<div style="float:left; width:319px; min-height:200px; border-left:1px solid #ccc">
<div style="float:left; margin-left:5px">
<h2 style="font-family:Mybold; font-size:14pt">Categories</h2>
<?php
the_post_thumbnail_caption();
$categories = get_categories();
foreach ($categories as $cat) {
$category_link = get_category_link($cat->cat_ID);
?><p><a href="<?php echo esc_url( $category_link ); ?>" title="Category Name"><?php if($cat->parent < 1) echo $cat->cat_name; //echo $cat->category_nicename; ?></a></p><?php ;
}
?>
</div>
</div>
<?php endif;?>
</div><!-- #primary -->
<?php get_footer(); ?>
Very quick thought - take a look at https://github.com/mikezahno/jPicDetail - a jQuery plugin for overlaying text on images. 很快想到-看一下https://github.com/mikezahno/jPicDetail-一个用于在图像上覆盖文本的jQuery插件。 There is a jsFiddle demo link on that page too.
该页面上也有一个jsFiddle演示链接。
Only way i can think how to solve this is : Add your image A TITLE and then you can do something like this: 我认为解决此问题的唯一方法是:添加图像TITLE,然后可以执行以下操作:
Fiddle here
在这里摆弄
$('img').click(function(){
var getTitle = $(this).attr('title');
alert(getTitle);
});
Of course you must include jquery into your page see Wordpress codex how to do this. 当然,您必须在页面中包含jquery,请参阅Wordpress Codex如何做到这一点。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.