paint-brush
Tạo mẫu lời nhắc ChatGPT bằng cách sử dụng Plugin Google Chrome nàytừ tác giả@sinenko
2,634 lượt đọc
2,634 lượt đọc

Tạo mẫu lời nhắc ChatGPT bằng cách sử dụng Plugin Google Chrome này

từ tác giả Ilya Sinenko5m2023/06/02
Read on Terminal Reader

dài quá đọc không nổi

Plugin ChatGPT của Ilya cho phép bạn thêm các nút trực tiếp vào giao diện Trò chuyện. Lời nhắc cần thiết sẽ được chèn vào trường nhập văn bản. Plugin không phức tạp và tôi sẽ chia sẻ mã của nó ở đây với bạn. Mã này được viết bằng JavaScript và có thể tải xuống từ GitHub.
featured image - Tạo mẫu lời nhắc ChatGPT bằng cách sử dụng Plugin Google Chrome này
Ilya Sinenko HackerNoon profile picture

Khi sử dụng ChatGPT, rất thường xuyên, bạn phải lặp lại cùng một lời nhắc hoặc một phần của cùng một lời nhắc.


Sẽ rất khó chịu khi phải nhập đi nhập lại cùng một nội dung, đặc biệt nếu ChatGPT quên mục đích của cuộc trò chuyện, thì bạn phải lặp lại cùng một yêu cầu trong ngữ cảnh của cuộc đối thoại này hoặc cuộc đối thoại kia. Ban đầu, tôi đã sao chép các lời nhắc tiêu chuẩn vào sổ tay văn bản.


Ví dụ, đây là những lời nhắc như vậy:


  • Tóm tắt văn bản sau bằng tiếng Anh:


  • Nếu văn bản sau đây bằng tiếng Anh, hãy dịch nó sang tiếng Ý và nếu bằng tiếng Ý, hãy dịch sang tiếng Anh:


  • Tạo một bài thơ dựa trên văn bản sau:


  • Tên tôi là Ilya, hãy nghĩ xem nên trả lời tôi như thế nào trong cuộc đối thoại này:


Nhưng mỗi lần mở một tài liệu văn bản và sao chép và dán lời nhắc cần thiết cũng không thuận tiện. Chưa kể thực tế là tôi rất lười biếng và không thích lặp lại các hành động tương tự.


Và sau đó, tôi nảy ra ý tưởng tạo một plugin cho Google Chrome, nhờ đó bạn có thể thêm các nút trực tiếp vào giao diện ChatGPT, bằng cách nhấn vào đó lời nhắc cần thiết sẽ được chèn vào trường nhập văn bản.


Plugin không phức tạp và tôi sẽ chia sẻ mã của nó ở đây với bạn.


Đầu tiên, tạo một thư mục ở đâu đó sẽ chứa plugin của chúng ta. Tôi sẽ đặt tên cho nó /gptinsert


Trong thư mục, bạn có thể tạo ngay một biểu tượng 48x48 pixel, đặt tên là icon.png


Sau đó, chúng ta tạo một file manifest.json với nội dung như sau:


 { "manifest_version": 3, "name": "ChatGPT textarea buttons", "version": "1.0", "permissions": ["activeTab"], "content_scripts": [ { "matches": ["https://chat.openai.com/*"], "js": ["content.js"] } ], "icons": { "48": "icon.png" } }


Sau đó, chúng tôi tạo một tệp sẽ thực hiện công việc của mô-đun của chúng tôi; chúng tôi đặt tên cho nó là content.js và thêm đoạn mã sau vào nó bằng JavaScript:


 const insertText = (text) => { // Check if the page has a textarea. const textarea = document.querySelector('textarea'); if (textarea) { const startPosition = textarea.selectionStart; // The position of the cursor at the beginning of the selected text. const endPosition = textarea.selectionEnd; // The position of the cursor at the end of the selected text. const originalText = textarea.value; // The original text in the textarea. const newText = originalText.slice(0, startPosition) + text + originalText.slice(endPosition); // The new text in the textarea. textarea.value = newText; // Insert the new text into the textarea. textarea.focus(); // Focus on the textarea. textarea.selectionEnd = startPosition + text.length; // Set the cursor position at the end of the inserted text. textarea.selectionStart = startPosition + text.length; // Set the cursor position at the beginning of the inserted text. } }; // Create a button. const addButton = (title,text) => { const button = document.createElement('button'); // Create a button. button.textContent = `${title}`; // Set the button text. button.addEventListener('click', (event) => { event.preventDefault(); insertText(text); // Insert text into the textarea. }); return button; }; // Add buttons to the page. const init = () => { // Check if the page has a textarea. const textarea = document.querySelector('textarea').parentElement; if (textarea && !document.querySelector('.textarea-buttons')) { // Create a container for the buttons. const container = document.createElement('div'); container.className = 'textarea-buttons'; container.style.display = 'flex'; container.style.gap = '5px'; container.style.marginTop = '5px'; // Add buttons to the container. container.appendChild(addButton('Summarize','Summarize the following text in English: ')); container.appendChild(addButton('Translate','If the following text is in English, translate it into Italian, and if in Italian, then into English: ')); container.appendChild(addButton('Poem','Create a poem based on the following text: ')); container.appendChild(addButton('Response','My name is Ilya, write that I can answer my interlocutor in this dialogue: ')); // Add the container below the textarea. textarea.parentNode.insertBefore(container, textarea.nextSibling); } }; init(); // If the page uses dynamic elements, periodically check and add buttons if necessary. setInterval(init, 1000);


Bây giờ chúng ta cần thêm plugin này vào Google Chrome. Đối với điều này, chúng tôi đi tới Menu->Cài đặt->Tiện ích mở rộng->Tải giải nén, sau đó mở thư mục bằng plugin /gptinsert của chúng tôi và nhấp vào nút "Chọn thư mục" .


Sau đó, logo của plugin của chúng tôi sẽ xuất hiện bên cạnh thanh địa chỉ trong trình duyệt.

Bây giờ, chúng ta có thể sử dụng nó. Để thực hiện việc này, chỉ cần mở https://chat.openai.com/ và tạo một cuộc trò chuyện mới, sau đó 4 nút sẽ xuất hiện ở cuối cuộc trò chuyện của chúng tôi: Tóm tắt, Dịch, Bài thơ và Phản hồi.


Ví dụ, bằng cách nhấn vào Tóm tắt, lời nhắc "Tóm tắt văn bản sau bằng tiếng Anh:" sẽ xuất hiện trong trường nhập liệu.


Sau đó, bạn có thể chèn bất kỳ văn bản nào bằng bất kỳ ngôn ngữ được hỗ trợ nào và ChatGPT sẽ xuất nội dung và ý nghĩa ngắn gọn của nó.

Hãy kiểm tra hoạt động của nút "Phản hồi" chẳng hạn:

Nếu cần thêm nút mới, bạn chỉ cần thêm đoạn mã sau vào tệp content.js :


 container.appendChild(addButton('My button','My prompt text: '));


Sau khi lưu - bạn chỉ cần khởi động lại trình duyệt và mọi thứ sẽ hoạt động.


Bằng cách này, bạn có thể thêm vô số nút và lời nhắc. Với việc sử dụng thường xuyên, điều này tăng tốc đáng kể công việc và tăng thêm sự tiện lợi;)


Liên kết GitHub: https://github.com/sinenko/ChatGptPromptInsert