0
我想爲客戶的WordPress的網站創建更具體的jQuery畫廊！需要幫助jQuery的畫廊從wordpress附件
的理念是：
我們有頁 「畫廊」 女巫將使用頁面模板 「畫廊-TPL」，讓我們說！
在頁面模板「Gallery-tpl」我有一個頭像女巫的大圖像是第一篇文章附件的全尺寸！
一些身體在那裏我有< DIV>與所有附件
TUMBNAIL SIZE的無序列表！
這個名單必須是一個滑塊
而且我要當點擊縮略圖標頭中的大圖像與點擊的縮略圖的完整版本的改變
我對這個職位Get Attachments to post如何發現獲得第一個附件，以及如何獲得所有這些！
我發現了一種用jQuery替換圖像的方法。
然後我試圖所有代碼結合在一起，但它僅適用於一個圖像
這裏是我的「畫廊-TPL」
<?php
/**
Template Name: Gallery
original: http://www.rlmseo.com/blog/get-images-attached-to-post/
*/
function bdw_get_first_image() {
// Get the post ID
$iPostID = $post->ID;
// Get images for this post
$arrImages =& get_children('post_type=attachment&post_mime_type=image&post_parent=' . $iPostID);
// If images exist for this page
if($arrImages) {
// Get array keys representing attached image numbers
$arrKeys = array_keys($arrImages);
/******BEGIN BUBBLE SORT BY MENU ORDER************/
// Put all image objects into new array with standard numeric keys (new array only needed while we sort the keys)
foreach($arrImages as $oImage) {
$arrNewImages[] = $oImage;
}
// Bubble sort image object array by menu_order TODO: Turn this into std "sort-by" function in functions.php
for($i = 0; $i < sizeof($arrNewImages) - 1; $i++) {
for($j = 0; $j < sizeof($arrNewImages) - 1; $j++) {
if((int)$arrNewImages[$j]->menu_order > (int)$arrNewImages[$j + 1]->menu_order) {
$oTemp = $arrNewImages[$j];
$arrNewImages[$j] = $arrNewImages[$j + 1];
$arrNewImages[$j + 1] = $oTemp;
}
}
}
// Reset arrKeys array
$arrKeys = array();
// Replace arrKeys with newly sorted object ids
foreach($arrNewImages as $oNewImage) {
$arrKeys[] = $oNewImage->ID;
}
/******END BUBBLE SORT BY MENU ORDER**************/
// Get the first image attachment
$iNum = $arrKeys[0];
// Get the thumbnail url for the attachment
$sThumbUrl = wp_get_attachment_thumb_url($iNum);
// UNCOMMENT THIS IF YOU WANT THE FULL SIZE IMAGE INSTEAD OF THE THUMBNAIL
$sImageUrl = wp_get_attachment_url($iNum);
// Build the <img> string
$sImgString = '<a href="' .$sImageUrl . '" class="btw_fullimage">' .
'<img src="' . $sImageUrl . '" width="600" height="200" alt="Big Image" title="Big Image" />' .
'</a>';
// Print the image
echo $sImgString;
}
}
function bdw_get_images() {
// Get the post ID
$iPostID = $post->ID;
// Get images for this post
$arrImages =& get_children('post_type=attachment&post_mime_type=image&post_parent=' . $iPostID);
// If images exist for this page
if($arrImages) {
// Get array keys representing attached image numbers
$arrKeys = array_keys($arrImages);
/******BEGIN BUBBLE SORT BY MENU ORDER************/
// Put all image objects into new array with standard numeric keys (new array only needed while we sort the keys)
foreach($arrImages as $oImage) {
$arrNewImages[] = $oImage;
}
// Bubble sort image object array by menu_order TODO: Turn this into std "sort-by" function in functions.php
for($i = 0; $i < sizeof($arrNewImages) - 1; $i++) {
for($j = 0; $j < sizeof($arrNewImages) - 1; $j++) {
if((int)$arrNewImages[$j]->menu_order > (int)$arrNewImages[$j + 1]->menu_order) {
$oTemp = $arrNewImages[$j];
$arrNewImages[$j] = $arrNewImages[$j + 1];
$arrNewImages[$j + 1] = $oTemp;
}
}
}
// Reset arrKeys array
$arrKeys = array();
// Replace arrKeys with newly sorted object ids
foreach($arrNewImages as $oNewImage) {
$arrKeys[] = $oNewImage->ID;
}
/******END BUBBLE SORT BY MENU ORDER**************/
// izpolzvai do ili for
echo '<ul id="btw_gallery">';
for($i = 0; $i < sizeof($arrNewImages) - 1; $i++) {
// Get the first image attachment
$iNum = $arrKeys[$i];
// Get the thumbnail url for the attachment
$sThumbUrl = wp_get_attachment_thumb_url($iNum);
// UNCOMMENT THIS IF YOU WANT THE FULL SIZE IMAGE INSTEAD OF THE THUMBNAIL
$sImageUrl = wp_get_attachment_url($iNum);
// Build the <img> string
$sImgString = '<img src="' . $sThumbUrl . '" alt="Thumbnail Image" title="Thumbnail Image" class="btw_thumb" />';
// Print the image
echo '<li>'.$sImgString.'</li>';
}
echo '</ul>';
echo '
<script>
$("#btw_gallery li img").live("click", function() {
$("a.btw_fullimage").attr("href", \''.$sImageUrl.'\').attr("title", this.title);
$(".btw_fullimage img").attr("src", \''.$sImageUrl.'\').attr("alt", this.alt).attr("title", this.title);
});
</script>
';
}
}
get_header(); ?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<div id="primary">
<div id="content" role="main">
<?php while (have_posts()) : the_post(); ?>
<?php bdw_get_first_image(); ?>
<?php get_template_part('content', 'page'); ?>
<?php bdw_get_images(); ?>
<?php endwhile; // end of the loop. ?>
<hr />
</div><!-- #content -->
</div><!-- #primary -->
<?php get_footer(); ?>
我確信還有更多正確和專業的方式來做到這一點，它會工作！
如果有人能幫助我，請回答我！