ນຳເຂົ້າເຟຣມ Figma ໄປໃສ່ WordPress ດ້ວຍ Page Builder Sandwich

Page Builder Sandwich Pro ປ່ຽນ ເຟຣມ Figma ໃຫ້ເປັນໜ້າ WordPress ທີ່ສາມາດແກ້ໄຂໄດ້. ເວັບໄຊຈະຕິດຕໍ່ສື່ສານກັບ Figma ດ້ວຍ ບັນຊີ Figma ຂອງທ່ານເອງ, ໂດຍໃຊ້ໂທເຄັນການເຂົ້າເຖິງສ່ວນຕົວທີ່ທ່ານສ້າງຂຶ້ນ; ບໍ່ມີການອອກແບບ ຫຼື ໂທເຄັນໃດໆ ຜ່ານ Zinn Digital®.

ເຊື່ອມຕໍ່ Figma (ຄັ້ງດຽວ, ໃນຖານະຜູ້ເບິ່ງແຍງລະບົບ)

1. ໃນ Figma, ເປີດ Settings → Security → Personal access tokens ແລະ ສ້າງໂທເຄັນທີ່ມີຂອບເຂດ File content: read.
2. ໃນ wp-admin ໄປທີ່ Page Builder Sandwich → Import from other builders and Figma → Import from Figma, ວາງໂທເຄັນ ແລະ ກົດ Connect Figma.

ໂທເຄັນຈະຖືກກວດສອບກັບ Figma, ຖືກຈັດເກັບແບບ ເຂົ້າລະຫັດ, ແລະ ຈະບໍ່ສະແດງອີກເລີຍ (ສະແດງພຽງແຕ່ສີ່ຕົວອັກສອນສຸດທ້າຍເທົ່ານັ້ນ). Disconnect ຈະລຶບມັນອອກ. ໃນຄໍາສັ່ງ command line: echo <token> | wp pbs importers figma-token set (ໂທເຄັນຈະຖືກອ່ານຈາກ standard input, ດັ່ງນັ້ນມັນຈະບໍ່ຖືກບັນທຶກໄວ້ໃນປະຫວັດ shell ຂອງທ່ານ).

ນໍາເຂົ້າເຟຣມ

1. ໃນ Figma, ຄລິກ ໜຶ່ງເຟຣມ, ຄລິກຂວາໃສ່ມັນ ແລ້ວເລືອກ Copy/Paste as → Copy link to selection.
2. ວາງລິ້ງໃສ່ Figma frame link ແລ້ວກົດ Import the frame. ໜ້າສະບັບຮ່າງໃໝ່ຈະຖືກສ້າງຂຶ້ນ, ໂດຍຕັ້ງຊື່ຕາມເຟຣມ.

ວິທີການແປງການອອກແບບ

• Auto layout ຈະປ່ຽນເປັນ flex rows ແລະ columns (ແລະ grids ສໍາລັບ grid auto layout) ດ້ວຍ gap, padding ແລະ alignment ດຽວກັນ; ເຟຣມທີ່ຈັດວາງແບບອິດສະຫຼະຈະຖືກວາງຊ້ອນກັນຕາມລໍາດັບການອ່ານ, ແລະ ບົດລາຍງານຈະແຈ້ງບອກເມື່ອມີເລເຢີຊ້ອນທັບກັນ.
• ເຟຣມໜ້າທີ່ສ້າງຂຶ້ນຈາກແຖບຄວາມກວ້າງເຕັມ (full-width bands) ຈະປ່ຽນເປັນໜຶ່ງພາກສ່ວນຄວາມກວ້າງເຕັມຕໍ່ໜຶ່ງແຖບ.
• ຂໍ້ຄວາມ ຈະຮັກສາຟອນ, ຂະໜາດ, ຄວາມໜາ, ຄວາມສູງຂອງແຖວ, ໄລຍະຫ່າງຕົວອັກສອນ, ຮູບແບບຕົວພິມ, ການຈັດວາງ ແລະ ສີ; ຂໍ້ຄວາມຂະໜາດໃຫຍ່ຈະປ່ຽນເປັນຫົວຂໍ້, ສ່ວນຂໍ້ຄວາມໜາ, ໂຕອຽງ ແລະ ລິ້ງ ຈະຖືກຮັກສາໄວ້.
• Fills, strokes, corner radius ແລະ drop shadows ຈະຖືກສົ່ງຕໍ່ມາຄົບຖ້ວນ, ລວມທັງ gradients.
• ຮູບພາບ ຈະຖືກຄັດລອກໄປໃສ່ media library ຂອງທ່ານ, ແລະ vector art (ໄອຄອນ, ຮູບພາບປະກອບ) ຈະຖືກປະມວນຜົນໂດຍ Figma ແລະ ຄັດລອກເປັນຮູບພາບ (ສູງສຸດ 200 ຮູບແຕ້ມຕໍ່ການນໍາເຂົ້າ). ການນໍາເຂົ້າເຟຣມດຽວກັນອີກຄັ້ງ ຈະນໍາໃຊ້ສໍາເນົາເກົ່າຄືນໃໝ່.
• ເຟຣມຂະໜາດນ້ອຍທີ່ມີ fill, ມຸມມົນ ແລະ ປ້າຍຂໍ້ຄວາມສັ້ນໆ ອັນດຽວ (ຫຼື ເລເຢີທີ່ຕັ້ງຊື່ວ່າ "button") ຈະປ່ຽນເປັນບລັອກ Button.

ໃນໂທລະສັບ, ແຖວຂອງລາຍການທີ່ມີຄວາມກວ້າງຄົງທີ່ຈະຖືກຈັດຊ້ອນກັນເປັນຖັນ, ເນື່ອງຈາກເຟຣມ Figma ຖືກແຕ້ມຂຶ້ນມາໃນຂະໜາດຄວາມກວ້າງດຽວ.

ຈາກ command line: wp pbs importers figma <frame link>.