阻止WordPress向页面中嵌入的Java脚本添加换行符

时间:2016-03-28 作者:TecBrat

在Wordpress中的页面上,如果输入以下代码:

var r=\'<li><a href="#"><img src="\' + slide.src + \'" width="50" height="50" /></a></li>\';
它在浏览器中呈现为

  var r=\'
<li><a href="#"><img src="\' + slide.src + \'" width="50" height="50" /></a></li>

\';
它在FF控制台中给了我这个错误SyntaxError: unterminated string literal var r=\'

这是一个单用户博客,所以我是“管理员”。

如何防止Wordpress污染我的代码?

4 个回复
SO网友:Dave

在新的WordPress(WP 5+)编辑器Gutenberg中,您可以使用“自定义HTML”块来防止自动换行和段落:

在Visual Editor上,单击+>格式>自定义HTML-并将JavaScript放入其中

在代码编辑器中,用<!-- wp:html --> <!-- /wp:html -->

SO网友:Philipp

The Problem

真烦人!WordPresswpautop 解析整个页面,并在HTML代码中的某些标记后添加换行符。不幸的是,WP无法识别javascript中何时出现HTML字符串,这可能会打乱页面的JS源代码!!

// This breaks your JS code:
<script>
json={"html":"<ul><li>one</li><li>two</li></ul>"};
</script>

// After wpautop is done with your code it becomes invalid JSON/JS:
<script>
json={"html":"<ul>
<li>one</li>
<li>two</li>
</ul>"};
</script>
<小时>★★ Easy solution ★★

wpautop 内置了一个小异常:它不会在内部添加换行符<pre></pre> blocks:)我们可以利用这一点,只需将<script> 标记为<pre>:

// Simple solution!
<pre><script>
json={"html":"<ul><li>one</li><li>two</li></ul>"};
</script></pre>

// Extra: Add |style| to ensure the empty <pre> block is not rendered:
<pre style="display:none"><script>
json={"html":"<ul><li>one</li><li>two</li></ul>"};
</script>

SO网友:markratledge

您必须将函数括在<script> 标记,然后

1) 去掉脚本中的所有空白,这样WordPress就不会添加<p> 标记,然后JS将工作,或者

2) 禁用autop 在所有帖子/页面的帖子编辑器中(请参见http://codex.wordpress.org/Function_Reference/wpautop ) 因此WP不会添加段落分隔符,或者

3) 执行以下操作autop 全局启用,但允许在单个帖子和页面中使用和标记禁用它。

Add the function below to functions.php and use the two tags

<!-- noformat on --><!-- noformat off -->

in your page/post editor, i.e.

    text will be rendered *with* autop

    <!-- noformat on -->

    text will be rendered *without* autop

    <!-- noformat off -->

    text will be rendered *with* autop
如上所述,两个格式标记之外的内容将启用自动转换。

Add to functions.php of the theme:

// <!-- noformat on --> and <!-- noformat off --> functions

function newautop($text)
{
    $newtext = "";
    $pos = 0;

    $tags = array(\'<!-- noformat on -->\', \'<!-- noformat off -->\');
    $status = 0;

    while (!(($newpos = strpos($text, $tags[$status], $pos)) === FALSE))
    {
        $sub = substr($text, $pos, $newpos-$pos);

        if ($status)
            $newtext .= $sub;
        else
            $newtext .= convert_chars(wptexturize(wpautop($sub)));      //Apply both functions (faster)

        $pos = $newpos+strlen($tags[$status]);

        $status = $status?0:1;
    }

    $sub = substr($text, $pos, strlen($text)-$pos);

    if ($status)
        $newtext .= $sub;
    else
        $newtext .= convert_chars(wptexturize(wpautop($sub)));      //Apply both functions (faster)

    //To remove the tags
    $newtext = str_replace($tags[0], "", $newtext);
    $newtext = str_replace($tags[1], "", $newtext);

    return $newtext;
}

function newtexturize($text)
{
    return $text;   
}

function new_convert_chars($text)
{
    return $text;   
}

remove_filter(\'the_content\', \'wpautop\');
add_filter(\'the_content\', \'newautop\');

remove_filter(\'the_content\', \'wptexturize\');
add_filter(\'the_content\', \'newtexturize\');

remove_filter(\'the_content\', \'convert_chars\');
add_filter(\'the_content\', \'new_convert_chars\');

SO网友:BaseZen

这是我的版本newautop 根据以上内容改编:

function toggleable_autop($text, $filter_state = \'autop_enabled\') {
    /* Each tag is associated with the key that will toggle the state from current */
    $filter_driver = [
        \'autop_enabled\' => [ \'tag\' => \'<!-- noformat on -->\', \'filter\' => function($text) { return convert_chars(wptexturize(wpautop($text))); } ],
        \'autop_disabled\'  => [ \'tag\' => \'<!-- noformat off -->\', \'filter\' => function($text) { return $text; } ],
    ];

    if ( strlen($text) === 0 ) {
        return \'\';
    }

    $end_state_position = strpos($text, $filter_driver[$filter_state][\'tag\']);
    if ( $end_state_position === false ) {
        $end_state_position = strlen($text);
    }
    return $filter_driver[$filter_state][\'filter\'](substr($text, 0, $end_state_position))
        . toggleable_autop(
            substr($text, $end_state_position + strlen($filter_driver[$filter_state][\'tag\'])),
            $filter_state === \'autop_enabled\' ? \'autop_disabled\' : \'autop_enabled\'
        );
}