Praca z e‑mailami w formacie AMP HTML

O AMP

AMP (Accelerated Mobile Pages) to otwartoźródłowy framework od Google oparty na HTML, CSS i JavaScript. Umożliwia tworzenie lekkich e‑maili o szybszym czasie ładowania. AMP udostępnia wiele komponentów, takich jak karuzele, formularze, obrazy itp. Oprócz szybkości, wiadomości AMP renderują w pełni interaktywne e‑maile w kliencie pocztowym, a odbiorcy mogą wchodzić w interakcję bez wychodzenia z klienta, np. wypełniając formularz lub odpowiadając na ankietę.

Praca z e‑mailami AMP HTML

Aspose.Email udostępnia AmpMessage który reprezentuje wiadomość AMP. Aspose.Email udostępnia wiele klas do dodawania komponentów do wiadomości AMP, takich jak AmpImage, AmpCarousel, AmpAccordion, AmpForm itp. Pełną listę klas można znaleźć na Aspose.Email.Amp strona. Poniższy fragment kodu demonstruje tworzenie, zapisywanie i aktualizację wiadomości AMP przy użyciu 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");
}
Drukowanie wiadomości e‑mail Artykuły techniczne