更新完成,  网站搭建,  美图美工

网站添加flash动画

2020年5月10日 /
Table of contents
内容 隐藏
必读：
建议小白直接跳到第四步（比如我）
使用子主题存在的问题
1 获取WordPress子主题
2 安装WordPress子主题
2.1 找到外观选项卡，点击添加
2.2 然后才能看到上传主题选项卡
2.3 上传完成，选择安装，并点击下面的启用键
2.4 注意：操作完成后，主题将会进入初始界面
3 修改style.css和functions.php
3.1 选择模板函数
3.2 添加完成后点击下面的更新文件选项
4 直接添加文本
4.1 找到外观-小工具
4.2 添加文本
4.3 完成效果
其它方法
1.插件
2.代码
不用这个插件也可以嵌入swf文件
Related posts:

本文于2020年5月10日由AlvinCR更新

文章导引

必读：

建议小白直接跳到第四步（比如我）

更简单但是更新主题版本会消失的方案，使用子主题存在一定问题，直接跳转到第四步即可（添加文本）

最终效果可以访问我的主页http://alvincr.com/

使用子主题存在的问题

2020.5.10我自己设置中出现两个致命问题：

（1）个人找不到将其添加到侧边栏的方法，默认将其添加到页面顶部，并且测试时发现，ashe的CSS文本我没仔细读，这个问题也可以通过使用flash插件解决。

（2）使用子主题出现无法上传背景图片的情况，媒体库也打不开。

1 获取WordPress子主题

目的：由于更新主题版本会将自主添加的脚本全部重置，所以通过修改子主题的方式，以保留自主修改的内容。

原理：子主题相当于在调用父主题的基础上，通过额外的文本保留自定义操作。

因为每个主题的子主题并不相同，所以我们首先要获取对应的子主题，如果主题有子主题，建议你可以直接下载它的子主题

如果主题作者并未提供子主题，在这里我们为大家介绍一个子主题生成网站 Child Theme Generator

比如想要制作一个最新版的 Twenty Nineteen 的子主题，只需要在这里面填写主题信息

这里面有2个参数需要注意，The slug of your Parent Theme，这里填写的是父主题的文件夹名称，子主题的文件夹最好也和父主题对应，比如后边加上-child

信息确认后，点击Create your child theme now，网站就会生成对应的子主题文件，将其下载下来

备注：必须是在库里收录的主题才能够一键创建子主题。

​

2 安装WordPress子主题

一开始我找了半天怎么上传主题的方法，真的是半天时间，查了各种网站都没找到，然后才发现是我没看到上传按钮….

2.1 找到外观选项卡，点击添加

​

2.2 然后才能看到上传主题选项卡

​

2.3 上传完成，选择安装，并点击下面的启用键

​

2.4 注意：操作完成后，主题将会进入初始界面

设定好的内容将重置，但是父主题并没有改变，仅仅是子主题没有继承父主题的部分设定而已，并且重置图片上面自定义选项中的内容，这个步骤花不了多长时间。

​

3  修改style.css和functions.php

进入外观-主题编辑器 就能看到已经加载好的子主题编码界面。

​

3.1 选择模板函数

以添加仓鼠flash为例，其它flash代码可以自己网上找资源。

代码网站：http://abowman.com/

人形时钟代码

<div height=”120″ width=”150″ align=”center”>
<embed height=”120″ width=”150″ type=”application/x-shockwave-flash”
pluginspage=”http://www.macromedia.com/go/getflashplayer”
src=”http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.swf”
quality=”high” autostart=”1″ wmode=”transparent”>
</div>

仓鼠falsh相关代码

<div height=”120″ width=”150″ align=”center”>
<embed type=”application/x-shockwave-flash”
src=”http://cdn.abowman.com/widgets/hamster/hamster.swf” width=”210″ height=”176″
id=”flashID” name=”flashID” bgcolor=”#FFFFFF” quality=”high”
flashvars=”up_backgroundColor=FFFFFF” wmode=”opaque” allowscriptaccess=”always”>
</div>

小仓鼠说明

1.当你长时间不理它的时候，它会安安静静地睡觉。

2.它会随着你的鼠标移动而移动。

3.点击空白处，可以喂栗子给它。

4.当你不理它的时候，它有时会在仓鼠轮里面拼命地跑步，有时不知道要干什么。

5.跑步累了或是栗子吃多了，它就会去喝水。

通过修改代码中的width和height值的大小，可以改变插件的大小。

3.2 添加完成后点击下面的更新文件选项

​

4 直接添加文本

4.1 找到外观-小工具

​

4.2 添加文本

自己命名标题，选择右上角的文本选项，并将上面的代码复制进去，然后保存即可（如果选择可视化进行复制，会出现提示进入文本界面）

主题：刚添加文本的时候并不会直接显示flash动画，我这个是为了演示重新进入所显示的效果

4.3 完成效果

可以访问我的主页alvincr.com进行查看

​

其它方法

1.插件

也可以使用flash插件进行完成，不过我没找到合适的插件，可能是因为这个太基础了。

网上有说使用Top Flash Embed可以进行操作的，但是我在WP官方插件库并没有找到，也可以用其它插件或是自己添加从网络下载的Top Flash Embed。

2.代码

不用这个插件也可以嵌入swf文件

从前台的代码可以看出，这个插件起到的作用就是让嵌入swf的工作轻松了一点，其实不用Top Flash Embed插件，我们直接在编辑器里面粘贴代码页可以实现一样的效果。

<object width="282" height="400" data="https://s.wpzhiku.com/wp-content/uploads/2014/07/nnba80ctzyod.swf" type="application/x-shockwave-flash">
<param name="movie" value="https://s.wpzhiku.com/wp-content/uploads/2014/07/nnba80ctzyod.swf" />
<param name="quality" value="best" />
<param name="wmode" value="transparent" />
<param name="scale" value="default" />
<param name="FlashVars" value="" />
<param name="allowFullScreen" value="false" />
</object>

上面的几段代码就是插件由插件生成的简码转换而来的，多了两部转化的过程，程序上的效率肯定会低一些，操作上却方便了很多，拿程序的运行效率换操作上的简便，还是比较划算的，毕竟程序被写出来就是为人类服务的。

参考：

★ https://blog.51cto.com/983836259/1740103

http://woocommerce.chongyuan.cc/set-up-and-use-a-child-theme.html

https://themeforwp.net/archives/wordpress-edit-functions-php/

https://themeforwp.net/archives/wordpress-use-child-theme/

https://blog.csdn.net/qq_41363534/article/details/88921426

WP后台统计异常-独立IP访问量突然极低的解决方法
UE4-1-渲染总览（蒙特卡罗方法、可视性、GBuffer、反射、动态光照阴影、后期处理）
各种字幕类型整理及制作流程
vm安装win10的虚拟机方法及问题记录

65条评论

 较早评论

留言

您的电子邮箱地址不会被公开。 必填项已用*标注