给网站增加-挂春节灯笼效果

最近看到很多网站都挂了灯笼,有兴趣的也可以试试,这个效果适合春节的时候网站使用,平常使用率应该不是很高,最初的出处也无从考证了,一为在鸟叔的博客搬的,感兴趣的照下文添加吧,效果如图。

给网站增加-挂春节灯笼效果插图

第一步、添加HTML代码

找到自己主题根目录下的 footer.php页脚模板文件,打开后将下面的HTML代码添加到在</body>标签结束前,代码如下

 

上面的代码可以只加一个,比较单调了,个人感觉挂两个灯笼更灵动些。

第二步、添加样式

使用一:将样式代码添加 到WP后台 → 外观 → 自定义 → 额外CSS 中,点击“发布”即可。

使用二:将样式代码直接加到主题样式文件style.css的最后。如果灯笼上的文字字号不合适的h话,可以适当修改这个 .deng-t 类的:font-size: 3.2rem;,调整字体大小。

 

第三步、添加判断函数(可选)

一般都是在首页显示即可,所以就需要加判断了,如果在网站中,只想在首页显示灯笼,可以用下面的判断语句把第一步的HTML代码包裹起来,其他页面就不会显示了:

首页显示:

<?php if (is_home()) { ?  <!-- 代码放这里 --> <?php } ?>

手机移动端不显示:

<?php if (!wp_is_mobile()) { ?>
<!-- 代码放这里 -->
<?php } ?>

提示:加显示判断函数,代码必须添加在页脚模板里面的<?php wp_footer(); ?>函数上面,否则无效。

© 版权声明
THE END
点赞10 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容