使用php、无需使用js和ajax的高级定制字段,即可获得不同的移动和桌面图像。

时间:2021-03-13 作者:iuriiGav

我希望大家都好!

我正在寻找一种可能性,以加载不同的画廊,背景图像等的电话和桌面。例如,我将我的英雄背景图像设置为:

    <section class="hero" style="background-image: 
url(<?php echo esc_url(wp_get_attachment_image_src(get_field(\'advanced_custom_fields_field\'), \'full\')[0]); 
                                                                                    ?>)">
当窗口调整大小(或在手机上打开网站)时,我想从另一个窗口获取图像advanced custom field entry (例如get\\u field(\'advanced\\u custom\\u fields\\u field_mobile\') )

有没有一种方法可以在没有js和ajax的情况下在php中实现这一点,或者这是使用js实现这一点的最佳方法?

是否有可能在样式中包含高级自定义字段。带有页眉的php工作表

header(\'Content-Type: text/css; charset:UTF-8\'); 
如果可能的话,我可以在这里编写媒体查询,并使用get\\u field()函数包含不同的图像,但我没有找到访问get\\u field()函数的方式。php

当然,这一切都可以通过js实现,但我很好奇是否有一种WP方法可以做到这一点。非常感谢您的帮助!

2 个回复
SO网友:Anoop D

使用时可以显示选定的图像Image ID 返回类型

<?php $image = get_field(\'image\'); $size = \'full\'; // (thumbnail, medium, large, full or custom size) if( $image ) { echo wp_get_attachment_image( $image, $size ); }

此函数还生成srcset属性,允许responsive images!

SO网友:Matthew Brown aka Lord Matt

听起来你在追求HTML的srcset特性。它允许您为不同的屏幕大小定义不同的图像。

<picture>
  <source media="(min-width:650px)" srcset="img_pink_flowers.jpg">
  <source media="(min-width:465px)" srcset="img_white_flower.jpg">
  <img src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;">
</picture>
这是a link to the W3Schools page on srcsethere is the Mozilla developer guide.

相关推荐

PHPVariable=get_the_post_thump_url不带斜杠输出

在一个自定义快捷码函数中,我获取了特色图像URL:$text_slider_testimonial_img = get_the_post_thumbnail_url($single->ID); 如果我回音$text_slider_testimonial_img 我立即看到正确的图像URL://localhost:3000/wp-content/uploads/2021/03/splitbanner1.jpg当我将此变量传递给函数时,该函数使用:$text_slider_content .=