如何应用Advanced Custom Fields WordPress(自定义字段插件)快增加相册治理性能呢?明天给大家实例解说一下,在企业网站开发中增加相册展现的性能。当然能够触类旁通,例如:产品图片详情,会员相册等
本人开发益处是什么?
易于治理,扩展性强。不依赖简单的插件,acf一个插件全副搞定。
如果你是老手倡议从装置acf学起:WordPress网站增加广告位性能【Advanced Custom Fields自定义字段插件系列教程】
筹备工作
倡议应用Advanced Custom Fields PRO版本,WordPress后盾上传插件装置启用即可。
https://www.bilibili.com/vide...
1.增加自定义字段
(点击图片放大对照设置)
2.调用字段
以下代码增加到主题根目录下的:single.php,你想展现的任何地位(通常在content或者container标签内插入)
<?php $images = get_field('photos');if( $images ): ?> <ul> <?php foreach( $images as $image ): ?> <li> <a href="<?php echo esc_url($image['url']); ?>"> <img src="<?php echo esc_url($image['sizes']['thumbnail']); ?>" alt="<?php echo esc_attr($image['alt']); ?>" /> </a> <p><?php echo esc_html($image['caption']); ?></p> </li> <?php endforeach; ?> </ul><?php endif; ?>
3.图片调用阐明
缩略图:
<?php echo esc_url($image['sizes']['thumbnail']); ?>
中等大小:
<?php echo esc_url($image['sizes']['medium']); ?>
大图片:
<?php echo esc_url($image['sizes']['large']); ?>
原尺寸图片:
<?php echo esc_url($image['sizes']['full']); ?>
4.相册标签阐明
图片说明:
<?php echo esc_html($image['caption']); ?>
图片形容:
<?php echo esc_html($image['description']); ?>
图片alt信息:
注解:alt标签实际上是网站上图片的文字提醒。在alt标签中退出关键词是很好的晋升关键词排名的办法,但须要留神的是并不能进步关键词密度。
<?php echo esc_html($image['alt']); ?>
原文地址:https://wp-wu.com/wp/tutorial/865.html
作者:WordPress揭雾