5

How can I make custom Google Web Designer Components?

I was assuming they'd be like Adobe Flash Components. It's in Beta and I can't find much info on it all.

I've tried searching in all of the directories under /Applications/Google Web Designer.app/Contents to see if I could spy some samples. And the docs are geared towards users: https://support.google.com/webdesigner/

I want to build HTML5 ad Components the team can use.

Jeremy
  • 1
  • 85
  • 340
  • 366
Lex
  • 4,749
  • 3
  • 45
  • 66
  • 2
    Hang tight -- API documentation and code samples should be coming soon. :) – Jeremy Apr 14 '15 at 00:35
  • **To reviewers:** Due to my conflict of interest I skipped this question instead of voting to "keep open", but I do believe it's valid and would like to discuss it in chat if you disagree. Feel free to ping me to the JavaScript room or the Tavern. As my previous comment alluded to, this question *is* primarily about programming for a particular JavaScript API, for which documentation is expected soon. Thanks. – Jeremy Apr 14 '15 at 00:42
  • 1
    I found this after some digging: https://support.google.com/webdesigner/answer/6191694?hl=en&ref_topic=6175711&vid=1-635761907116760653-2556916812... It's a start. – johngeorgewright Aug 26 '15 at 13:47

1 Answers1

3
  1. You should create your own custom tags based on W3C standard

  2. Create json manifest for your component:

    { name: {string} A human readable name description: {string} A succinct but complete description of the component type: {string} The element type, which must contain a dash (-) version: {number} The version number, which must be incremented with each update files: {Array.<FilesObject>} The JS and CSS files for the component externalScripts: {Array.<string>} The external script dependencies dependencies: {Array.<string>} The dependent types attributes: {Array.<Attribute>} The attributes of the component methods: {Array.<Method>} The methods of the component events: {Array.<Event>} The events dispatched by the component metrics: {Array.<MetricEvent>} Events that must be tracked as a metric }

  3. Create all the required .js and .css then package the components.

In the following link you can find a tutorial on how to create custom components for GWD.

https://support.google.com/webdesigner/topic/6175711?hl=en&ref_topic=6175722&vid=1-635799099790786490-3463806884

Hope it helps.

Majid Kalkatechi
  • 691
  • 7
  • 15