如何在storefront的顶部栏和页脚区域添加自定义frame

我想在我的网站的顶部和底部添加一个瘦的自定义框架。

这是给我的Woocommerce网上商店的。我正在使用storefront主题。框架应响应任何屏幕。然后frame是一个jpeg文件(当然, 如果需要, 我可以将其转换为任何其他图像文件)。

#1

首先, 你应该为storefront创建一个子主题, 这样你就可以自定义主题, 而无需那些插件。在这里阅读如何设置你的孩子主题：https://docs.woocommerce.com/document/set-up-and-use-a-child-theme/

第二步是将html添加到header.php和footer.php中

<div class="myrepeatableimg"></div>

将一些CSS添加到你的style.css文件或wordpress定制器中。

.myrepeatableimg{
 width: 100%; 
 height:50px; 
 background-repeat:repeat;
 background-image: url('https://www.srcmini02.com/designers/subtlepatterns/patterns/folk-pattern.png'); }

.myrepeatableimg{
width:100%; height:100px;
background-image: url('https://www.srcmini02.com/designers/subtlepatterns/patterns/folk-pattern.png'); 
background-repeat:repeat;
}

<div class="myrepeatableimg"></div>