Image coding in html

Highlighted
Anonymous
Not applicable

Image coding in html

Hi, basic I know but I can't make the image editable in the new template and can't find any useful documentation to support this product. It seems a very closed system without any guidance or cheat sheet to refer to. Have any started using this today so bare with me.

Anyway my section of code

<tr>

  <td align="center" class="textCenter" style="">

                                            <div class='mktoImg' id='replaceimage'>

  <img alt="" border="0" src="images/img12.jpg" style="border-radius: 100%;" width="180">

                                            </div>

  </td>

  </tr>

how do you set image paths... do I upload the image and then preview to find the image path?

and why does mktoName='name' always through up error on validation?

Sorry for all the questions but this system seems to make it very hard to do the simplest of things.. Thanks for any help in advance

Tags (2)
9 REPLIES 9
Highlighted
Level 10 - Champion Alumni

Re: Image coding in html

Do you mean in Landing Pages or Emails?

You should always use the absolute path in Marketo. Upload the image to Images and then take the URL from it.

Highlighted
Anonymous
Not applicable

Re: Image coding in html

Thanks I have just been looking at this although I still can't make the image editable or appear editable in email> preview> show edits

code look like this now...

<tr>

   <td align="center" class="textCenter" style="">

                                          <img class='mktoImg' id='dream-image3' mktoname="Image (180x180px)" src='absolute path dir' alt="" border="0" style="border-radius: 100%;" width="180" /></td>

   </tr>

Highlighted
Level 7 - Champion

Re: Image coding in html

Are you trying to make it so people can double-click on the image and change it in an email?

If so, your div's class should be "mktEditable".

Highlighted
Anonymous
Not applicable

Re: Image coding in html

so providing my  td and divs look like this it should become editable for other users.

<td align="center" class="textCenter" style="">

                                            <img class='mktEditable' id='dream-image' mktoName="Image (180x180px)" src='absolute path dir' alt="" border="0" style="border-radius: 100%;" width="180" />

                                            </td>

or does the this to be wrapped in a div

<td align="center" class="textCenter" style="">

                                            <div class='mktEditable' id='dream-image' mktoName="Image (180x180px)" src='absolute path dir' alt="" border="0" style="border-radius: 100%;" width="180" > </div>

                                            </td>

First way show the original image but the second doesn't?

Highlighted
Level 7 - Champion

Re: Image coding in html

Hi, Paul!

It should look like this:

<td align="center" class="textCenter" style="">

     <div class="mktEditable" id="UNIQUE_ID_HERE">

          <img id='dream-image' mktoName="Image (180x180px)" src='absolute path dir' alt="" border="0" style="border-radius: 100%;" width="180" />

     </div>

</td>

Anything within the "mktEditable" div will become editable when you go to use the template.

Also note that each "mktEditable" div needs to have a unique ID or else your template will throw an error.

Highlighted
Anonymous
Not applicable

Re: Image coding in html

thanks that was a great help....

last problem is background images for outlook users...

Marketo does't like <html xmlns:v="urn:schemas-microsoft-com:vml"> WHY?

Highlighted
Level 7 - Champion

Re: Image coding in html

Is it stripping the code from your template?

Highlighted
Anonymous
Not applicable

Re: Image coding in html

its not stripping the code. I thought it was but found out you can't have background images in 07/10/13 version of outlook whilst viewing email in preview mode.

Why people still use this old email clients is beyond me...

Thanks for the help, you have helped in my crash course in Marketo. Not sure I would recommend it to anyone but there is one client determined to stick with it.. thanks

Highlighted
Level 10 - Community Moderator

Re: Image coding in html

Why people still use this old email clients is beyond me...

Outlook 2013 is the latest version of Outlook.