1

HTML メールの作成プロセスを簡素化し、さまざまな要素をドラッグ アンド ドロップして最終製品をコンパイルするのを簡単にしたいと考えています。

一連の html コンテンツ ブロック (1 列のストーリー、2 列のストーリー、広告ブロックなど) を作成しましたが、ユーザーが次のことができるようにしたいと考えています。

  1. 必要に応じて HTML コンテンツ ブロック要素をステージにドラッグし、いつでも並べ替えることができます
  2. 各コンテンツ ブロックのテキストおよび画像領域を編集する
  3. 最終的にコンパイルされた html をエクスポートできるようにします - サードパーティのメール管理アプリの準備ができました

私はjQueryのソート可能およびドラッグ可能を見てきましたが、これらは全体像のほんの一部であることを知っています. 誰かが似たようなものを作成したか、これを達成するために正しい方向に向けることができるかどうか疑問に思っていましたか?

4

3 に答える 3

0

はい、可能です。私はまさにこのツールを以前に構築しました。

いくつかの落とし穴:

  • エンド ユーザーが使用しているブラウザによってコードがわずかに変わるため、サーバー側のコードも少し必要になります。後処理を使用して、不要な/有害なコードをクリーンアップしました。
  • WYSIWYG エディターは避けてください。ユーザーが望んでいたスタイルを維持しようとしながら、ジャンクを削除するのに多くの時間を費やすことになるからです。代わりに、contenteditable属性と、太字、斜体など、提供したいものすべてに独自のシンプルなスタイル設定オプションを使用してください。
  • Web ブラウザー (CSS3 を使用) で実行でき、電子メールでは実行できないすべてのことに注意してください。最初に電子メール クライアントでテンプレートのレンダリング テストを行い、次にそれらをモジュールに変換します。
于 2012-05-23T22:02:12.100 に答える
0 
/* Render the template with the movies data and insert
   the rendered HTML under the "movieList" element */

$( "#movieTemplate" ).tmpl( movies ).appendTo( "#movieList" );
于 2012-06-04T13:12:30.247 に答える
0

Jquery テンプレートを試してみてください。柔軟性が向上します。Jquery テンプレート

Jquery の例から。

<script id="movieTemplate" type="text/x-jquery-tmpl">  //this is template 
    <li><b>${Name}</b> (${ReleaseYear})</li>
</script>

<ul id="movieList"></ul>

<script>
var movies = [  // data for the template 
    { Name: "The Red Violin", ReleaseYear: "1998" },
    { Name: "Eyes Wide Shut", ReleaseYear: "1999" },
    { Name: "The Inheritance", ReleaseYear: "1976" }
];

/* Render the template with the movies data and insert
   the rendered HTML under the "movieList" element */

$( "#movieTemplate" ).tmpl( movies )  
    .appendTo( "#movieList" );
</script>

さらに機能が必要な場合は、HandleBar.JS HandleBar JSを試すことができます。

  1. 基本的な HandleBarjs 式
于 2012-04-20T06:45:07.323 に答える