2017-11-04 10 views
0

Jekyllは、個人的なプロジェクトのためのシンプルでブログを意識した静的サイトジェネレータです。このようなRubyプロジェクトにスクリプトタグを追加するにはどうすればいいですか?jekyllにscriptタグを追加するには?

私のindex.htmlは次のようになります。

--- 
layout: default 
--- 

<div class="home"> 

    <h1 class="page-heading">Posts</h1> 

    <ul class="post-list"> 
    {% for post in site.posts %} 
     <li> 
     <span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span> 

     <h2> 
      <a class="post-link" href="{{ post.url | prepend: site.baseurl }}">{{ post.title }}</a> 
     </h2> 
     </li> 
    {% endfor %} 
    </ul> 

    <p class="rss-subscribe">subscribe <a href="{{ "/feed.xml" | prepend: site.baseurl }}">via RSS</a></p> 

</div> 

フォルダ構造も、このようなファイルとフォルダで構成されていますabout.md _config.yml css feed.xml _includes index.html _layouts _posts _sass _site

私は、静的なWebページのジキルプラットフォームを探求しようとしています。

答えて

1

ステップ1:スクリプトファイルを作成します。

通常のようにスクリプトファイル(.js)を作成します。

次の例のように、適切なフォルダに保存することがあります:

../assets/js/some-script.js

あなたはそれを持っていない場合は/assets/フォルダを作成する必要があるかもしれません。

フォルダ名の前にアンダースコア(_)を使用しないでください。そうすれば、Jekyllはそのフォルダと内容を静的アセットとして `_site 'のビルドに単純にコピーします。

ステップ2:あなたのhtmlでスクリプトを呼び出してください。

...<script src="{{ base.url | prepend: site.url }}/assets/some-script.js"></script>...:あなたがそれを望むよう

は、次に同じように、それを呼び出します。

スクリプトをすべてのページで使用できるようにするには、default.htmlレイアウトファイルに電話をかけます。そのdefault.htmlレイアウトを使用するすべてのページがスクリプトを呼び出します。そのレイアウトファイルは_layouts/default.htmlにあります。

あなたの現在のページにしたい場合は、同じ方法でsome-page.mdマークダウンで呼び出すだけです。

Googleアナリティクススクリプトなどのように、ライブのときに呼び出すだけで、電話をかけたくない場合は、

というif文で呼び出しをラップします

{% if site.environment == "production" %}<script src="//localhost:35729/livereload.js"></script>{% endif %}

希望します。

関連する問題