วิธีสร้างแถบด้านข้างใน Google ชีต

แถบด้านข้างเป็นองค์ประกอบอินเทอร์เฟซผู้ใช้ (พื้นที่แนวตั้งขนาดเล็ก) ที่ปรากฏทางด้านซ้ายหรือด้านขวาของหน้าต่างขนาดใหญ่หรือบนหน้าจอผู้ใช้เพื่อแสดงข้อมูลที่เกี่ยวข้องหรือรายการตัวเลือกหรือตัวเลือกการนำทาง

แถบด้านข้างใน Google ชีตคือแผงส่วนต่อประสานผู้ใช้ที่แสดงทางด้านขวาของ Google ชีต Google มีตัวแก้ไขสคริปต์ในตัวที่เรียกว่า Apps Script ซึ่งสามารถสร้างส่วนเสริมและองค์ประกอบต่างๆ สำหรับแอปพลิเคชัน G-Suite นอกจากนี้ยังสามารถใช้สำหรับสร้างแถบด้านข้างของคุณเองใน Google ชีต

บทความนี้จะแสดงวิธีสร้างแถบด้านข้างที่กำหนดเองใน Google ชีตโดยใช้โปรแกรมแก้ไข Google Apps Script

การสร้างแถบด้านข้างใน Google ชีตโดยใช้ Apps Script

หากคุณต้องการสร้างแถบด้านข้างแบบกำหนดเอง คุณต้องป้อนและเรียกใช้โค้ดบางอย่างในตัวแก้ไข Apps Script จากนั้น คุณสามารถสร้างวิดเจ็ตของคุณเองภายในแถบด้านข้างโดยใช้โค้ด HTML, CSS และ Javascript

ขั้นแรก เปิด Google ชีต ในเมนู Google ชีต คลิก 'เครื่องมือ' และเลือก 'ตัวแก้ไขสคริปต์'

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

เขียนโค้ดต่อไปนี้ในหน้า Code.gs:

ฟังก์ชั่น onOpen() { SpreadsheetApp.getUi() .createMenu('My New Menu') .addItem('My sidebar 1', 'showSidebar') .addToUi(); } ฟังก์ชั่น showSidebar () { var html = HtmlService.createHtmlOutputFromFile ('Sidebar') .setTitle ('แถบด้านข้างการคำนวณ'); SpreadsheetApp.getUi() .showSidebar(html); สเปรดชีตApp.getUi() }

ในโค้ดสคริปต์ Code.gs ด้านบน ฟังก์ชัน OnOpen() จะสร้างเมนูแบบกำหนดเองที่เรียกว่า 'My New Menu' ในแถบเมนู Google ชีต เมนูนั้นจะมีรายการเมนูที่เรียกว่า 'แถบด้านข้างของฉัน-1' เมื่อคุณคลิกรายการเมนูนี้ ฟังก์ชัน showAdminSidebar() (ส่วนที่สองของโค้ด) จะทำงานและแถบด้านข้างจะแสดงที่ด้านขวามือของหน้าต่าง Google ชีต

ต่อไป เราต้องสร้างไฟล์ HTML ในตัวแก้ไขสคริปต์ จากนั้นคุณสามารถสร้างแถบด้านข้างด้วยไฟล์นี้

หากต้องการสร้างไฟล์ HTML ให้คลิกที่ไอคอนเครื่องหมายบวก (+) ข้างไฟล์ในโปรแกรมแก้ไขสคริปต์ของ Apps แล้วเลือก "HTML"

สิ่งนี้จะสร้างไฟล์ HTML ด้านล่าง Code.gs เปลี่ยนชื่อไฟล์เป็น 'แถบด้านข้าง' ชื่อนี้ควรเหมือนกับชื่อที่เพิ่มในฟังก์ชัน showSidebar() (var html = HtmlService.createHtmlOutputFromFile('Sidebar'))

เขียนโค้ดต่อไปนี้ภายในส่วนของไฟล์ Sidebar.html:

นี่คือแถบด้านข้างใหม่ของฉัน

รหัสด้านบนแสดงสตริงข้อความ 'นี่คือแถบด้านข้างใหม่ของฉัน' และ 'ปิด' ซึ่งปิดแถบด้านข้างเมื่อคลิกที่มัน

หลังจากที่คุณเขียนโค้ดด้านบนในส่วนของ Sidebar.html เสร็จแล้ว โค้ดดังกล่าวควรมีโค้ดต่อไปนี้:

นี่คือแถบด้านข้างใหม่ของฉัน

ภาพหน้าจอ:

เมื่อคุณป้อนรหัสทั้งสองเสร็จแล้ว ให้บันทึกโครงการโดยคลิกไอคอนบันทึกในแถบเครื่องมือ (ดูภาพหน้าจอด้านล่าง) จากนั้นเรียกใช้ฟังก์ชันโดยคลิกที่ไอคอน 'เรียกใช้'

ไม่ว่าคุณจะเรียกใช้สคริปต์ที่นี่หรือเลือกรายการเมนูที่กำหนดเองในแถบเครื่องมือ Google ชีต (เป็นครั้งแรก) Google จะขอให้คุณอนุญาตให้เรียกใช้สคริปต์ เนื่องจากคุณใช้วิดเจ็ตที่กำหนดเองของบุคคลที่สาม Google จะขออนุญาตจากคุณ เมื่อคุณให้สิทธิ์สคริปต์แล้ว สคริปต์จะแสดงแถบด้านข้างภายใน Google ชีตของคุณ

วิธีให้สิทธิ์โค้ดสคริปต์ของแอปใน Google

ในการอนุญาตสคริปต์ที่กำหนดเองของคุณ ให้ทำตามขั้นตอนเหล่านี้:

เมื่อคุณเรียกใช้สคริปต์ Google จะขอให้คุณเลือกบัญชี Google ของคุณ หลังจากที่คุณเลือกแล้ว ป๊อปอัปขนาดเล็กจะปรากฏขึ้น ให้คลิกที่ 'ตรวจสอบสิทธิ์'

ป๊อปอัปอื่นจะปรากฏขึ้นที่นี่ เลือก "แสดงขั้นสูง" แล้วคลิก "ไปที่โครงการที่ไม่มีชื่อ (ไม่ปลอดภัย)" (จะแสดงชื่อโครงการของคุณ)

ในหน้าต่างถัดไป คลิก 'อนุญาต' และ Google ชีตจะเรียกใช้สคริปต์ของคุณ

เมื่อคุณทำเสร็จแล้ว ให้กลับไปที่ Google ชีตของคุณและรีเฟรช เมนูกำหนดเองใหม่ (เมนูใหม่ของฉัน) จะถูกเพิ่มลงในแถบเครื่องมือ Google ชีตของคุณ ซึ่งเราได้เพิ่มผ่านสคริปต์ Code.gs คลิก 'เมนูใหม่ของฉัน' และเลือกรายการเมนู 'แถบด้านข้างของฉัน 1' เพื่อแสดงแถบด้านข้าง

ตอนนี้แถบด้านข้างที่กำหนดเองของคุณจะแสดงขึ้นที่ด้านขวามือของ Google ชีตพร้อมข้อความและปุ่มที่เราเพิ่ม (ดังแสดงด้านล่าง) เมื่อคุณคลิกปุ่ม แถบด้านข้างจะปิดลง

ตอนนี้คุณรู้วิธีสร้างแถบด้านข้างของคุณเองใน Google ชีตแล้ว