编辑wordpress样式表并使用php&阿贾克斯

时间:2014-01-31 23:55:12

标签: php jquery ajax wordpress

我想在我的网站上创建一个设置部分,以便我可以更改样式,所以如果我选择蓝色,它会将背景更改为蓝色并保存外部样式表,这样当我重新加载页面时,它仍然会是蓝色的。

我不知道如何做到这一点,所以它只是目前的基本代码。

我知道我需要html复选框代码,然后jquery会记下被选中的内容,ajax& php将更新样式表。

我只是不知道怎么办?

这是html代码

<div class="container">
  <input type="radio" name="colours" value="red" checked> red
  <input type="radio" name="colours" value="blue">blue
</div>

这是css

* {
padding:0;
margin:0;
}
html, body {
width:100%;
height:100%;
}
.container {
width:100%;
height:100%;
background:red;
}

这是我到目前为止的php:     

// edit these values to match your database information
$server = "localhost";
$user = "******";
$password = "*******";
$db = "******";

$con = mysql_connect($server,$user,$password); 

if (!$con) {
die("database connection error");
} else {

mysql_select_db($db, $con);

$file = 'get_site_url();/style.css';
// Open the file to get existing content
$current = file_get_contents($file);

// Write the contents back to the file
$test = file_put_contents($current, $current);

echo '

<form action="" method="POST">
<textarea name="stylesheet">'. $current .'</textarea>
<input type="submit">
</form>
';

}
mysql_close($con);
?>

1 个答案:

答案 0 :(得分:0)

除了将此面板限制在全球范围内的一般警告之外,您还需要先检查提交的表单。您可能需要检查$ _POST ['submit']并为提交按钮指定名称:

<form action="" method="POST">
<textarea name="stylesheet"><?php echo $current; ?></textarea>
<input type="submit" name="submit" value="Submit">
</form>

然后在PHP中检查是否设置了提交:

if(isset($_POST['submit']))
{
    $fp = fopen( get_site_url() .'/style.css', 'w');
    fwrite($fp, $_POST['stylesheet']);
    fclose($fp);
}

不确定你的sql需要什么,但是你没有使用那个连接。 整件事情是:

<?php
if(isset($_POST['submit']))
{
    $stylesheet = $_POST['stylesheet'];
    $stylesheet = preg_replace('/(background:)(.*)(;)/', '$1'.$_POST['colours'].'$3', $_POST['colours'], $stylesheet);
    $fp = fopen( get_site_url() .'/style.css', 'w');
    fwrite($fp, $stylesheet);
    fclose($fp);
}
else
{
    $filename = get_site_url() .'/style.css';
    $handle = fopen($filename, "r");
    $stylesheet = fread($handle, filesize($filename));
    fclose($handle);
}
?>
<form action="" method="POST">
<textarea name="stylesheet"><?php echo $stylesheet; ?></textarea>
<input type="radio" name="colours" value="red" checked> red
<input type="radio" name="colours" value="blue">blue
<input type="submit" name="submit" value="Submit">
</form>

假设get_site_url()解析为该文件的服务器路径。您可能希望使用$_SERVER['DOCUMENT_ROOT'] . '/style.css',具体取决于此文件实际所在的位置。

另一方面,此示例还假设您从样式表的内容开始。您可以使用正则表达式来查找和替换要编辑的样式的值。您将希望在实际案例中更具体,但因为这将替换background:和;

之间的任何内容

以下是在wp插件中使用ajax的链接: http://codex.wordpress.org/AJAX_in_Plugins

设置一个插件作为ajax需求的请求处理程序非常简单