srcmini我为客户建立了一个自定义的wordpress主题, 作为主题的一部分, 我创建了自定义post, 这意味着他们将能够在网站的一部分上添加重复的复制/图像幻灯片, 而无需找我。大部分内容取材于关于复数视力的精彩教程, 但这是唯一行不通的方法。
副本看起来不错, 但是图像无法识别来源时出现问题。
我的functions.php代码…
--------- Custom Classes Post Type --------
*/
function create_post_type()
{
register_post_type(
'glasseye_classes', array(
'labels' => array(
'name' => __('Classes'), 'singular_name' => __('Class')
), 'public' => true, 'has_archive' => true, 'supports' => 'title'
)
);
}
add_action('init', 'create_post_type');
// define prefix
$prefix = 'ge_';
$meta_box = array(
'id' => 'classes-meta-box', 'title' => 'Add New Class Listing', 'page' => 'glasseye_classes', 'context' => 'normal', 'priority' => 'high', 'fields' => array(
array(
'name' => 'Title', 'descr' => 'Enter the copy for your phone', 'id' => $prefix . 'phone_copy', 'type' => 'text'
), array(
'name' => 'Phone image URL', 'descr' => 'Please paste the full URL for the phone gif. You can find this in the Media Libary', 'id' => $prefix . 'phone_image', 'type' => 'text', ), array(
'name' => 'Box Theme', 'descr' => 'This sets the color scheme for the class box. Please look at Classes page to determine the appropriate theme for your new listing', 'id' => $prefix . 'theme', 'class' => $prefix . 'theme', 'type' => 'theme_colors', 'options' => array(
array('color' => 'Pink'), array('color' => 'Purple'), array('color' => 'Teal'), array('color' => 'Green')
)
)
) //fields array
); // meta_box aray
add_action('admin_menu', 'glasseye_add_box');
// Add meta box
function glasseye_add_box()
{
global $meta_box;
add_meta_box($meta_box['id'], $meta_box['title'], 'glasseye_show_box', $meta_box['page'], $meta_box['context'], $meta_box['priority']);
}
function glasseye_show_box()
{
global $meta_box, $post;
// Use nonce for verification
echo '<input type="hidden" name="glasseye_meta_box_nonce" value="', wp_create_nonce(basename(__FILE__)), '" />';
echo '<table class="form-table">';
foreach ($meta_box['fields'] as $field) {
// get current post meta data
$meta = get_post_meta($post->ID, $field['id'], true);
echo '<tr>', '<th style="width:20%"><label for="', $field['id'], '">', $field['name'], '</label></th>', '<td>';
switch ($field['type']) {
case 'text':
echo '<input type="text" name="', $field['id'], '" id="', $field['id'], '" value="', $meta ? $meta : $field['std'], '" size="30" style="width:97%" />', '<br />', $field['descr'];
break;
case 'textarea':
echo '<textarea name="', $field['id'], '" id="', $field['id'], '" cols="60" rows="4" style="width:97%">', $meta ? $meta : $field['std'], '</textarea>', '<br />', $field['descr'];
break;
case 'select':
echo '<select name="', $field['id'], '" id="', $field['id'], '">';
foreach ($field['options'] as $option) {
echo '<option ', $meta == $option ? ' selected="selected"' : '', '>', $option, '</option>';
}
echo '</select>';
break;
case 'radio':
foreach ($field['options'] as $option) {
echo '<input type="radio" name="', $field['id'], '" value="', $option['value'], '"', $meta == $option['value'] ? ' checked="checked"' : '', ' />', $option['name'];
}
break;
case 'checkbox':
echo '<input type="checkbox" name="', $field['id'], '" id="', $field['id'], '"', $meta ? ' checked="checked"' : '', ' />';
break;
case 'theme_colors':
echo $field['descr'], '<br><br>';
foreach ($field['options'] as $option) {
echo '<label>', $option['color'], ' <input type="radio" name="', $field['id'], '" value="', $option['color'], '" id="', $field['id'] . '_' . strtolower($option['color']), '"class="', $field['class'], '"', $meta == $option['color'] ? ' checked="checked"' : '', ' /></label><br>';
}
}
echo '</td><td>', '</td></tr>';
}
echo '</table>';
}
add_action('save_post', 'glasseye_save_data');
// Save data from meta box
function glasseye_save_data($post_id)
{
global $meta_box;
// verify nonce
if (!wp_verify_nonce($_POST['glasseye_meta_box_nonce'], basename(__FILE__))) {
return $post_id;
}
// check autosave
if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
return $post_id;
}
// check permissions
if ('page' == $_POST['post_type']) {
if (!current_user_can('edit_page', $post_id)) {
return $post_id;
}
} elseif (!current_user_can('edit_post', $post_id)) {
return $post_id;
}
foreach ($meta_box['fields'] as $field) {
$old = get_post_meta($post_id, $field['id'], true);
$new = $_POST[$field['id']];
if ($new && $new != $old) {
update_post_meta($post_id, $field['id'], $new);
} elseif ('' == $new && $old) {
delete_post_meta($post_id, $field['id'], $old);
}
}
}
在我的index.php中引用的地方…
<?php
$args = array('post_type' => 'glasseye_classes', 'posts_per_page' => 10);
$loop = new WP_Query($args);
while ($loop->have_posts()) : $loop->the_post();
the_content();
$meta_box_fields = $meta_box['fields'];
// returns the key for the Name field for each Class
$phone_copy_key = $meta_box_fields[0]['id'];
$phone_copy_value = get_post_meta($post->ID, $phone_copy_key, true);
$image_key = $meta_box_fields[2]['id'];
$image_value = get_post_meta($post->ID, $image, true);
$class_skill_key = $meta_box_fields[3]['id'];
$class_skill_value = get_post_meta($post->ID, $class_skill_key, true);
$class_length_key = $meta_box_fields[4]['id'];
$class_length_value = get_post_meta($post->ID, $class_length_key, true);
$class_description_key = $meta_box_fields[5]['id'];
$class_description_value = get_post_meta($post->ID, $class_description_key, true);
$class_theme_key = $meta_box_fields[6]['id'];
$class_theme_value = get_post_meta($post->ID, $class_theme_key, true);
?>
<h1><?php echo $phone_copy_value ?></h1>
<div class="phone-animation">
<img class="phone-animation-xlarge phone-five-animation-xlarge" src="<?php bloginfo('template_url') ?>/images/circle.png" alt="red circle" />
<img class="phone-animation-large phone-five-animation-large" src="<?php bloginfo('template_url') ?>/images/circle.png" alt="red circle" />
<img class="phone-animation-medium phone-five-animation-medium" src="<?php bloginfo('template_url') ?>/images/circle.png" alt="red circle" />
<img class="phone-animation-small phone-five-animation-small" src="<?php bloginfo('template_url') ?>/images/circle.png" alt="red circle" />
<div class="phone-image-container">
<img src="<?php echo $phone_value ?>" class="instructor-headshot" alt="<?php echo $class_instructor_value ?> Headshot">
</div>
</div>
</div>
图片标签在开发工具中的外观如何…
<div class="phone-image-container">
<img src(unknown) class="instructor-headshot" alt=" Headshot">
</div>
#1
我错过了定义phone_value(由@Howard E指出), 也错过了使用image_key进行的一些配置。
更新的代码…
$phone_image_value = get_post_meta($post->ID, $phone_image_key, true);
我还需要添加一些额外的位来使我的延迟加载工作
<img data-src="<?php echo $phone_image_value ?>" class="lazy-load" alt="<?php echo $phone_copy_value ?>">
现在可以正常工作了。
评论前必须登录！
注册