Change metafield input to textarea

Quick hack for the Shopify app (MetaFields Editor by Webify Technology) to change the input field for 'value' to a textarea. Handy for when you are adding larger amounts of data.

by freakdesign

HTML

<!-- 

http://ecommerce.shopify.com/c/ecommerce-design/t/add-a-larger-input-box-to-webify-s-metafields-editor-150596

[Important] This makes some bold assumptions about the existing javascript and layout of the page. Expect it to break whenever Webify updates the app. -->

<h3>About:</h3>
Quick hack for the Shopify app (<a href="http://apps.shopify.com/metafields-editor" target="_blank">MetaFields Editor</a> by Webify Technology) to change the input field for 'value' to a textarea. Handy for when you are adding larger amounts of data.

<h3>Instructions:</h3>

<p>Drag link at the bottom to the browser bar of your browser. Once added, just click it when editing a metafield and you should see this...
    <br />
    <img src="http://monosnap.com/image/0Cytyt1cvIBlAtX1ovJzwoq64.png" />
</p>
<p>turn into this:</p>
<p>
    <img src="http://monosnap.com/image/F11ZmnUlUIAYkzk9IHfzNaCZf.png" />
</p>
<hr />
<p> <a href="javascript:(function(){$('input[name=&quot;metafield[value]&quot;]').each(function(a){v=$(this).val();$(this).after('<textarea id=&quot'+$(this).attr('id')+'&quot style=&quot;min-height: 200px; width: 100%;&quot; name=&quot;metafield[value]&quot;>'+v+'</textarea>').remove()});})();">Change to textarea</a>

</p>

CSS

body {
    font-family:sans-serif;
}