Mag-import ng Figma frame sa WordPress gamit ang Page Builder Sandwich

Kino-convert ng Page Builder Sandwich Pro ang isang Figma frame sa isang nae-edit na page ng WordPress. Nakikipag-ugnayan ang site sa Figma gamit ang iyong sariling Figma account, gamit ang isang personal access token na gagawin mo; walang disenyo o token na dumadaan sa Zinn Digital®.

Ikonekta ang Figma (nang minsan, bilang administrator)

1. Sa Figma, buksan ang Settings → Security → Personal access tokens at gumawa ng token na may scope na File content: read.
2. Sa wp-admin, pumunta sa Page Builder Sandwich → Import from other builders and Figma → Import from Figma, i-paste ang token at pindutin ang Connect Figma.

Sinusuri ang token sa Figma, nakaimbak nang naka-encrypt, at hindi na muling ipapakita kailanman (ang huling apat na character lang nito). Tinatanggal ito ng Disconnect. Sa command line: echo <token> | wp pbs importers figma-token set (binabasa ang token mula sa standard input, kaya hindi ito mase-save sa history ng iyong shell).

Mag-import ng frame

1. Sa Figma, mag-click sa isang frame, i-right-click ito at piliin ang Copy/Paste as → Copy link to selection.
2. I-paste ang link sa Figma frame link at pindutin ang Import the frame. Isang bagong draft na page ang gagawin, na ipapangalan mula sa frame.

Paano kinokumberte ang disenyo

• Ang Auto layout ay nagiging mga flex row at column (at mga grid para sa grid auto layout) na may parehong gap, padding, at alignment; ang isang frame na malayang inilatag ay pinagpapatong-patong ayon sa pagkakasunod-sunod ng pagbasa, at isinasaad ito sa ulat kapag nagpatong ang mga layer.
• Ang isang frame ng page na binubuo ng mga full-width na band ay nagiging isang full-width na section bawat band.
• Pinapanatili ng Text ang font, laki, weight, line height, letter spacing, case, alignment, at kulay nito; ang malaking teksto ay nagiging mga heading, at pinapanatili ang mga naka-bold at naka-italic na bahagi pati ang mga link.
• Naililipat ang mga Fill, stroke, corner radius, at drop shadow, kabilang ang mga gradient.
• Ang mga Larawan ay kinokopya sa iyong media library, at ang vector art (mga icon, ilustrasyon) ay nire-render ng Figma at kinokopya bilang larawan (hanggang 200 drawing bawat pag-import). Muling ginagamit ng pag-import sa parehong frame ang mga kopya.
• Ang isang maliit na frame na may fill, bilugang mga sulok, at isang maikling label (o isang layer na pinangalanang "button") ay nagiging isang Button block.

Sa telepono, ang mga row ng mga item na may nakatakdang lapad ay nagsasalansan sa isang column, dahil ang isang Figma frame ay iginuhit sa iisang lapad lamang.

Mula sa command line: wp pbs importers figma <frame link>.