{{ ASSET_PATH }} only seems to work in _includes/theme/themename/default.html, leaves off theme name in post.html and page.html

Question

{{ ASSET_PATH }} only seems to work in _includes/theme/themename/default.html, leaves off theme name in post.html and page.html

imjared opened this issue 12 years ago · 11 comments

To reproduce:

rake theme:switch name="twitter"
add an image (foo.jpg) asset to assets/themes/twitter/
modify _includes/themes/twitter/page.html to include the image path using the liquid variable {{ ASSET_PATH }}:

<div class="page-header">
  <h1>{{ page.title }} {% if page.tagline %} <small>{{ page.tagline }}</small>{% endif %}</h1>
  <img src="{{ ASSET_PATH }}/foo.jpg">
</div>

<div class="row">
  <div class="span12">
    {{ content }}
  </div>
</div>

modify _includes/themes/twitter/default.html to include foo.jpg

  <body>

  <img src="{{ ASSET_PATH }}/media_markHenning.jpg">
    <div class="navbar">
      <div class="navbar-inner">
        <div class="container">
          <a class="brand" href="{{ HOME_PATH }}">{{ site.title }}</a>
          <ul class="nav">

Generate a new page using rake page name="bar.html"
Start Jekyll using jekyll --server --safe
Navigate to http://localhost:4000

Expected Result
foo.jpg appears above the nav bar: screenshot
Now, navigate to http://localhost:4000

Expected Result

foo.jpg appears above the nav bar (from default.html template) as well as under the H1

Actual Result

foo.jpg appears above the nav bar (from default.html template) but shows as a broken image under the H1. screenshot. The image tag is rendered as <img src="/assets/themes//foo.jpg">, missing the theme directory.

I can reproduce this issue on includes/themes/[any theme]/page.html and includes/themes/[any theme]/post.html.

If I manually set asset_path in _config.yml, it behaves as expected.

intco commented 11 years ago

+1

leompeters commented 10 years ago

+1

Answer 1 · 2013-01-11T16:20:22.000Z

Same issue for me. Thanks for pointing out your workaround!

Answer 2 · 2013-01-11T16:30:26.000Z

Actually - here's how to do it. The default template explicitly declares the theme in the YAML front matter as:

theme :
name : design-co

Include that in your layout and you should be golden.

Answer 3 · 2013-04-07T02:03:34.000Z

I am having the same issue. I've placed a png in:

assets/themes/my-theme/images/foo.png

but {{ ASSET_PATH }} only prints out: `assets/themes//images/foo.png

I have the YAML front matter in the theme, I'm hoping to make my theme public so manually declaring the theme asset location in the _config.yml is not an option

Answer 4 · 2013-04-07T02:21:59.000Z

the issue appears to be in _includes/JB/setup

The var page.theme.name is empty, so the ASSET_PATH is not getting set with the theme name

Answer 5 · 2013-10-02T17:08:03.000Z

Still an issue... Just as @daithi-coombes described it.

Answer 6 · 2014-02-20T13:36:28.000Z

I created a patch.
https://github.com/fujii/jekyll-bootstrap/commit/16e8a9d10259e4665534825422ec05b704f7114d

Answer 7 · 2015-02-28T01:29:02.000Z

Housekeeping. I'll review the comment stream and @fujii's tweak. Will create PR after review / testing.

Answer 8 · 2015-03-01T22:33:54.000Z

OK. Discussion time. The fix from @fujii works as expected. There's one snag, though. And I don't think it's a show-stopper. Somewhat related to #227, but barely.

There's an issue with variable scope and ASSET_PATH. The fix will allow the themes to access assets using the variable, but actual posts, drafts, and pages won't have a valid ASSET_PATH. And I'm not 100% convinced that they need it.

Happy Path (for templates):

Gray Area (for posts, pages, and drafts):

If that's not an issue for you guys, I'm fine with just sticking a footnote somewhere that says that ASSET_PATH is only valid for themes. Pages, posts, and drafts are on their own.

Answer 9 · 2015-03-15T13:23:40.000Z

Tested without issue. No activity on comments. Merged.