ตั้งค่าและจัดรูปแบบฟอร์ม HubSpot บนเว็บไซต์ภายนอก

 หลังจากสร้างฟอร์มใน HubSpot แล้วคุณสามารถเพิ่มลงในหน้า HubSpot หรือหน้าที่คุณสร้างไว้นอก HubSpot ได้ คุณสามารถแชร์แบบฟอร์มบนเว็บไซต์ภายนอกที่ไม่ใช่ของ HubSpot ได้โดย:

• การฝังรหัสแบบฟอร์มลงในหน้าเว็บที่มีอยู่
• การสร้างหน้าแบบฟอร์มแบบสแตนด์อโลนที่คุณสามารถเชื่อมโยงได้

ด้วยวิธีการใดวิธีการหนึ่งการเปลี่ยนแปลงที่เกิดขึ้นกับแบบฟอร์มในเครื่องมือแบบฟอร์มของ HubSpot จะปรากฏในแบบฟอร์มสดบนเว็บไซต์ภายนอกของคุณโดยอัตโนมัติ หลังจากเพิ่มแบบฟอร์มของคุณแล้วคุณสามารถจัดสไตล์แบบฟอร์ม HubSpot ที่ฝังอยู่ในหน้าเว็บภายนอกของคุณในตัวแก้ไขแบบฟอร์มหรือด้วย CSS ในสไตล์ชีตภายนอกของคุณ

โปรดทราบ: คุณไม่สามารถตั้งค่าแบบฟอร์มของคุณเป็น HTML ดิบในตัวแก้ไขที่อัปเดตแล้วได้ เฉพาะแบบฟอร์มที่สร้างโดยใช้ตัวแก้ไขดั้งเดิมเท่านั้นที่สามารถตั้งค่าเป็น HTML ดิบได้ 

จัดสไตล์แบบฟอร์มของคุณ 

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

• ในบัญชี HubSpot ของคุณ ไปที่ การตลาด > แบบฟอร์ม
• สร้างแบบฟอร์มใหม่หรือวางเมาส์เหนือแบบฟอร์มที่มีอยู่แล้วคลิกแก้ไข 
• ทางด้านซ้ายให้คลิกไอคอนจัดแต่งทรงผม

• เมื่อปรับแต่งข้อความ ฟิลด์อินพุตหรือปุ่มของคุณคุณสามารถเลือกจากสไตล์ที่มีอยู่โดยใช้สไตล์อินพุตฟิลด์ด่วน หรือคุณสามารถปรับแต่งสไตล์สำหรับแต่ละองค์ประกอบในแบบฟอร์มของคุณได้ด้วยตนเอง:
  • ฟิลด์: ปรับแต่งฟิลด์รวมถึงพื้นหลังและเส้นขอบ นอกจากนี้คุณยังสามารถปรับแต่งแบบอักษรขนาดตัวอักษรและสีสำหรับป้ายกำกับของคุณรวมถึงสีสำหรับข้อความช่วยเหลือตัวยึดตำแหน่งและข้อความแสดงข้อผิดพลาดของคุณ 
  • ปุ่ม: ปรับแต่งความสูงของปุ่มการปัดเศษมุมพื้นหลังการไล่ระดับสีและเพิ่มเงาแบบหยดลงในปุ่ม นอกจากนี้คุณยังสามารถปรับแต่งแบบอักษรขนาดตัวอักษรและสีสำหรับข้อความบนปุ่มได้อีกด้วย 
  • ย่อหน้า (Rich Text): ปรับแต่งแบบอักษรขนาดตัวอักษรและสีสำหรับข้อความเนื้อหาของคุณ 
  • หัวเรื่อง: ปรับแต่งแบบอักษรและสีข้อความของหัวเรื่องของคุณ คุณสามารถเลือกที่จะเพิ่มเงาแบบหล่นลงในข้อความส่วนหัวของคุณ 
  • พื้นหลัง: ปรับแต่งพื้นหลังสำหรับขั้นตอนแบบฟอร์มและแบบฟอร์มของคุณ คุณสามารถเลือกที่จะตั้งค่าสีพื้นหลังหรือใช้รูปภาพสำหรับพื้นหลังก็ได้ คุณสามารถใช้ผู้ช่วย AI เพื่อสร้างภาพได้ นอกจากนี้คุณยังสามารถเลือกที่จะกำหนดเส้นขอบสำหรับแบบฟอร์มของคุณ
  • แถบความคืบหน้า: ปรับแต่งแถบความคืบหน้าในแบบฟอร์มของคุณรวมถึงสีของเส้นความคืบหน้าและแบบอักษรของแถบความคืบหน้า 

เพิ่มรหัสฝังแบบฟอร์ม

วิธีเข้าถึงรหัสการฝังแบบฟอร์ม: 

• ในบัญชี HubSpot ของคุณ ไปที่ การตลาด > แบบฟอร์ม
• วางเมาส์เหนือแบบฟอร์มแล้วคลิกการดำเนินการ > แชร์ 
• คลิกแท็บ ฝังโค้ด
• ในกล่องโต้ตอบหากคุณต้องการเพิ่มผู้ติดต่อที่ส่งแบบฟอร์มไปยังแคมเปญ Salesforce ให้คลิกที่เพิ่มผู้ติดต่อไปยังเมนูแบบเลื่อนลงของแคมเปญ Salesforce แล้วเลือก แคมเปญ หากคุณเชื่อมโยงแคมเปญ Salesforce กับแบบฟอร์มของคุณโค้ดฝังของแบบฟอร์มจะถูกเปลี่ยน ในกรณีนี้คุณต้องเพิ่มโค้ดฝังลงในเว็บไซต์ภายนอกของคุณอีกครั้ง
• คลิกคัดลอก
• วางโค้ดฝังลงในโมดูล HTML บนหน้าเว็บภายนอกของคุณ ในการติดตามการวิเคราะห์สำหรับแบบฟอร์มของคุณรหัสติดตาม HubSpot ของคุณจะต้องติดตั้งบนหน้าเว็บภายนอกที่คุณวางแบบฟอร์ม HubSpot 

สร้างหน้าแบบฟอร์มแบบสแตนด์อโลน 

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

• ในบัญชี HubSpot ของคุณ ไปที่ การตลาด > แบบฟอร์ม
• วางเมาส์เหนือแบบฟอร์มแล้วคลิกการดำเนินการ > แชร์ 
• ในกล่องโต้ตอบให้คลิกแท็บแชร์ลิงก์  
• คลิกคัดลอกเพื่อคัดลอก URL ของหน้าแบบฟอร์มไปยังคลิปบอร์ดของคุณ 
• ในเบราว์เซอร์ให้เปิดหน้าต่างหรือแท็บใหม่และวาง URL ของหน้าฟอร์มในแถบที่อยู่เพื่อโหลด นอกจากนี้คุณยังสามารถแชร์ URL ของหน้าแบบฟอร์มกับผู้อื่นได้โดยตรงเพื่อให้พวกเขาเข้าถึงแบบฟอร์มได้