jekyll-paginate-v2 icon indicating copy to clipboard operation
jekyll-paginate-v2 copied to clipboard

Autopages won't work with tags that include special characters e.g + or &

Open philthornley opened this issue 7 years ago • 15 comments

Hi

I spotted a quirk in the Autopages - when a tag such as 'b+w' (short for 'black and white') is used, the Autopages tag page generated omits the '+' special character and will create the directory '/tag/b-w/' instead of the expected '/tag/b+w/'. Therefore, the tag links don't correspond.

Tried with other special characters such as '&' and also with tags that contains numbers. With tags that contain numbers, an error is generated.

Do you have any suggestions on how I can get around this

Thanks

Phil

philthornley avatar Apr 02 '17 20:04 philthornley

Please could you supply the front matter for your auto-page layout file and a sample of the front-matter for one of your posts that has this tag.

sverrirs avatar Apr 02 '17 21:04 sverrirs

Sure and thanks for responding so quickly....

_layouts/autopage_tags.html

---
layout: default
---

<h1 class="center tag-listing-page__h1">{% if page.autopages %}{{page.autopages.display_name}}{% endif %}</h1>
<div class="main">
  
  <div class="gamma-container gamma-loading" id="gamma-container">

    <ul class="gamma-gallery">
      {% for post in paginator.posts %}
      <li>
        <div data-alt="View full size version of{{post.title}}" data-description="<h3>{{ post.title }}</h3><a href=&quot;{{post.url}}&quot; class=&quot;gamma-link&quot;>View full post</a>" data-max-width="{{site.xxxlarge_image_data_min_width}}" data-max-height="1350">
          <div data-src="{{site.flickr_domain_host}}{{post.flickr_image}}{{site.xxxlarge_image_flickr_key}}.jpg" data-min-width="{{site.xxxlarge_image_data_min_width}}"></div>
          <div data-src="{{site.flickr_domain_host}}{{post.flickr_image}}{{site.xxlarge_image_flickr_key}}.jpg" data-min-width="{{site.xxlarge_image_data_min_width}}"></div>
          <div data-src="{{site.flickr_domain_host}}{{post.flickr_image}}{{site.xlarge_image_flickr_key}}.jpg" data-min-width="{{site.xlarge_image_data_min_width}}"></div>
          <div data-src="{{site.flickr_domain_host}}{{post.flickr_image}}{{site.large_image_flickr_key}}.jpg" data-min-width="{{site.large_image_data_min_width}}"></div>
          <div data-src="{{site.flickr_domain_host}}{{post.flickr_image}}{{site.medium_image_flickr_key}}.jpg" data-min-width="{{site.medium_image_data_min_width}}"></div>
          <div data-src="{{site.flickr_domain_host}}{{post.flickr_image}}{{site.small_image_flickr_key}}.jpg" data-min-width="{{site.small_image_data_min_width}}"></div>
          <div data-src="{{site.flickr_domain_host}}{{post.flickr_image}}{{site.xsmall_image_flickr_key}}.jpg"></div>
          <noscript>
            <img src="{{site.flickr_domain_host}}{{post.flickr_image}}{{site.xsmall_image_flickr_key}}.jpg" alt="View full size version of{{post.title}}"/>
          </noscript>
        </div>
      </li>
      {% endfor %}
    </ul>

    <p class="page-heading">
      Page {{page.pagination_info.curr_page}} of {{page.pagination_info.total_pages}}</p>

    <div class="gamma-overlay"></div>
    {% if paginator.total_pages > 1 %}
      <ul>
        {% if paginator.previous_page %}
        <li>
          <a href="{{ paginator.previous_page_path | prepend: site.baseurl }}">Newer</a>
        </li>
        {% endif %}
        {% if paginator.next_page %}
        <li>
          <a href="{{ paginator.next_page_path | prepend: site.baseurl }}">Older</a>
        </li>
        {% endif %}
      </ul>
    {% endif %}

  </div>

</div><!--/main-->

Example post:

---
title:  "Paris hotel, Vegas"
date:   2012-09-05 19:24:04 +0100
flickr_image: 4/3890/14816543396_1c5e4ee9dd
tags: [colour, USA, Vegas, b+w]
excerpt: This is the page description
orientation: portrait
---

philthornley avatar Apr 02 '17 22:04 philthornley

Config for Pagination and Autopages in config.yml

