每当看到别人的博客或者网站有非常好玩的、很酷的、绚丽的效果总想着让自己的博客也要和他们一样的效果,于是便千方百计的找教程如何实现,从此就走上了乐此不疲的瞎折腾之路,而且是越走越远! 好了,废话不多话,我们继续折腾……
开启关闭按钮 有时候我们发现一个好玩的效果将它放在自己的博客里,但是过一段时间看腻了又把它删掉了,然后再过一段时间又脑残的又想要那种效果,于是再添加进来,这样不用就删,用了再添加非常的麻烦。不如直接弄了开启关闭的按钮,用的时候点开启,不用的时候点关闭,这样就简单的多了,那么怎么实现呢? 在主题文件夹中找到functions.php文件,在里面最下面添加以下代码:
1 2 $xiaxue (可以是英文、数字、组合等,比如我弄个下雪的开启关闭按钮就写成下雪的拼音:xiaxue) = new Typecho_Widget_Helper_Form_Element_Select('xiaxue(和前面的英文标识要一致)' ,array (0 =>'不开启' ,1 =>'开启' ),0 ,'按钮功能标题' ,'按钮功能介绍' ); $form ->addInput($xiaxue (和前面的英文标识要一致));
接着在需要展示的特效代码前面加以下代码:
1 2 3 <?php if ($this -> options -> xiaxue(和前面的英文标识要一致) == '1' ): ?> 特效代码<?php endif ; ?>
自定义内容 有时候想在博客里加一些自定义内容,如运行时间,公告,提醒等等,该怎么实现呢? 还是在主题文件夹中找到functions.php文件,在里面最下面添加以下代码:
1 2 3 4 5 6 7 $gonggao (可以是英文、数字、组合等,比如我弄个公告的内容按钮就写成公告的拼音:gonggao) = new Typecho_Widget_Helper_Form_Element_Text( 'gonggao(和前面的英文标识要一致)' , NULL , NULL , '内容说明' , '内容介绍' ); $form ->addInput($gonggao (和前面的英文标识要一致));
然后在需要些内容的地方加入以下代码:
1 2 3 4 5 6 7 <?php if ($this ->options->gonggao) : ?> <?php $adContent1 = $this ->options->JADContent1; $adContent1Counts = explode("||" , $adContent1 ); ?> 特效代码中需要输出内容的地方替换成<?php echo $adContent1Counts [0 ] ?> ,如果需要写多处内容的话可以用<?php echo $adContent1Counts [1 ] ?> 、<?php echo $adContent1Counts [2 ] ?> 、<?php echo $adContent1Counts [3 ] ?> 表示 <?php endif ; ?>
上面的内容用||隔开,例如想加一个图片链接:
1 2 3 4 5 6 7 8 9 <?php if ($this ->options->gonggao(和前面的英文标识要一致)) : ?> <?php $adContent1 = $this ->options->JADContent1; $adContent1Counts = explode("||" , $adContent1 ); ?> <a href =" <?php echo $adContent1Counts [1 ] ?> " > <img src =" <?php echo $adContent1Counts [0 ] ?> " > </a > <?php endif ; ?>
内容写:图片地址||链接地址 如:https://laolion.com/img/ico.png||https://laolion.com/
自定义宽度隐藏 有的时候我们放一段特效代码希望只在电脑端显示,手机端不显示(或者手机端显示,电脑都不显示),该如何实现呢? 首先要确保改特效代码有class属性,如果没有的话就新建一个class。 如:我像要一张图片在电脑端显示,手机端不显示,那就先在图片代码里加一个class,如下:
1 <img class ="haha (随便写,只要和其他CLASS 重复就可以)" src ="图片地址" >
然后在主题的style.CSS文件(不同的主题CSS文件不一样,如JOE主题的CSS文件是在assets/css/joe.min.css)里最下面加以下代码:
1 2 3 4 5 @media (max-width : 768px ) { .haha (和上面的class标识一致) { display : none !important ; } }
以上代码中768px是最大宽度,意思是大于768px显示代码,小于768px就不显示,可以根据自己的情况修改宽度,当然也可以改成高度:max-width
来源:https://laolion.com/