QQ爹博客 QQ爹博客

模板层面向typecho编辑器页面插入css js

in Typecho 文章转载请注明来源!

大家都知道在functions.php中加入类似下面的代码,会强行为每个文章(即文章编辑页面)设置一个自定义字段

function themeFields($layout) {
    $thumb = new Typecho_Widget_Helper_Form_Element_Text('thumb', NULL, NULL, _t('自定义缩略图'), _t('描述文字'));
    $layout->addItem($thumb);
}

然而经过我大脑灵光一现,想到了个有趣的点子,上面代码中描述文字是支持html格式的,这个其实都是众所周知的事情。
那么事情就变得有趣了,我们是否可以通过这个描述文字插入css或者js呢,答案是肯定的。于是代码改成

function themeFields($layout) {
    $thumb = new Typecho_Widget_Helper_Form_Element_Text('thumb', NULL, NULL, _t('自定义缩略图'), _t('输入缩略图地址(仅文章有效)<style>.wmd-button-row {height:auto;}.copyright p:after {content: "YoDu魔法优化中";margin-left: 6px;font-size: 12px;}</style>'));
    $layout->addItem($thumb);
}

测试了下完全ojbk,其中.wmd-button-row {height:auto;}是优化编辑器手机端显示不全的问题,另外一行代码.copyright p:after {content: "YoDu魔法优化中";margin-left: 6px;font-size: 12px;}纯粹为了装逼,效果如下

YoDu魔法png

js代码没有测试,应该也是ok的,谁有好用的点子,欢迎分享哈!!!

虽然方法傻瓜了点,但是我觉得这种奇葩方式挺有趣的233

jrotty WeChat Pay

微信打赏

jrotty Alipay

支付宝打赏

文章二维码

扫描二维码,在手机上阅读!

本文基于《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权
文章链接:https://qqdie.com/archives/typecho-insert-css-js.html (转载时请注明本文出处及文章链接)

typecho模板
发表新评论
已有 14 条评论
  1. 逗妇乳
    逗妇乳
    回复

    firefox 57点不到你的评论框,都是点表情让输入光标focus到你的输入框。还有那个输出两次的问题用变量判断一下就行了,如果变量定义过,js不执行

  2. c0smxsec
    c0smxsec
    回复

    @(滑稽) 难道还有这种操作。

    1. Jrotty
      Jrotty本文作者
      回复

      @c0smxsec 这篇不正规,看下一篇那个文字吧 @(滑稽)

  3. Waxxh
    Waxxh
    回复

    我对魔法略知一二 @(滑稽)

  4. 落叶大大
    落叶大大
    回复

    我看到jinbo 了 @(滑稽)

  5. Archeb
    Archeb
    回复

    貌似直接在themeFields函数里输出就可以了.... @(吐舌)

    1. Jrotty
      Jrotty本文作者
      回复

      @Archeb 我才知道,哭 @(泪)

  6. 狂放
    狂放
    回复

    有毒魔法优化 @(滑稽)

    1. Jrotty
      Jrotty本文作者
      回复

      @狂放 看样子你中毒了

前篇 后篇