Ripro主题首页搜索框动态特效美化

教程开始:

一、找到 ripro/parts/home-mode/search.php  全部替换

<?php
$mode_search = _cao('mode_search');
$image = $mode_search['bgimg'];
$categories = get_categories( array('hide_empty' => 0) );//获取所有分类
$home_search_mod = _cao('home_search_mod');
?>
<div class="row">
<div class="home-filter--content lazyloaded" data-bg="https://cdn.wpon.cn/wordpress/ripro/wpon/1586227401-e69043d1d75bba6.jpg" alt="RIPRO美化-搜索框动态特效" title="RIPRO美化-搜索框动态特效" style="background-image: url("https://cdn.wpon.cn/wordpress/ripro/wpon/1586227401-e69043d1d75bba6.jpg");">
<div class="container">
<h3 class="focusbox-title">找不到资源,我下面给你搜下哦!</h3>
<p class="focusbox-desc">本站所有资源均为高质量资源,各种姿势下载。</p>
<form class="mb-0" method="get" autocomplete="off" action="https://www.wpon.cn">
<div class="form-box search-properties">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-9">
<div class="form-group mb-0">
<input type="text" class="home_search_input" name="s" placeholder="输入关键词搜索...">
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<input type="submit" value="搜索" class="btn btn--block">
</div>
</div>
<div class="home-search-results"></div>
</div>
</form>
</div>
</div>
</div>

二、后台自定义CSS 添加:

图片[1]-Ripro主题首页搜索框动态特效美化-99源码屋
效果图
------本页内容已结束,喜欢请分享------

感谢您的来访,获取更多精彩文章请收藏本站。

© 版权声明
THE END
喜欢就支持一下吧
点赞12 分享
评论 共1条

请登录后发表评论

服务支持

用心做更好的精品源码站,服务各个行业,让大家快速创建属于自己的网站 。

2000+
优质源码
8年+
开发经验
1200
注册用户
7*24
随时响应