Adaptive CSS LAyouts in Marketo? | Community
Skip to main content
January 3, 2013
Question

Adaptive CSS LAyouts in Marketo?

  • January 3, 2013
  • 6 replies
  • 2419 views
Has anyone successfull implimented an adaptive CSS framework like ZURB with marketo form layouts?

If yes do can I email you off line to ask questions about your approach? 

Doed anyone know of any good blog articles that address this challange with marketo?


This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

6 replies

January 3, 2013
Hello! 

I haven't done this, but are you familiar with how to edit standard templates in the template editor?

I think you could definitely do this by simply modifying the css on the required Marketo DIV IDs, like "outerWrapDiv" and "innerWrapDiv", and then including ZURB code within this container....

Then, include link and script tags that reference the ZURB libraries...

I may try this!  




January 3, 2013
What about the absolute postioning of elements once the marketing author has dragged and droped items the screen? The last time I tried this it broke the UI for the form builder...  

January 3, 2013
In the landing page editor, have you tried adjusting the width of the elements via the property sheet?  

You can specify percentage widths for each of the elements here.  Unfortunately, it won't allow you to change the "position" property, so you can't specify relative positioning.  
January 3, 2013
Another question....  I am assuming you are thinking about doing this in javascript to manipulate the DOM elements? 

If yes it seems like you may get wonkyness when the page loads becuase you are creating the prersentation at the DOM ready event...  Would you then hide the page on load... Manipluate the DOM...  Then fade the page in?  Would this impact SEO by setting a display none on the overall wrapper DIVs?

Steve

January 3, 2013
"In the landing page editor, have you tried adjusting the width of the elements via the property sheet?  

You can specify percentage widths for each of the elements here.  Unfortunately, it won't allow you to change the "position" property, so you can't specify relative positioning. "



Thank you for the response and help.... To ensure clarity...  So what you are suggesting is creating a wrapper that all the absolute postioned items postion to verse having them postioned to the body tag...   This way when the page collapese to mobile or tablet they will be in line with the wrapper tag...  

I am still not fully picturing your suggested solution...  Becuase it would seem like if they are positioned absolute and the left value is at 60px, and the top is at 100px, and a width of 20%...  No matter what happens when the page collapses it will render off outside of the browser window... 
January 3, 2013
There was another discussion similar to this here: https://community.marketo.com/MarketoDiscussionDetail?id=90650000000PWbrAAG

It looks like, as of right now, it is not entirely possible.