アポストロフィーCMSのカスタムイメージギャラリー

Question

イメージに可能なすべてのサイズは？

基本的に、ページに「添付」されている画像のリストを取得するにはどうすればよいですか？既定のギャラリーが限られているので、自分のイメージギャラリーを作成しようとしています。それは、「アポストロフィ画像 - ウィジェット」を拡張する自分のウィジェットを作成する必要があるのでしょうか？

一度私はそれを行い、ページにウィジェットを追加して画像を追加すると、どのように画像のリストを取得できますか？私はサムネイルサイズを取得したい、画像のより大きなサイズをモーダルに配置したいですか？可能なサイズはどれくらいありますか？ {％ - 設定された画像= entry.itemまたはエントリ - ％ '{ - - data.widget._pieces内のエントリの％％}：ここ

はアポストロフィに付属のデフォルトの画像ギャラリーを表示するためのコードであります} { ％ - 関係= entry.relationship設定 - ％} {％ - ブロックタイトル - ％} {{image.title}} {％ - エンドブロック - ここ％}

 {%- endfor -%} 

`ですアポストロフィアセットのドキュメント：http://apostrophecms.org/docs/modules/apostrophe-assets/index.html

ドキュメントにはいくつかのサイズが考えられますが、不完全な感じがします。私は単一の資産の複数のサイズに対して複数のURLを要求する方法に従っていません。

Answer 1

私はP'unk AvenueのApostropheの主任開発者です。

あなたの目標は、どのようにapostrophe-images-widgetsがレンダリングされるかを変更することだと思います。

lib/modules/apostrophe-images-widgets/views/widget.htmlを自分のプロジェクトに作成することで可能です（node_modules内で変更しないで、プロジェクト内にパラレルフォルダを作成してください）。

アポストロフィの対応するフォルダからwidget.htmlファイルをコピーします。

次に、適切と思われるように修正することができます。

使用可能なサイズは、ここに記載されています：

http://apostrophecms.org/docs/tutorials/getting-started/adding-editable-content-to-pages.html#code-size-code

確かに正しく、彼らに株式widget.htmlと同じ方法をURLを構築するために提供するユーティリティを利用します。

もちろん、プレイヤーのJavaScriptを変更したいと思います。それを行うには、作成します：あなたのプロジェクトで

lib/modules/apostrophe-images-widgets/public/js/always.js

を。元の場所をコピーして貼り付けます。 （ところで、あなたは、スタックオーバーフロー上のコードを引用する4つのスペースをインデントする必要があり、私はテキストエディタでそうしてからコピーして貼り付けをお勧めするために確実に動作

// example of a widget manager with a play method. 
// You don't need this file at all if you 
// don't need a player. 

apos.define('apostrophe-images-widgets', { 
    extend: 'apostrophe-pieces-widgets', 
    construct: function(self, options) { 
    self.play = function($widget, data, options) { 
     $widget.projector(options); 
    }; 
    } 
}); 

を：。。それは非常に短いですので、私はそれをここに引用します私）

このデフォルトバージョンでは、スライドショーをアニメーション化するために、「jquery projector」プラグインが呼び出されます。あなたはあなたのコピーのその行を削除することができます（ただし、少なくとも空のself.playメソッドを保持して、デフォルト実装をオーバーライドすることができます）。そうすれば、アニメーションはまったくありません。または、独自のロジックを記述することもできます。

playの引数は、関連するウィジェットを参照するjQueryオブジェクトです。 find()で範囲を決めるには常にそれを使用し、ページレベルで$(...)ですべてをやるように誘惑に抵抗してください。

ます実際に私たちのウィジェットのような場合は、いくつかのケースで異なる振る舞いをしたい、あなたは（app.jsに）新しい名前でそれを拡張することができます

modules: { 
    'my-slideshow-widgets': { 
    extend: 'apostrophe-images-widgets' 
    } 
} 

次にあなたがlib/modules/my-slideshow-widgetsを作成し、中my-slideshowが含まれるであろういくつかの領域で許可されているウィジェット、サイトの周りのシングルトンなどがありますが、そうでなければ上記と同じパターンに従います。

も参照してください：完全カスタムのウィジェットを作成するための本当に良い概要について

http://apostrophecms.org/docs/tutorials/getting-started/custom-widgets.html

。