問題タブ [richtextblock]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
wagtail - RichText プレビューまたは要約されたコンテンツ
それぞれがコンテンツのかなり標準的なストリームフィールドを含む多数の「記事」タイプのページを含む、かなり単純なニュースフィード機能を備えた CMS をセットアップしています。
私が探しているのは、記事の意味のあるストリームフィールド コンテンツの切り捨てられたプレビューとして、記事のクエリセットを要約できるインデックスまたは検索ページを用意することです。最初の 150 語が省略されたようなもので、すぐに使用できる、またはサードパーティのライブラリを介してこの必要性をサポートするものは何も見つかりません。
問題の最初の部分は、streamfield の意味のある部分を識別することです。最も簡単なのは、RichTextBlock などの特定のタイプの最初の StreamBlock を識別するか、RichTextField にないものはすべて含まれていると仮定して、RichTextBlock を含む他の特定の StructBlock タイプを識別することです。実際のコンテンツの補足 (ヘッダー、画像、派手な仕掛け)
では、 RichText コンテンツを要約するにはどうすればよいでしょうか。
RichTextField には .get_searchable_content() 関数があり、すべての HTML タグを取り除き、短縮できる Elasticsearch インデックスに挿入しますが、一部の HTML タグは、リンク、ブレーク、またはその他の単純なスタイル設定要素など、プレビュー用に保持すると有益な場合があります。
RichText コンテンツの完全な HTML レンダリングを CSS を使用して div に挿入し、オーバーフローを非表示にして高さを制限します。複雑なリッチ テキスト スタイルとレイアウトをサポートするという利点がありますが、無関係なマークアップがユーザーに表示されない (場合によっては記事全体) という欠点と、適切にレンダリングされないテキスト以外の要素を選択的に削除または表示する必要があるという欠点があります。指定された高さの範囲内。
私がこれをやりたいと思った最初の人だとは想像しがたいので、上記のアプローチのいずれかに取り組む前に、誰かがこれを既に行っているライブラリまたはスニペットを教えてくれることを願っています。どんな洞察も大歓迎です！