If the document tabs won't all fit in the window, you can see a list of all open documents in a pop-up menu by clicking the More icon to the right of the tabs. You can switch between documents by clicking a tab, or pressing Ctrl+ Tab to jump to the next document or Shift+ Ctrl+ Tab to jump to the previous document. When multiple documents are open, their filenames display on separate tabs. The panels can be resized, rearranged, combined, and closed. Panels include the Color, Properties, Text, Components, CSS, CSS Effects, Responsive, Events, Dynamic, Library, Ad Validator, and Outliner panels. In Quick mode, the animation is created scene-by-scene in Advanced mode you animate each element separately. The timeline lets you create animations using keyframes. Portability - Container Sources that were built with GWD can be opened.
For example, when the Text tool is selected, the tool options bar shows font and text layout options. The tool options bar at the top shows options for the currently selected tool. Select a color from an element on the stage.Ĭhange the active fill and stroke (border) color. Modify the color of elements in your project, including the element's fill, stroke and gradient fills. Available only for image ads and video ads. Rectangle, Oval, and Polygon backdrop toolsĪdd a div with a backdrop filter. Unavailable for AMPHTML or image ads.Ĭreate HTML tags of any type by clicking and dragging on the stage.Ĭreate SVG drawings, including elementary shapes with the shape tools, and bezier curves with the Pen tool. Each item is three or more pieces of related data. Use a description list (or, in some contexts, a table). Each item is a pair of pieces of related data. Use a numbered list, lettered list, or bulleted list. Toolĭraw curved motion paths for animated elements. A list of programming language names, or a list of steps to follow. This includes tools for creating text and simple page elements, color selection tools, and 3D tools. The toolbar contains tools for creating and manipulating elements on the stage. The view bar is available for HTML5 documents, video documents, and image ad documents.
#Google web designer documentation code#
The view bar lets you choose between Design view and Code view, preview your document in a browser, and publish your ad. You can customize Design view and Code view by setting your preferences.ġ. Code view shows the document code with appropriate color coding and formatting.The white stage represents the visible area of the ad or webpage. Design view shows the images, text, and other elements of your document visually, just as they would display in a browser.
Two different document views are available: In the center of the Web Designer interface, you see the current document.