web-dev-qa-db-ja.com

各単語の最初の文字を流動的な構文で大文字にしますか？

Liquid構文を使用してLocomotiveCMSインストールでSEOを設定しようとしています。 {{page.title}}を使用してページタイトルが動的にプルされるようにコーディングし、各単語の最初の文字を大文字にするように強制しようとしています。

私はこれを試しました：

<title>
      {{ page.title | camelcase }} | {{ site.name }}
</title>

ここの液体構文ドキュメントに基づく： http://docs.shopify.com/themes/liquid-basics/output#camelize

しかし、それは機能していません。 capitalizeの使用は機能しますが、最初の単語の最初の文字のみを大文字にします。

ありがとう！

htmlliquid
19
APAD1

この動作を取得するには、プラグインを使用することをお勧めします

_plugins/_capitalize_all.rb：

require 'liquid'
require 'uri'

# Capitalize all words of the input
module CapitalizeAll
  def capitalize_all(words)
    return words.split(' ').map(&:capitalize).join(' ')
  end
end

Liquid::Template.register_filter(CapitalizeAll)

使用法：

{{ "mein text" | capitalize_all }}
22
AsTeR

Liquid構文のみを使用してこれを実現する方法があります。プラグインは必要ありません。

単語の文字列を配列に分割し、forループを大文字のフィルターと組み合わせて使用​​して、各単語の最初の文字を大文字にします。これをキャプチャステートメント内に適切にカプセル化すると、すべてのWordの最初の文字が大文字になります。

{% assign words = "Hi, how are you today?" | split: ' ' %}

{% capture titlecase %}{% for Word in words %}{{ Word | capitalize }} {% endfor %}{% endcapture %}

{{ titlecase }}

出力：

こんにちは、今日はお元気ですか？

これらすべてが1行にあり、キャプチャステートメント全体で空白が1つだけ出現することに注意してください。

22
taky2

これをCSSで設定するのはどうですか？

title {
    text-transform:capitalize;
}

編集：テキスト変換についてタイプミスをしましたが、修正されました。

10
Ty Kayn

あなたが投稿したリンクに関して、キャメルケースは次のように機能します。

{{ 'coming-soon' | camelcase }}

単語が「-」で区切られた文字列を受け取り、キャメルケースで囲みます。質問は1つだけです。「page.title」はどうですか？その単語は「-」で区切られていますか？または、「これは私のページのタイトルです」のようなテキストがありますか？その場合は、「this-is-the-title-of-my-page」に置き換える必要があります。

お役に立てれば。

2
taxicala

この一連のフィルターは私のために働いています。ただし、タイトルに5つの連続したダッシュまたはダッシュがあり、次の文字を大文字にしたくない場合は、問題が発生します。

{% assign headerTitle = page.title | split: " " | join: "-----" | camelcase | split: "-----" | join: " " %}
1
David Fisco

回答ありがとうございます。これを投稿した直後に、実際に回避策を見つけました。 page.titleを呼び出す代わりに、page.seo_titleをプルしています。これは、LocomotiveCMSバックエンドから正しい大文字で手動で入力できます。

0
APAD1

これは私にとってはうまくいきます：{{page.title |大文字にする}}

文の最初の単語のみを大文字にします。

私の最初の本能は、これがすべての単語を大文字にするだろうということでしたが、そうではありません。

ソース： https://docs.shopify.com/themes/liquid-documentation/filters/string-filters#capitalize

0
eonist