Question

我有一个Teamspeak状态查看脚本托管在与我的wordpress不同的域上。所以我试图使用iframe在text / html小部件中显示脚本结果，除非它不会自动调整高度。 Wordpress在共享主机上，因此该脚本不会从那里与我的teamspeak服务器通信。我找不到任何其他ts3查看器在自动隐藏空通道时工作而不是完全丑陋。在做了一些研究后，我发现了似乎是最新最好的解决方案David J Bradshaw's iframe-resizer。现在我不是这方面的专家，也不完全理解我应该如何正确地设置它。

目前我的wordpress小部件如下所示：

<iframe src="http://66.172.12.238/ts3.php" width="100%" scrolling="no"></iframe>

ts3.php读起来像这样：

<html>
<head>
<title>TSStatus</title>
<link rel="stylesheet" type="text/css" href="/ts3/tsstatus.css" />
<script type="text/javascript" src="/ts3/tsstatus.js"></script>
</head>
<body>
<?php
require_once("/var/www/ts3/tsstatus.php");
$tsstatus = new TSStatus("ts3.greatarchitect.us", 10011);
$tsstatus->useServerPort(9987);
$tsstatus->imagePath = "/ts3/img/";
$tsstatus->timeout = 2;
$tsstatus->hideEmptyChannels = true;
$tsstatus->hideParentChannels = true;
$tsstatus->showNicknameBox = false;
$tsstatus->showPasswordBox = false;
echo $tsstatus->render();
?>
</body>
</html>

这就是我现在所拥有的一切。我希望有人可以帮我正确安装/设置这个iframe-resizer。

谢谢。

Answer 1

您似乎需要在http://66.172.12.238/ts3.php

中添加js文件您网页的

See fiddle here和插件页面的示例。

您需要添加此js文件：

<script type="text/javascript" src="http://davidjbradshaw.com/iframe-resizer/js/iframeResizer.contentWindow.min.js"></script>

我不知道你是否知道如何将额外的js文件加载到Wordpress。如果没有，请在此处阅读http://codex.wordpress.org/Function_Reference/wp_enqueue_script

将js文件添加到Wordpress

我会将它添加到自己的js文件中以执行缩放器，我将它命名为iframe.js：

iFrameResize({
    log                     : true,                  // Enable console logging
    enablePublicMethods     : true,                  // Enable methods within iframe hosted page
});

将此添加到主题的functions.php文件中：

    function theme_name_scripts() {
        wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/iframeResizer.min.js ', array(), '1.0.0', true );
        wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/iframe.js ', array(), '1.0.0', true );
    }

add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

确保在themefolder/js/文件夹中添加iframeResizer.min.js和iframe.js。

您可以编辑iframe.js脚本，因为您不需要插件的额外选项！

使用David J Bradshaw的iframe-resizer

1 个答案: