怎么将html代码放到wordpress

1,登录wordpress管理后台。

2,新建文章,看看这个“可视化”选项卡下的编辑器。的确不是很让人满意。

3,没事,还是那句话,这不叫问题。进入插件安装,查找“CKEditor”。安装并启动插件。

4,开始测试下。新建文章看看。点击“可视化”选项。是不是可以像编辑word文档那样编辑

5,试试字体颜色与大小。别激动!就是这么简单。

首先,你要懂一点php和div+css

如果,html静态页面不是,div+css结构,需要先修改为div+css

然后,修改模板样式为静态html样式,

css部分写到style.css里面。

背景图片放到images文件夹。

建议,在wordpress默认的主题修改,以*悉wordpress基本的文件和代码结构

具体的函数知识可以百度关键词:wordpress函数

然后,将html静态页面中的区块替换为php函数,

例如

用<?php the_title();?>替换标题

用<?php the_content();?>替换文章内容。

在制作wordpress主题猴子wordpress插件过程中,经常需要添加样式文件或者js脚本文件,由于大多数用户运行网站上多个插件,可能会加载

各式各样的文件,容易引起冲突,所以wordpress系统为开发者提供了一个很好的脚本及样式文件的排队系统,这有助于防止插件之间的脚本冲突问题。这

篇文章中,主要介绍wordpress中添加Javascript文件与css文件的方法,对那些刚开始学习WordPress主题和插件的开发是特别有

用的。

错误方式

wordpress中提供了wp_head钩子来帮助在页面的头部添加指定的头部消息,比如常见的关键词与描述,很多人也同样会使用这种方式来添加站点的外部样式文件与脚本文件,添加代码如下:

<?php

add_action('wp_head','wpb_bad_script');

function wpb_bad_script(){

echo'<script type="text/javascript" src=""></script>

';//添加js文件

}

?>

这种方式虽然使用简单,但是非常不推荐使用,这种加载方式容易造成wordpress脚本的冲突。

wordpress脚本排队系统

1、介绍

wordpress在全球拥有强大的开发社群,很多人都非常积*的参与到wordpress的主题与插件的开发当中,并且可以免费使用,为了防止各个开

发者开发的插件在使用过程总出现脚本冲突的问题,wordpress提供了一个非常强大的脚本加载函数wp_enqueue_script,通过这个函

数,可以告诉wordpress在哪加载脚本,脚本依赖哪些框架,而且该函数在利用内置的Javascript库时,可以避免多次加载同一个脚本。这有助

于减少页面加载时间,以及避免与其他主题和插件冲突。

2、使用实例

wordpress正确加载脚本的使用很简单,代码如下:

<?php

function wpb_adding_scripts(){

wp_register_script('my_amazing_script', plugins_url('amazing_script.js', __FILE__), array('jquery'),'1.1', true);

wp_enqueue_script('my_amazing_script');

}

add_action('wp_enqueue_scripts','wpb_adding_scripts');

?>

可以将以上代码放入你的插件文件中或者你主题的functions.php文件。

说明:

实例中首先通过函数wp_register_script(),这个函数接收5个参数:

$handle

(string)(必须)脚本名称.名称必须**在之后函数 wp_enqueue_script()会使用到该名称.

Default: None

$src

(string)(必须)脚本路径,可以使用**路径。

Default: None

$deps

(array)(可选)脚本依赖包,依赖包会在脚本加载之前预先加载。

Default: array()

$ver

(string)(可选)脚本版本控制。

Default: false

$in_footer

(boolean)(可选)定义脚本的位置,如果为true脚本会在页面底部加载,默认在head头部加载。

Default: false

当使用wp_register_script()函数注册脚本文件后,就可以使用函数wp_enqueue_script()函数来加载该注册的脚本文件。

也许有人会问为什么不直接加载脚本文件,而是先注册后加载,这不是多此一举吗。其实这主要是为了站点其他开发者在其他插件或者主题总方便引用核心脚本文件。

wordpress如何加载CSS样式文件

wordpress css样式文件的加载与以上介绍的脚本文件加载方式是一样的,如下实例:

<?php

function wpb_adding_styles(){

wp_register_script('my_stylesheet', plugins_url('my-stylesheet.css', __FILE__));

wp_enqueue_script('my_stylesheet');

}

add_action('wp_enqueue_scripts','wpb_adding_styles');

?>

以上实例用了wp_register_script钩子来加载样式文件。

实例中使用了plugins_url()来获取样式文件的路径,这个一般在插件开发过程中使用的居多,如果主题中开发使用到

wp_register_script()函数则可以使用get_template_directory_uri()来获取样式文件路径,如果是子主题中

使用,则可以使用函数get_stylesheet_directory_uri()来获取路径,实例如下:

<?php

function wpb_adding_scripts(){

wp_register_script('my_amazing_script', plugins_url('amazing_script.js', __FILE__), array('jquery'),'1.1', true);

wp_enqueue_script('my_amazing_script');

}

add_action('wp_enqueue_scripts','wpb_adding_scripts');

?>

1、打开wordpress首页,点击左侧工具栏里面的“外观”-“编辑”。

2、然后页面中,点击右侧的模板,找好想要修改的模板,点击进入。

3、点击之后,下滑页面,然后找到要修改的是文章页面(single.php)选项进入。

4、*后,可以看到模板中相应的位置,添加上事先准备的代码。回车键更新文件,即可修改成功,这样操作即可完成。

相关文章
在线客服
微信联系
客服
扫码加微信(手机同号)
电话咨询
返回顶部