#Pagination config
############################################################
# Site configuration for the Jekyll 3 Pagination Gem
# The values here represent the defaults if nothing is set
pagination:

  # Site-wide kill switch, disabled here it doesn't run at all 
  enabled: true

  # Set to 'true' to enable pagination debugging. This can be enabled in the site config or only for individual pagination pages
  debug: true

  # The default document collection to paginate if nothing is specified ('posts' is default)
  #collection: 'posts'

  # How many objects per paginated page, used to be `paginate` (default: 0, means all)
  per_page: 3

  # The permalink structure for the paginated pages (this can be any level deep)
  permalink: '/:num/' # Pages are index.html inside this folder (default)
  #permalink: '/page/:num.html' # Pages are simple html files 
  #permalink: '/page/:num' # Pages are html files, linked jekyll extensionless permalink style.

  # Optional the title format for the paginated pages (supports :title for original page title, :num for pagination page number, :max for total number of pages)
  title: ':title - page :num'

  # Limit how many pagenated pages to create (default: 0, means all)
  limit: 0

  # Optional, defines the field that the posts should be sorted on (omit to default to 'date')
  sort_field: 'date'

  # Optional, sorts the posts in reverse order (omit to default decending or sort_reverse: true)
  sort_reverse: true

  # Optional, the default category to use, omit or just leave this as 'posts' to get a backwards-compatible behavior (all posts)
  #category: 'posts'

  # Optional, the default tag to use, omit to disable
  #tag: ''

  # Optional, the default locale to use, omit to disable (depends on a field 'locale' to be specified in the posts, 
  # in reality this can be any value, suggested are the Microsoft locale-codes (e.g. en_US, en_GB) or simply the ISO-639 language code )
  #locale: '' 

 # Optional,omit or set both before and after to zero to disable. 
 # Controls how the pagination trail for the paginated pages look like. 
 # trail: 
 #   before: 2
 #   after: 2

############################################################

############################################################
# Site configuration for the Auto-Pages feature
# The values here represent the defaults if nothing is set
autopages:

  # Site-wide kill switch, disable here and it doesn't run at all 
  enabled: true

  # Category pages, omit entire config element to disable
  categories: 
    # Optional, the list of layouts that should be processed for every category found in the site
    layouts: 
      - 'autopage_category.html'
    # Optional, the title that each category paginate page should get (:cat is replaced by the Category name)
    title: 'Posts in category :cat'
    # Optional, the permalink for the  pagination page (:cat is replaced), 
    # the pagination permalink path is then appended to this permalink structure
    permalink: '/category/:cat'

  # Collection pages, omit to disable
  collections:
    layouts: 
      - 'autopage_collection.html'
    title: 'Posts in collection :coll' # :coll is replaced by the collection name
    permalink: '/collection/:coll'
  
  # Tag pages, omit to disable
  tags:
    layouts: 
      - 'autopage_tags.html'
    title: 'Posts tagged with :tag' # :tag is replaced by the tag name
    permalink: '/tag/:tag'

philthornley avatar Apr 02 '17 22:04 philthornley

Just tried out this feature. Having an issue with spaces

Using the example https://github.com/sverrirs/jekyll-paginate-v2/blob/master/examples/03-tags/_layouts/autopage_tags.html

simple setting of

autopages:
  enabled: true

