สร้างไฟล์ SVG สำหรับ BIMI (ขั้นตอนโดยละเอียด)

หน้านี้อธิบายวิธีสร้างไฟล์ SVG สำหรับ BIMI เพื่อให้คุณเพิ่มโลโก้ลงในข้อความอีเมลด้วย BIMI ได้

ขณะนี้ยังไม่มีแอปพลิเคชันสำหรับสร้างไฟล์ SVG ที่ตรงตามข้อกำหนดทั้งหมดของ BIMI โดยปกติแล้วผู้ใช้จะต้องแก้ไขไฟล์ SVG สำหรับ BIMI ด้วยตนเอง โดยใช้เครื่องมือแก้ไขข้อความ หรือใช้สคริปต์สำหรับวัตถุประสงค์พิเศษ ดูข้อมูลเกี่ยวกับเครื่องมือที่แนะนำ ในการสร้างไฟล์ SVG สำหรับ BIMI

คุณสามารถใช้ Adobe Illustrator เพื่อสร้างไฟล์ SVG จากนั้นก็ทำการปรับเปลี่ยนเล็กน้อยในเครื่องมือแก้ไขข้อความ เมื่อสร้างไฟล์ SVG โปรดทำตาม ข้อกำหนดและคำแนะนำสำหรับไฟล์ SVG

1. เปิดรูปภาพเวกเตอร์ต้นฉบับใน Illustrator ตรวจสอบว่าไฟล์ภาพเป็นไปตาม ข้อกำหนดและคำแนะนำเหล่านี้สำหรับรูปภาพ BIMI ของ Gmail (ซึ่งเป็น ส่วนเพิ่มเติมจากข้อกำหนดมาตรฐานของ BIMI)
   1. ความสูงและความกว้างขั้นต่ำคือ 96 พิกเซล
   2. ต้องระบุขนาดรูปภาพเป็นพิกเซลจำนวนเต็ม เช่น width="96" height="96"
   3. อย่าใช้ขนาดสัมพัทธ์เพื่อระบุขนาดรูปภาพ ตัวอย่าง: width="100%" height="100%"
   4. ภาพโลโก้ควรอยู่ตรงกลางในสี่เหลี่ยมจัตุรัส
   5. รูปภาพโลโก้ควรปรากฏบนพื้นหลังสีทึบ เนื่องจากพื้นหลังที่โปร่งใสอาจไม่แสดงผลอย่างที่ต้องการ
   6. ไฟล์ SVG ควรมีขนาดไม่เกิน 32 KB
   7. ไฟล์ SVG ควรมีองค์ประกอบ <desc> (คำอธิบาย) เพื่อการช่วยเหลือพิเศษ
   8. ไฟล์ SVG ไม่ควรมีบิตแมป ลิงก์ไปยังไฟล์ ข้อความ หรือออบเจ็กต์ที่จัดกลุ่มไว้รายการอื่นๆ หากต้องการเพิ่มข้อความเป็นออบเจ็กต์ในไฟล์ ให้ใช้ฟีเจอร์ Create outlines ของ Illustrator
2. เลือก File > Save As…
3. ในหน้าต่างบันทึกเป็น ให้ทำดังนี้
   • ป้อนชื่อไฟล์ในช่องบันทึกเป็น เราขอแนะนำให้ใช้ตัวอักษรพิมพ์เล็กและขีดกลางเท่านั้น เช่น mybrand-bimi.svg อย่าใช้ สัญลักษณ์พิเศษ
   • ถัดจาก Format ให้เลือก SVG (svg) อย่าเลือก SVG Compressed (svgz)
4. คลิกปุ่มบันทึก
5. ในหน้าต่าง SVG Options ให้ทำดังนี้
   • ถัดจาก SVG Profiles ให้เลือก SVG Tiny 1.2
   • ถัดจาก Image Location ให้เลือก Preserve
6. คลิกปุ่ม OK เพื่อบันทึกไฟล์ให้เสร็จสิ้น

7. เปิดไฟล์ในเครื่องมือแก้ไขข้อความ คุณจะต้องแก้ไขส่วนแรกของไฟล์ ซึ่งมีลักษณะคล้ายกับตัวอย่างนี้

   <?xml version="1.0" encoding="utf-8"?>
   <svg version="1.2" baseProfile="tiny" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="96px"
   y="96px" viewBox="0 0 742.23 828.45" overflow="visible" xml:space="preserve">
   <g id="design">
   

8. เปลี่ยนบรรทัดที่ 3 และ 4 ของไฟล์ข้อความ

   • ตรวจสอบว่าค่า svg version เป็น 1.2 หากไม่ใช่ ให้เปลี่ยนเป็น 1.2
   • เปลี่ยนค่า baseProfile เป็น tiny-ps
   • นำแอตทริบิวต์กับค่า x และ y ออก
   • เพิ่มแท็ก <title> และค่าตามที่ปรากฏในตัวอย่างจากขั้นตอนที่ 8 โดยชื่อจะต้องอยู่หลัง <svg และมาก่อน <g>

9. หลังจากแก้ไขแล้ว ให้ยืนยันว่าส่วนแรกของไฟล์มีรูปแบบคล้ายกับตัวอย่างนี้

   <?xml version="1.0" encoding="utf-8"?>
   <svg version="1.2" baseProfile="tiny-ps" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
   overflow="visible" xml:space="preserve">
   <title>Solarmora Services</title>
   <g id="design">
   

10. บันทึกการเปลี่ยนแปลงเป็นไฟล์ข้อความ โดยนามสกุลไฟล์ต้องเป็น .svg

ขั้นตอนถัดไป

จากนั้นรับ VMC รวมถึงไฟล์ PEM และใบรับรองที่เกี่ยวข้อง

Google, Google Workspace รวมถึงเครื่องหมายและโลโก้ที่เกี่ยวข้องเป็นเครื่องหมายการค้าของ Google LLC ชื่อบริษัทและชื่อผลิตภัณฑ์อื่นๆ ทั้งหมดเป็นเครื่องหมายการค้าของ บริษัทที่เกี่ยวข้อง