کار با ایمیل‌های AMP HTML

درباره AMP

AMP (Accelerated Mobile Pages) یک چارچوب منبع‌باز توسط Google است که از HTML، CSS و JavaScript ساخته شده. این چارچوب امکان ساخت ایمیل‌های سبک با زمان بارگذاری سریع‌تر را فراهم می‌کند. AMP مؤلفه‌های متعددی مانند کاروسل‌ها، فرم‌ها، تصاویر و غیره ارائه می‌دهد. علاوه بر سرعت، ایمیل‌های AMP به‌صورت کاملاً تعاملی داخل کلاینت ایمیل رندر می‌شوند و کاربران می‌توانند مستقیماً مانند پر کردن فرم یا پاسخ به نظرسنجی بدون خروج از کلاینت ایمیل با ایمیل‌ها تعامل داشته باشند.

کار با ایمیل‌های AMP HTML

Aspose.Email ارائه می‌دهد AmpMessage که نمایانگر یک ایمیل AMP است. Aspose.Email کلاس‌های متعددی برای افزودن مؤلفه‌ها به ایمیل‌های AMP مانند AmpImage، AmpCarousel، AmpAccordion، AmpForm و غیره ارائه می‌دهد. فهرست کامل کلاس‌ها را می‌توانید در Aspose.Email.Amp صفحه. قطعه کد زیر ایجاد، ذخیره و به‌روزرسانی ایمیل‌های AMP با استفاده از API Aspose.Email را نشان می‌دهد.

string dataDir = RunExamples.GetDataDir_Output();

AmpMessage msg = new AmpMessage();
msg.HtmlBody = "<html><body> Hello AMP </body></html>";

//add AmpAnim component
AmpAnim anim = new AmpAnim(800, 400);
anim.Src = "https://placekitten.com/800/400";
anim.Alt = "Test alt";
anim.Attribution = "The Go gopher was designed by Reneee French";
anim.Attributes.Layout = LayoutType.Responsive;
anim.Fallback = "offline";
msg.AddAmpComponent(anim);

//add AmpImage component
AmpImage img = new AmpImage(800, 400);
img.Src = "https://placekitten.com/800/400";
img.Alt = "Test alt";
img.Attributes.Layout = LayoutType.Responsive;
msg.AddAmpComponent(img);

//add AmpCarousel component
AmpCarousel car = new AmpCarousel(800, 400);
img = new AmpImage(800, 400);
img.Src = "https://amp.dev/static/img/docs/tutorials/firstemail/photo_by_caleb_woods.jpg";
img.Alt = "Test 2 alt";
img.Attributes.Layout = LayoutType.Fixed;
car.Images.Add(img);
img = new AmpImage(800, 400);
img.Src = "https://placekitten.com/800/400";
img.Alt = "Test alt";
img.Attributes.Layout = LayoutType.Responsive;
car.Images.Add(img);
img = new AmpImage(800, 400);
img.Src = "https://amp.dev/static/img/docs/tutorials/firstemail/photo_by_craig_mclaclan.jpg";
img.Alt = "Test 3 alt";
img.Attributes.Layout = LayoutType.Fill;
car.Images.Add(img);
msg.AddAmpComponent(car);

//add AmpFitText component
AmpFitText txt = new AmpFitText("Lorem ipsum dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt.");
txt.Attributes.Width = 600;
txt.Attributes.Height = 300;
txt.Attributes.Layout = LayoutType.Responsive;
txt.MinFontSize = 8;
txt.MaxFontSize = 16;
txt.Value = "Lorem ipsum dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt.";
msg.AddAmpComponent(txt);

//add AmpAccordion component
AmpAccordion acc = new AmpAccordion();
acc.ExpandSingleSection = true;

Section sec = new Section();
sec.Header = new SectionHeader(SectionHeaderType.h2, "Section 1");
sec.Value = new SectionValue("Content in section 1.");
acc.Sections.Add(sec);

sec = new Section();
sec.Header = new SectionHeader(SectionHeaderType.h2, "Section 2");
sec.Value = new SectionValue("Content in section 2.");
acc.Sections.Add(sec);

img = new AmpImage(800, 400);
img.Src = "https://placekitten.com/800/400";
img.Alt = "Test alt";
img.Attributes.Layout = LayoutType.Responsive;

sec = new Section();
sec.Header = new SectionHeader(SectionHeaderType.h2, "Section 3");
sec.Value = new SectionValue(img);
acc.Sections.Add(sec);
msg.AddAmpComponent(acc);

//add AmpForm component
AmpForm form = new AmpForm();

form.Method = FormMethod.Post;
form.ActionXhr = "https://example.com/subscribe";
form.Target = FormTarget.Top;

FormField field = new FormField("Name:", "text");
field.Name = "name";
field.IsRequired = true;
form.Fieldset.Add(field);

field = new FormField("Email:", "email");
field.Name = "email";
field.IsRequired = true;
form.Fieldset.Add(field);

field = new FormField();
field.InputType = "submit";
field.Value = "Subscribe";
form.Fieldset.Add(field);
msg.AddAmpComponent(form);

msg.Save(dataDir + "AmpTest_1.eml");
MailMessage savedmsg = MailMessage.Load(dataDir + "AmpTest_1.eml");
AmpMessage ampMsg = savedmsg as AmpMessage;
if (ampMsg != null)
{
    DateTime dt = new DateTime(2019, 9, 27, 1, 1, 1, DateTimeKind.Utc);
    AmpTimeago time = new AmpTimeago(dt);
    time.Attributes.Width = 600;
    time.Attributes.Height = 300;
    time.Attributes.Layout = LayoutType.Fixed;
    time.Locale = "en";
    time.Cutoff = 600;
    ampMsg.AddAmpComponent(time);

    ampMsg.Save(dataDir + "AmpTest_2.eml");
}