web-dev-qa-db-ja.com

Yoastを追加する方法wordpressプラグインlaravel

Laravelを使用してWebサイトを開発しています。次に、サイトのブログを改善するためにブロガーセクションにYoastプラグインを追加したいと思います。
Yoast githubから確認できるように、カスタムサイトに追加できる javascript version があります。
使用法のヘルプはあまり役に立たないので、もし誰かが私を助けてくれるなら。

var SnippetPreview = require( "yoastseo" ).SnippetPreview;
var App = require( "yoastseo" ).App;

window.onload = function() {
var focusKeywordField = document.getElementById( "focusKeyword" );
var contentField = document.getElementById( "content" );

var snippetPreview = new SnippetPreview({
    targetElement: document.getElementById( "snippet" )
});

var app = new App({
    snippetPreview: snippetPreview,
    targets: {
        output: "output"
    },
    callbacks: {
        getData: function() {
            return {
                keyword: focusKeywordField.value,
                text: contentField.value
            };
        }
    }
});

app.refresh();

focusKeywordField.addEventListener( 'change', app.refresh.bind( app ) );
contentField.addEventListener( 'change', app.refresh.bind( app ) );
};

使用法のヘルプはnode.jsですが、phpバックエンドとhtml + jsフロントエンドに追加するにはどうすればよいですか。
ありがとうございます。

javascriptphplaravelbrowserifyyoast
23
soha1410

検索の数日後、最終的に答えを見つけます。このまたは任意の種類のnodejsライブラリを、サポートされているブラウザのjavascriptに変換するには、 browserify に移動します。最初にそれをインストールします

  npm install -g browserify

次に、必要なすべてのライブラリをインストールします

   npm install <module_name>

最後に単一のjsファイルを生成します

   browserify <main.js> -o  <destination.js>

今、あなたはあなたのようなHTMLにスクリプトを追加することができます

   <script src="destination.js"></script>

yOASTライブラリの場合、例にはbrowserifyディレクトリがあります。ルートディレクトリのindex.jsファイルにbrowserifyを使用して、生成されたファイルをこのサンプルhtmlファイルに追加すると、すべてが魅力のように機能します。

13
soha1410