WordPress文本小工具实现侧边栏一图三按钮

作者 : 轩寒 本文共1228个字,预计阅读时间需要4分钟 发布时间: 2022-05-21 共38人阅读
也想出现在这里? 联系我们

Hello,哈友们,这里是站哈源码网。
今天给各位哈友们推送的是【技术】的相关文章,感谢您宝贵的时间阅读!

WordPress文本小工具实现侧边栏一图三按钮插图

看群里小伙伴经常在问我这个怎么弄的,这里也就分享下,其实我也是在boke112看到的,也就来使用上了。

侧边栏实现一图三按钮效果步骤

1、将以下 CSS 代码添加到所使用主题的 style.css 文件中

  1. #update_version img{margin:5px 0 15px}
  2. #update_version a{width:30%;height:35px;border-radius:3px;text-align:center;line-height:35px;font-size:9pt;color:#fff}
  3. .blog_link{background-color:#2ba9fa}
  4. .blog_link,.cms_link{float:left;margin-right:5%}
  5. .cms_link{background-color:#ff6969}
  6. .grid_link{float:left;background-color:#70c041}

2、使用 文本 小工具,添加到指定侧边栏中。

3、将文本小工具编辑框切换到文本格式,将以下代码添加进去并保存即可。

  1. <div id="update_version">
  2. <a href="https://www.zhushuming.cn/bulletin/2216.html" target="_blank" rel="noopener"><img title="投稿" src="https://www.zhushuming.cn/wp-content/uploads/2017/12/2017123107430551.jpg" alt="投稿" /></a><a class="blog_link" href="http://vip.zhushuming.cn/v.html" target="_blank" rel="noopener">VIP解析</a><a class="cms_link" href="http://v.zhushuming.cn/" target="_blank" rel="noopener">520影院</a><a class="grid_link" href="http://vip.zhushuming.cn/" target="_blank" rel="noopener">1314影院</a>
  3. 投 稿QQ:<b>2132039161</b>
  4. 投稿邮箱:<b>2132039161@qq.com</b>
  5. 交流 Q群:<b>560338405</b>
  6. </div>

说明:其他代码不用修改,只需将代码中的链接名称及链接地址等内容修改成自己想要的名称及地址即可。

版权免责声明

① 本站VIP源码资源永久免费下载 www.wayu.cn;
② 本网站资源来源于网络收集,如有侵权,请联系站长进行删除处理;
③ 分享目的仅供大家学习和交流,请不要用于商业用途,否则后果自负;
④ 如果你有源码需要出售,可以联系小编,或者点击 投稿
⑤ 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解;
⑥ 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需;
⑦ 在您的能力范围内,为了大环境的良性发展,请尽可能的选择正版资源;
⑧ 网站资源不做任何二次加密和授权后门(原版加密除外)。


站哈源码网 » WordPress文本小工具实现侧边栏一图三按钮

发表评论

Copyright© 2022 by-站哈源码网 & 站内部分资源收集于网络,若侵犯了您的合法权益,请联系站长删除!
在 0.556 秒钟有 45 次查询。