[2017-10-30 23:38:18] ERROR `/tag/suicide prevention/' not found.

---
layout: post
title: Veterans Crisis Line
href: https://www.veteranscrisisline.net/GetHelp/ResourceLocator.aspx
date: 2017-10-30 03:00:00 -0500
tags:
- veterans
- USA
- crisis
- emergency
- suicide prevention
categories:
- EN
---

andy5995 avatar Oct 31 '17 04:10 andy5995

Gem https://rubygems.org/gems/jekyll-paginate-v2/versions/1.9.4 includes a preliminary solution from me and @ibrado to this issue. If you guys have time to test it out and give us feedback we would greatly appreciate it.

sverrirs avatar Jan 24 '18 16:01 sverrirs

I just updated. Thank you.

If memory serves, the problem was fixed after we stopped trying to publish using GitHub pages. I had read that some plug-ins don't work when trying to auto-publish using GH pages.

So shortly after we set up our site, we decided to generate the static pages with jekyll's build option, and then push the new pages.

But we do still use the paginate-v2 plugin. Haven't hadn't any issue with spaces.. in fact, I wonder if I left my comment on the wrong repo. We were also having problems with the jekyll-tagging plugin, iirc, for the reason I mentioned above.

Anyway, sorry if I left a false bug report. Good luck with the project, and thanks again.

andy5995 avatar Jan 25 '18 02:01 andy5995

That's ok, @andy5995. We did find/solve a definite issue with spaces in categories (at least) while checking this out, so it's all good. :-)

ibrado avatar Jan 25 '18 06:01 ibrado

Hi, I'm having the same issue with categories. I'm on 1.9.4 and have autopages for categories enabled, but when I link to a category name with a space in it, it says page not found.

Here is my _config.yml:

# Pagination Settings
pagination:
  enabled: true
  per_page: 10
  permalink: '/page/:num/'
  title: ':title - page :num of :max'
  limit: 0
  sort_field: 'date'
  sort_reverse: true

############################################################
# Site configuration for the Auto-Pages feature
# The values here represent the defaults if nothing is set
autopages:

  # Site-wide kill switch, disable here and it doesn't run at all 
  enabled: true

  # Category pages, omit entire config element to disable
  categories: 
    # Optional, the title that each category paginate page should get (:cat is replaced by the Category name)
    title: 'Posts in category :cat'
    # Optional, the permalink for the  pagination page (:cat is replaced), 
    # the pagination permalink path is then appended to this permalink structure
    permalink: '/category/:cat'
    special_characters: true
  collections:
    enabled: false
  tags:
    enabled: false

This is where I'm linking to the categories:

<div class="col-lg-3 col-md-3 sidebar mobile-hidden">
  <div class="container menu">
    <!-- List categories -->
    <h4 class="tag cat-title">Categories</h4>
      <ul class="post-list list-group list-group-flush">
        {% for category in site.categories %}
        <li class="list-group-item"><a href="{{ site.url }}/blog/category/{{ category | first | url_encode | downcase }}">{{ category | first }}</a></li>
        {% endfor %}
      </ul>
  </div>
</div>

The categories that are only one word work great and go to the right page (i.e. http://localhost:4000/blog/category/engineering/). The ones with more than one word go to non-existent pages (i.e. http://localhost:4000/blog/category/cloud+infrastructure). Any help on this would be greatly appreciated!

bildungsroman avatar Jun 28 '18 20:06 bildungsroman

@bildungsroman Hi! Did you use

category: cloud infrastructure

(i.e. singular) or

categories:
 - cloud infrastructure

?

You might be seeing the problem if you used categories: cloud infrastructure

ibrado avatar Jun 30 '18 14:06 ibrado

@ibrado The posts themselves have category: ['Cloud Infrastructure', 'DevOps'] etc.

I did manage to somewhat 'fix' the problem. I changed

        {% for category in site.categories %}
        <li class="list-group-item"><a href="{{ site.url }}/blog/category/{{ category | first | url_encode | downcase }}">{{ category | first }}</a></li>
        {% endfor %}

To

        {% for category in site.categories %}
        <li class="list-group-item"><a href="{{ site.url }}/blog/category/{{ category | first | downcase }}">{{ category | first }}</a></li>
        {% endfor %}

(without url_encode). What this does, however, is give me a link that looks like this: http://localhost:4000/blog/category/cloud infrastructure/ It's working in localhost, but seems problematic for production.

bildungsroman avatar Jul 02 '18 16:07 bildungsroman

@bildungsroman I don't remember testing that syntax (category: [array]). Just to be thorough, could you give the following a try?

categories:
  - Cloud Infrastructure
  - DevOps

Also, there's a slugify option (no longer special_characters , see #70 as updated by @sverrirs) like so:

   slugify:
      mode: 'ascii' # raw, default, pretty, ascii, latin 
      cased: true  # Causes tag to show up as it is written and not lowercase
Value Description
none No conversion (default)
raw Replace sequences of spaces with a hyphen
nil Replace non-alphabetic characters with a hyphen
pretty Keep some non-alphabetic characters (._~!$&'()+,;=@)

If you're interested, the regex describing the characters replaced with hyphens for the various modes are defined here.

ibrado avatar Jul 02 '18 17:07 ibrado

Also, are you guys trying PR #79 ?

e.g. temporarily set Gemfile entry as follows:

group :jekyll_plugins do
  # etc
  gem 'jekyll-paginate-v2', :git => "https://github.com/ibrado/jekyll-paginate-v2.git", :branch => "permalink-defaults"
  # etc
end

then bundle. The branch is a bit behind master, but except for #73 it's all docs (mostly #72), so it should still be good for testing this.

ibrado avatar Jul 02 '18 18:07 ibrado

Thank you for your help, @ibrado.

Where exactly should I change to

categories:
  - Cloud Infrastructure
  - DevOps

? I only have the category names listed in the meta of each blog post .md, where they are listed as the array I referenced earlier.

When using slugify, the URL comes out right, but the page is not found, i.e. I get Error: /blog/category/cloud-infrastructure' not found. The error came up when using :branch => "permalink-defaults" as well, so that didn't seem to change anything.

bildungsroman avatar Jul 02 '18 18:07 bildungsroman

Yes, try that instead of the current category: ['Cloud Infrastructure', 'DevOps'] in each blog post. v1.9.4 has some issues with singular/plural arrays/strings. Alternatively, try the current master. It has #73 which has my fixes for those issues.

group :jekyll_plugins do
  # etc
  gem 'jekyll-paginate-v2', :git => "https://github.com/sverrirs/jekyll-paginate-v2.git", :branch => "master"
  # etc
end

I'll try to find some time to really dig into this, soon...

ibrado avatar Jul 02 '18 18:07 ibrado

I have hundreds of posts already, so changing the category structure is not really feasible :/ I did change it on a couple posts to test but the same error shows up.

I could not install the :branch => "master" gem for some reason - got this:

Retrying fetcher due to error (4/4): Bundler::HTTPError Could not fetch specs from https://rubygems.org/
Could not fetch specs from https://rubygems.org/

For now I'll stick with not using slugify and hope it still works in production as it is in localhost, but a fix down the line would be nice!

bildungsroman avatar Jul 02 '18 19:07 bildungsroman