Trabajando con correos electrónicos AMP HTML
Acerca de AMP
AMP (Páginas Móviles Aceleradas) es un marco de fuente abierta creado por Google a partir de HTML, CSS y JavaScript. Permite construir correos electrónicos ligeros con tiempos de carga más rápidos. AMP proporciona muchos componentes como carruseles, formularios, imágenes, etc. Además de ser rápido, los correos electrónicos AMP se renderizan como correos completamente interactivos dentro del cliente de correo, y los clientes pueden interactuar con los correos directamente, como rellenar un formulario o responder a una encuesta sin salir del cliente de correo.
Trabajando con correos electrónicos AMP HTML
Aspose.Email proporciona el AmpMessage que representa un correo electrónico AMP. Aspose.Email proporciona muchas clases para agregar componentes a correos electrónicos AMP como AmpImage, AmpCarousel, AmpAccordion, AmpForm, etc. La lista completa de clases se puede encontrar en la página Aspose.Email.Amp. El siguiente fragmento de código demuestra cómo crear, guardar y actualizar correos electrónicos AMP utilizando la API de Aspose.Email.
// For complete examples and data files, please go to https://github.com/aspose-email/Aspose.Email-for-.NET | |
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"); | |
} |