admin管理员组

文章数量:1336106

Here is what I am using currently,

<div class="home-header" style="background-image:url('<?php echo get_theme_mod( 'home-header-img' ); ?>'); height: 500px; width: 100%; display: flex; justify-content: center; align-items: center; background-repeat: no-repeat">

I have the background-image being set by the customizer and it's working great however I am unable to have inline styles due to the ThemeForest theme standards. What should I be doing here? or is there a better way to go out this? thanks

Here is what I am using currently,

<div class="home-header" style="background-image:url('<?php echo get_theme_mod( 'home-header-img' ); ?>'); height: 500px; width: 100%; display: flex; justify-content: center; align-items: center; background-repeat: no-repeat">

I have the background-image being set by the customizer and it's working great however I am unable to have inline styles due to the ThemeForest theme standards. What should I be doing here? or is there a better way to go out this? thanks

  • theme-development
  • theme-customizer
Share Improve this question asked Jul 2, 2020 at 1:37 Bradley LewisBradley Lewis 31 bronze badge
Add a comment  | 

1 Answer 1

Reset to default 0

I would recommend changing it to this:

<div class="home-header" style="background-image:url('<?php echo get_theme_mod( 'home-header-img' ); ?>')">

and adding this to style.css or an other stylesheet:

.home-header {
  height: 500px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-repeat: no-repeat;
}

In general, inline styles are not allowed, but Themeforest makes an exception for background-images. So by moving the remaining code in a CSS-file and only leaving the image, you're fully compliant with Themeforest's requirements. The exception for images is mentioned in this article.

Let me know how it goes!

PS: If you want to add the code using wp_add_inline_styles(), but don't know how it works, I can also give an example of that.

本文标签：

版权声明：本文标题：theme development - How to dynamically set a background image with the customizer without putting the css as an inline-style 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1742296997a2448934.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。