全百科精品资源分享
免费优质资源下载平台

【网络版】如何修改美化DUX主题全站底部推广区

播放按钮
广告位AD1AD
文章目录

一直不是不是很喜欢UX主题默认的全站底部推广区样式,感觉有点丑,和网站也不是很搭配,最近全百科网从网上查找了不少资料,给DUX主题全站底部推广区美化了下,有想要修改DUX主题底部推广区的朋友可以参考下,此次分享为网络收集版样式,下次分享全百科网的样式。

这次对于主题文件的修改主要集中在三个部分:main.css、options.php、mo_footer_brand.php,大家在文件修改前先做好文件的备份与保存。

修改前

【网络版】如何修改美化DUX主题全站底部推广区

修改后

【网络版】如何修改美化DUX主题全站底部推广区

修改方法

带后台功能的修改方法:

1、先添加样式,在你的主题样式表中main.css最下方处放入以下代码即可

/*全站底部推广区修改*/
.main-info {
width: 100%;
height: 320px;
padding-top: 100px;
background: url(../img/backgroundwall.jpg) repeat-x;
}
 
.main-info dl {
width: 880px;
margin: 0 auto;
height: 120px;
background: url(../img/blue_bg.png) repeat;
}
 
.main-info dl dt {
width: 100%;
padding: 12px 6px 8px 6px;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 36px;
color: #fff;
text-align: center;
font-family: "微软雅黑";
}
 
.main-info dl dd {
width: 100%;
text-align: center;
color: #fff;
font-size: 20px;
font-family: Verdana, Geneva, sans-serif;
font-family: "微软雅黑";
}
 
.main-info dl dd a {
display: inline-block;
height: 24px;
line-height: 12px;
margin-left: 9px;
padding: 5px 9px;
font-size: 16px;
font-family: Verdana, Geneva, sans-serif;
font-weight: bold;
color: #fff;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
background: #E87E16;
}
 
.main-info dl dd a:hover {
background: #FF7E00;
}
 
@media screen and (max-width: 650px){
.main-info {
display: none;
}
}

2、找到主题根目录下option.php打开编辑。

找到全站推广区代码,在推广标题下载添加一个推广标题,定义ID为footer_brand_title-1,代码如下:

$options[] = array(
'name' => __('推广标题', 'haoui'),
'id' => 'footer_brand_title-1',
'desc' => '建议20字内',
'std' => '全百科网www.quanbaike.com',
'type' => 'text');
// 全站底部推广区修改
    $options[] = array(
        'name' => __('推广副标题', 'haoui'),
        'id' => 'footer_brand_title-1',
        'desc' => '建议20字内',
        'std' => '全百科网 精品免费资源下载',
        'type' => 'text');

3、找到主题根目录下文件夹modules,编辑mo_footer_brand.php文件,将以下代码全部替换上去。

<!-- 全站底部推广区修改 -->
<div class="main-info">
    <div class="container">
        <dl><dt><?php echo _hui('footer_brand_title') ?></dt>
            <dd><?php echo _hui('footer_brand_title-1') ?>
			    <?php
                    for ($i=1; $i <= 2; $i++) {
                        if( _hui('footer_brand_btn_text_'.$i) && _hui('footer_brand_btn_href_'.$i) ){
                            echo '<a'.(_hui('footer_brand_btn_blank_'.$i)?' target="blank"':'').' class="btn btn-lg" href="'._hui('footer_brand_btn_href_'.$i).'">'._hui('footer_brand_btn_text_'.$i).'</a>';
                        }
                    }
               ?>
            </dd>
        </dl>
    </div>
</div>

添加背景图片

根据个人喜好为自己的网站设计两张图片,一张命名为backgroundwall 图片格式为jpg;另一张命名为blue_bg 图片格式为png,并上传至主题目录下/img/文件夹下。具体图片文件推荐大小如下:

backgroundwall:1920x320pxblue_bg:880x120px

当然你也可以设置文件名及图片大小、格式为其他值,不过这需要你对main.css文件中相应的参数进行调整。

图片下载

下载地址:https://sn9.us/file/3494484-403557941

PS:请大家修改前先做好相对应的文件备份,还有上面的推广语大家可以自定义哈。

Download Nulled WordPress Themes
Download WordPress Themes
Download Nulled WordPress Themes
Download Premium WordPress Themes Free
udemy course download free
download karbonn firmware
Download WordPress Themes Free
ZG93bmxvYWQgbHluZGEgY291cnNlIGZyZWU=

搜一下 获取更多

本文由全百科网分享提供,分享更多精品资源,帮助你我共同成长。

赞(0)
全百科网 » 【网络版】如何修改美化DUX主题全站底部推广区
本站内容均来自网络收集,转载内容不代表本网站的观点及意见,仅供用户参考和借鉴。如对稿件内容及版权问题有疑议,请及时联系全百科官方邮箱: smtsg@foxmail.com
广告位AD1

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址