Google SEO“零基础”入门学习:入门Google SEO:零基础在线云学习
2019 Google SEO培训课:玩转Google SEO:谷歌SEO从入门到精通

wordpress增加ICO图标在线转换工具页面

分类: wordpress DIY 作者: 为主的祥助 306次浏览 0评论

ICO图标在线转换页面可以从本地电脑一键上传logo等图片,将jpg、jpeg、gif、png等图像转换成ico图像,方便给网站制作针对浏览器显示的favicon.ico图标,提供ico图标下载

从蝈蝈的博客看到源码,为主的祥助略微修改了下源码,增加了获取wordpress博客的头部head和底部footer区域的函数调用,让这个单页面可以显示你博客的菜单,footer等区域,方便访客跳转访问博客的其他文章,也统一整体风格

ICO图标转换源码

ICO转换源码下载:链接: https://pan.baidu.com/s/1uMrbiHtKUkXgjkwUIbPnaQ 提取码: sftt

效果预览: 在线ICO图标转换工具

下载完成后解压文件,获得generate-ico-online文件夹,里面有如下内容:

css文件夹,img文件夹,favicon.php,index.php

安装步骤

1.使用Sublime Text 3或其他编辑器编辑index.php

2.第5行的代码如下:

include("/www/losvincent/wp-content/themes/sky1.0/generate-ico-online/favicon.php");

因为 generate-ico-online文件夹是要上传到主题目录下的,所以将代码中这个路径修改为对应你主题的路径

3.第10行代码是调用css文件,代码如下:

    <link rel="stylesheet" href="https://www.yunglobe.com/wp-content/themes/sky1.0/generate-ico-online/css/favicon.css" type="text/css" />

同理修改为对应你主题的路径

3.将generate-ico-online整个文件夹上传到主题目录下,如跨境E站的路径是:losvincent/wp-content/themes/sky1.0

4.进入wordpress后台-页面-新建页面,标题输入想输入的标题,如跨境e站使用的标题是: 在线ICO图标转换工具

5.页面属性-页面模板选择generate-ico-online,点击发布

刷新页面即可看到效果,如果部分区域不对,是因为主题的css的影响,F12审查元素找到对应位置,再去调试css即可

比如e站上出现了选择尺寸区域排版错乱,发现是主题style.css里的label{display:block;margin-bottom:5px}造成的, 权衡后删除 display:block 后正常

版权申明:跨境E站,版权所有丨如未注明,均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明本文作者和来源地址: https://www.yunglobe.com/generate-your-ico-online.html

转载请注明:跨境E站 » wordpress增加ICO图标在线转换工具页面

微信 OR 支付宝 扫描二维码
为本文作者 打个赏
pay_weixinpay_weixin
知识付费,金额随意 亲的支持是我更新的动力!~
喜欢 (4)or分享 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
QQ交流
  • 为主的祥助 点击这里给我发消息
旺旺
  • Vincent 点这里给我发消息
QQ群
  • 阿里巴巴国际站数据化运营 阿里巴巴国际站数据化运营
关注微信
  • 扫一扫,有惊喜
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册