4

私は、クライアントの最近のすべてのプロジェクトのポートフォリオセクションを持つMiddlemanを使用して静的サイトを構築しています。ポートフォリオセクションには、プロジェクトのサムネイル画像が3 X 3ギャラリー形式で表示され、クリックすると、ライトボックス内で対応するhtmlページが開きます。

ライトボックス内のページのレイアウトは同じなので、個々のページをマークアップするのではなく、[リンクを使用してyamlデータファイル(projects.yml)から提供されるコンテンツをMiddlemanが処理する方法があると思いました。

これが私のconfig.rbファイルにあるものです

###
# Page options, layouts, aliases and proxies
###

# A path which all have the same layout
with_layout :popup do
  page "/projects/*"
end

# Proxy (fake) files
# page "/this-page-has-no-template.html", :proxy => "/template-file.html" do
#   @which_fake_page = "Rendering a fake page with a variable"
# end
data.projects.details.each do |pd|
  proxy "/projects/#{pd[:client_name]}.html", "/projects/template.html", locals: { project: pd }, ignore: true
end
4

1 に答える 1

13

さて、掘り下げた後、私は以下の2つの投稿に出くわしました。これは、動的ページが仲介者でどのように機能するかを理解するのに役立ちました。(残念ながら、ドコはそれほど多くなく、動的ページのミドルマンの例は本当に基本的です)

http://benfrain.com/understanding-middleman-the-static-site-generator-for-faster-prototyping/ http://forum.middlemanapp.com/discussion/134/best-way-to-use-yaml- same-html-but-parameter-driven-data-fixed / p1

私の解決策...

data / projects.yml(プロジェクトの詳細が含まれています)

details:
  - client: "Company X"
    title: "Company X Event"
    video_url: ""
    logo: 
      - "logo_companyx.gif"
    image_path: "/img/projects/companyx"
    total_images: 10
    content: "<p>Blah blah blah</p>"
    responsibilities: 
      "<li>Something</li>
      <li>Some task</li>"

config.rb:

data.projects.details.each do |pd|
    proxy "/projects/#{pd[:client]}.html", "/projects/template.html", :layout => false, :locals => { :project => pd }, :ignore => true
end

上記のスニペットの秘訣は、ローカルを使用してプロキシ経由でプロジェクトデータオブジェクト全体をテンプレートに渡し、レイアウトをfalseに設定して、デフォルトのサイトレイアウトを継承しないようにすることです(私(またはクライアント)はこれらを表示したいので)ライトボックスポップアップで)

プロセスの最後のステップは、(ソースフォルダーに)/projects/template.html.erbを作成し、テンプレートの上部に次のように宣言することでした。

<% p = locals[:project] %>

これにより、template.html.erb内のpオブジェクトの各プロパティを出力できるようになりました。

例えば:

<%= p[:title] %>

これが誰かに役立つことを願っています。たとえば、オンラインで遊んだり、ヒントやヒントを検索したりするのに数日かかったからです。

于 2013-02-14T11:34:02.857 に答える