1736702256
2025-01-09 00:00:00
エディター向けに優れた改善アドオンを作成しました。インストールは非常に簡単で、パブリック API のみを使用し、構成は必要ありません。から無料で入手できます https://nuget.optimizely.com/package/?id=SideBySideEditing Optimizely CMS12+ にインストール可能
導入
このパッケージは、右側にプレビューを追加で表示する代替編集ビューです。プレビューは保存するたびに自動的に更新されます。
Optimizely CMS に組み込まれているページ編集ビューは非常に強力です。ただし、正しく設定するのは非常に困難でもあり、多くの人が単にそれを無効にして、すべてのプロパティ モードに切り替えていることがよくありました。
また、定義上、編集できるのは視覚的なプロパティのみですが、非視覚的なプロパティを変更する必要がある場合は、すべてのプロパティ モードに切り替える必要があるため、面倒でもあります。
このアドオンは、両方の長所を提供しようとします。編集には引き続きすべてのプロパティ モードを使用しますが、リアルタイム レンダリングを確認することはできます。
詳細
このアドオンの最も強力な機能はそのシンプルさです。 nuget をインストールし、モジュールをオンにするだけで完了です。配信のレンダリング方法に制限はありません (特定のデータエピ属性を必要とする組み込みのページ上編集とは対照的です)。 Html/タグ ヘルパーを使用したり、データエピを手動でレンダリングしたりする必要はありません。もちろん、data-epi 属性は正しく使用されれば機能し、ページの一部だけを更新することが可能になります。ただし、一部のプロパティは視覚的にレンダリングされない可能性があるため、別の方法を考える必要がありました。たとえば、次のようなブール型プロパティがある場合です。
ShowHeaderおそらく条件としてのみ使用されますが、その値は次のようにレンダリングされません。 真実 または 間違い どこでも。
そのため、保存操作が成功するたびにバックグラウンドで自動的に更新されるようにプレビュー iframe を変更しました。
SideBySideEditing の使用を開始するには、SideBySideEditing をサイトに明示的に追加する必要があります。
Install-Package SideBySideEditing
公式 Optimizely nuget フィードから入手できます – https://nuget.optimizely.com/package/?id=SideBySideEditing
インストールしたら、次のステートメントを Startup.cs に追加してください。
public class Startup
{
...
public void ConfigureServices(IServiceCollection services)
{
...
services.AddSideBySideEditing();
...
}
...
}
AddSideBySide編集 拡張メソッドはオプションのパラメータも受け入れます アクション
利用可能なオプションのリスト:
- RegisterIframeAutoRefresher – (デフォルト: true) – 並列ビューでプレビュー iframe を自動更新します。ビューがタグ/HTML ヘルパーを使用し、すべてをレンダリングする場合 データエピ 属性を正しく設定すると、これをオフにすることができます。
インストール後、ビュー スイッチャーに新しいビューが表示されます。
プレビューの自動更新
デフォルトでは、保存操作が成功するたびにプレビューがバックグラウンドで自動的に更新されます。配信サイトに制限がないことにご注意ください。レンダリングする HtmlHelpers や TagHelpers を使用する必要はありません。 データエピ* 属性を使用するか、それらを手動でレンダリングします。
配信が正しくレンダリングされた場合 データエピ 属性を使用すると、すべてのプロパティが視覚的にレンダリングされます。つまり、data-epi-edit=”your_property_name” または data-epi-property-name=”your_property_name” を持つ DOM 要素であり、プレビューを自動的に再ロードしたくない場合は、次のようにすることができます。
public class Startup
{
...
public void ConfigureServices(IServiceCollection services)
{
...
services.AddSideBySideEditing(options =>
{
options.RegisterIframeAutoRefresher = false;
});
...
}
...
}
この方法では、ページのごく一部だけがバックグラウンドで更新されるため、プレビューはよりシームレスかつ高速に動作します。
これは最初のバージョンであるため、あちこちに問題がある可能性があることに注意してください。肯定的でも否定的でも、フィードバックをいただければ幸いです。また、あらゆる種類のバグレポート、貢献、定期的なコメントもお待ちしております。それが私の時間を投資する価値のあるアイデアかどうか知りたいです。
コードは私のgithubで入手できます https://github.com/barteksekula/side-by-side-editing
そこで報告して貢献するか、このブログ投稿にコメントしてください。
編集を楽しんでください! 🙂
#並べて編集 #Optimizely #OnPage #Edit #の代替 #バルトシュセクワ