Announcement

Collapse
No announcement yet.

Order emails on mobiles

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Order emails on mobiles

    I have noticed the order emails V18 generates in html look great on a desktop but pretty awful in mobile view, anyone else?

    Thanks Ed

    Click image for larger version

Name:	Screenshot_20240929_112515_Chrome.jpg
Views:	106
Size:	275.6 KB
ID:	557576
    https://www.harrisontelescopes.co.uk/

    Ed Harrison - Menmuir Scotland

    #2
    Yep. that's pretty much what mine look like too.

    I have wondered about going back to plain text emails. The HTML ones immediately come across as automated and lack any kind of personal touch. I know Amazon, etc. use the HTML look but I think I'd prefer my ones to engage on a more personal level.

    Mike


    -----------------------------------------

    First Tackle - Fly Fishing and Game Angling

    -----------------------------------------

    Comment


      #3
      Thanks Mike, yes I was thinking the same but it's a backwards step.
      https://www.harrisontelescopes.co.uk/

      Ed Harrison - Menmuir Scotland

      Comment


        #4
        I removed the table that contains all the side links from the 'Email Outer Layout', so this:

        Code:
        <!DOCTYPE HTML>
        <html>
        <head>
        </head>
        <body style="font-family: ; font-size: <actinic:variable name="StandardFontSize" />">
        <table width="100%" cellpadding="10" cellspacing="0" style="border: 1px solid <actinic:variable name="Palette1" />">
        <tr>
        <td colspan="2" style="border-bottom: 5px double #aaaaaa; ; background: <actinic:variable name="PaletteBG" />; color: <actinic:variable name="Palette1" />
        <actinic:block if="%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Academic%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Edge%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Academic%20Stylesheet%202013%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Edge%20Stylesheet%202013%22" >
        ; background: <actinic:variable name="Palette1" />; color: <actinic:variable name="PaletteBG" />
        </actinic:block>
        <actinic:block if="%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Angles%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Art%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Clinical%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Elegance%20Stylesheet%22" >
        ; background: <actinic:variable name="Palette2" />; color: <actinic:variable name="PaletteBG" />
        </actinic:block>
        ">
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="5">
        <a href="<actinic:variable name="WebSiteURL" />">
        <img
        src="<actinic:variable name="CatalogURL" /><actinic:variable name="CompanyLogoFileName" />"
        border="0"
        align="middle"
        hspace="10" /></a>
        <b><actinic:variable encoding="html" name="CompanyName" /></b></font>
        </td>
        </tr>
        <tr>
        <td valign="top" width="150" style="line-height: 35px; background: <actinic:variable name="Palette1" />; color: <actinic:variable name="PaletteBG" />">
        <table cellpadding="10" cellspacing="0" >
        <tr>
        <td>
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="2">
        <a style="color: <actinic:variable name="PaletteBG" />; text-decoration: none" href="<actinic:variable name="CatalogHomeURL" />">Shop Online</a><br>
        </font>
        </td>
        </tr>
        <tr>
        <td style="border-top: 1px dotted #aaaaaa">
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="2">
        <a style="color: <actinic:variable name="PaletteBG" />; text-decoration: none" href="mailto:<actinic:variable name="Email" />"><actinic:variable encoding="html" name="SendMailText" /></a><br>
        </font>
        </td>
        </tr>
        <tr>
        <td style="border-top: 1px dotted #aaaaaa">
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="2">
        <a style="color: <actinic:variable name="PaletteBG" />; text-decoration: none" href="<actinic:variable name="CatalogURL" />info.html"><actinic:block if="%3cactinic%3avariable%20name%3d%22InformationType%22%20%2f%3e%20%21%3d%20%270%27" ><actinic:variable encoding="html" name="InfoText" /></actinic:block></a><br>
        </font>
        </td>
        </tr>
        </table>
        </td>
        <td style="background: <actinic:variable name="Palette1" />">
        <table cellspacing="20" style="padding: 20px; clear: left; overflow: hidden; background: <actinic:variable name="PaletteBG" />; color: <actinic:variable name="TextColor" />; border: 2px dotted <actinic:variable name="Palette2" />">
        <tr>
        <td style="min-width: 100px; clear: none; float: left">
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="2">
        <actinic:variable name="INNERLAYOUT" />
        </font>
        </td>
        </tr>
        <tr>
        <td style="line-height: 18px; padding: 10px; border: 5px double #aaaaaa; text-align: center; background: <actinic:variable name="Palette3" />">
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="1">
        <actinic:variable encoding="html" name="CompanyName" /><actinic:block if="%3cactinic%3avariable%20name%3d%22Address1%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Address1" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Address2%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Address2" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Address3%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Address3" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Address4%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Address4" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22PostalCode%22%20%2f%3e%20%21%3d%20%22%22" >, <actinic:variable encoding="html" name="PostalCode" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Country%22%20%2f%3e%20%21%3d%20%22%22%20AND%20%3cactinic%3avariable%20name%3d%22PostalCode%22%20%2f%3e%20%21%3d%20%22%22"> </actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Country%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Country" /></actinic:block><br>
        Tel. <actinic:variable encoding="html" name="Phone" />
        </font>
        </td>
        </tr>
        </table>
        </td>
        </tr>
        </table>
        
        </body>
        </html>
        Becomes this:

        Code:
        <!DOCTYPE HTML>
        <html>
        <head>
        </head>
        <body style="font-family: ; font-size: <actinic:variable name="StandardFontSize" />">
        <table width="100%" cellpadding="10" cellspacing="0" style="border: 1px solid <actinic:variable name="Palette1" />">
        <tr>
        <td colspan="2" style="border-bottom: 5px double #aaaaaa; ; background: <actinic:variable name="PaletteBG" />; color: <actinic:variable name="Palette1" />
        <actinic:block if="%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Academic%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Edge%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Academic%20Stylesheet%202013%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Edge%20Stylesheet%202013%22" >
        ; background: <actinic:variable name="Palette1" />; color: <actinic:variable name="PaletteBG" />
        </actinic:block>
        <actinic:block if="%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Angles%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Art%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Clinical%20Stylesheet%22%20OR%0d%3cactinic%3avariable%20name%3d%22StyleSheetLayout%22%20showlayoutname%3d%22true%22%2f%3e%20%3d%3d%20%22Elegance%20Stylesheet%22" >
        ; background: <actinic:variable name="Palette2" />; color: <actinic:variable name="PaletteBG" />
        </actinic:block>
        ">
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="5">
        <a href="<actinic:variable name="WebSiteURL" />">
        <img
        src="<actinic:variable name="CatalogURL" /><actinic:variable name="CompanyLogoFileName" />"
        border="0"
        align="middle"
        hspace="10" /></a>
        <b><actinic:variable encoding="html" name="CompanyName" /></b></font>
        </td>
        </tr>
        <tr>
        
        <td style="background: <actinic:variable name="Palette1" />">
        <table cellspacing="20" style="padding: 20px; clear: left; overflow: hidden; background: <actinic:variable name="PaletteBG" />; color: <actinic:variable name="TextColor" />; border: 2px dotted <actinic:variable name="Palette2" />">
        <tr>
        <td style="min-width: 100px; clear: none; float: left">
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="2">
        <actinic:variable name="INNERLAYOUT" />
        </font>
        </td>
        </tr>
        <tr>
        <td style="line-height: 18px; padding: 10px; border: 5px double #aaaaaa; text-align: center; background: <actinic:variable name="Palette3" />">
        <font face="<actinic:variable name="ACTCSSFONTFAMILY" />" size="1">
        <actinic:variable encoding="html" name="CompanyName" /><actinic:block if="%3cactinic%3avariable%20name%3d%22Address1%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Address1" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Address2%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Address2" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Address3%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Address3" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Address4%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Address4" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22PostalCode%22%20%2f%3e%20%21%3d%20%22%22" >, <actinic:variable encoding="html" name="PostalCode" /></actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Country%22%20%2f%3e%20%21%3d%20%22%22%20AND%20%3cactinic%3avariable%20name%3d%22PostalCode%22%20%2f%3e%20%21%3d%20%22%22"> </actinic:block><actinic:block if="%3cactinic%3avariable%20name%3d%22Country%22%20%2f%3e%20%21%3d%20%22%22">, <actinic:variable encoding="html" name="Country" /></actinic:block><br>
        Tel. <actinic:variable encoding="html" name="Phone" />
        </font>
        </td>
        </tr>
        </table>
        </td>
        </tr>
        </table>
        
        </body>
        </html>
        This takes out that block on the left and provides a cleaner email for mobile, I doubt anyone uses the links on that side menu from the email so nothing really lost by removing it.
        Many Thanks
        Lee
        www.mdnsupplies.co.uk
        www.hookandloopfasteners.co.uk

        Comment


          #5
          Interesting thanks for sharing that.
          https://www.harrisontelescopes.co.uk/

          Ed Harrison - Menmuir Scotland

          Comment


            #6
            MDN
            I removed the table that contains all the side links from the 'Email Outer Layout'
            Perfect response - thank you!
            Jonathan Chappell
            Website Designer
            SellerDeck Website Designer
            Actinic to SellerDeck upgrades
            Graphicz Limited - www.graphicz.co.uk

            Comment

            Working...
            X