# إنشاء رابط أكثر وضوحًا لشخصية AI
**URL:** https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884
**Category:** Support
**Tags:** ai
**Created:** [13 مايو 2025، 12:31م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884 "2025-05-13T12:31:13Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@Angela\_MRS](https://meta.discourse.org/u/Angela_MRS)
#### Post date: [13 مايو 2025، 12:31م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/1 "2025-05-13T12:31:13Z")
مرحباً بمجتمع Discourse،
آمل أن تكونوا جميعاً بخير!
لقد قمت بإعداد روبوت محادثة بشخصية ذكاء اصطناعي (LLM GPT-4 Omni-Mini)، وقد كان يعمل بشكل رائع! 🎉 ولكن، لاحظت أن تفاعلات العملاء قليلة جداً. حالياً، للدردشة مع الروبوت، يتعين عليهم النقر على أيقونة الروبوت الصغيرة هذه في الشريط العلوي، وأعتقد أنها قد لا تكون واضحة جداً.
لقد أنشأت موضوعاً يشرح كيفية العثور عليها، ولكنها لا تزال تبدو مخفية بعض الشيء. **كنت أتساءل عما إذا كانت هناك طريقة لإنشاء أيقونة دردشة أكبر في زاوية الشاشة لجعلها تبرز أكثر؟**
لقد قرأت عن دمج Help Scout أو Zendesk، ولكني أفضل استخدام ما لدي بالفعل في Discourse دون تكاليف إضافية أو المرور بالمزيد من التعقيدات.
هل لديكم أي نصائح أو حيل يمكنكم مشاركتها؟ سأكون ممتناً لأي توجيهات يمكنكم تقديمها! ما زلت أتعلم كل هذا، لذا فإن أي مساعدة تعني الكثير. 😊
شكراً جزيلاً!
---
### Author:  [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [13 مايو 2025، 12:37م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/3 "2025-05-13T12:37:35Z")
مرحباً @Angela_MRS 👋
لدي رابط مخصص “اسأل الروبوت” في الشريط الجانبي في منتداي:
---
### Author:  [@Angela\_MRS](https://meta.discourse.org/u/Angela_MRS)
#### Post date: [13 مايو 2025، 12:40م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/4 "2025-05-13T12:40:55Z")
شكراً لك يا ليلي، هذه فكرة جيدة جداً!
لن تعمل حقاً في منتدياتنا، لقد أزلت الشريط الجانبي، أفكر في جعله أقل ازدحاماً… قد أعيده إذا لم أجد حلاً بديلاً آخر 😅
---
### Author:  [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [13 مايو 2025، 12:41م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/5 "2025-05-13T12:41:54Z")
يمكنك وضعه في قائمة السحب المنسدلة ثم إذا كنت تستخدم ذلك بدلاً من الشريط الجانبي.
---
### Author:  [@Angela\_MRS](https://meta.discourse.org/u/Angela_MRS)
#### Post date: [13 مايو 2025، 12:42م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/6 "2025-05-13T12:42:58Z")
بالتأكيد، سأفعل ذلك 😉
---
### Author:  [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [13 مايو 2025، 2:18م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/8 "2025-05-13T14:18:52Z")
> [@Custom Components -- add button or text at any plugin outlet](https://meta.discourse.org/t/custom-components-add-button-or-text-at-any-plugin-outlet/349629):
>
> information_sourceSummary Add button or text anywherehammer_and_wrenchRepository [https://github.com/literatecomputing/discourse-custom-components](https://github.com/literatecomputing/discourse-custom-components)questionInstall Guide [How to install a theme or theme component](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682)open_bookNew to Discourse Themes? [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) Install this theme component Add a link button or arbitrary text at any plugin outlet. (Ignore the watermarks in the images–I took these screenshots on a staging/test site.) …
استخدم `/discourse-ai/ai-bot/conversations` لعنوان URL الخاص بالزر ويمكنك وضعه أينما تريد. 🙂
---
### Author:  [@Angela\_MRS](https://meta.discourse.org/u/Angela_MRS)
#### Post date: [14 مايو 2025، 12:00م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/9 "2025-05-14T12:00:58Z")
شكراً جزيلاً على اقتراحاتك يا ليلي، لقد تمكنت من إضافة الزر أعلى الفئات، وهو يعمل بشكل مثالي…
من الواضح أنني لن أمانع في التوسع قليلاً…
كنت أفكر في استخدام صورتي الخاصة لهذا الزر (لقد أضفتها بالفعل إلى مظهري)، لكنني لا أعرف كيف أستدعي هذه الصورة المخصصة كأيقونتي في خيارات المكون ([GitHub - literatecomputing/discourse-custom-components](https://github.com/literatecomputing/discourse-custom-components) )
أيضًا، لا يبدو أنني أستطيع تغيير الموضع… هل أحتاج إلى إنشاء قسم مخصص في كود المظهر؟؟
هذه هي الصورة التي أتخيلها للزر الخاص بروبوت الدردشة:
أنا أقدر مساعدتك بشكل كبير!!!
---
### Author:  [@Angela\_MRS](https://meta.discourse.org/u/Angela_MRS)
#### Post date: [14 مايو 2025، 4:44م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/10 "2025-05-14T16:44:56Z")
بعد بعض البحث هنا وهناك، ساعدتني ChatGPT - تقريبًا - في تحقيق هدفي 🥳
لقد أضفت الزر كما اقترحت ليلي، وقضيت أيضًا وقتًا طويلاً في القراءة عن البدائل هنا وهناك. في النهاية، طلبت من ChatGPT مساعدتي في كتابة الكود لإنشاء مثل هذا الزر، أو في الواقع “صورة رمزية” عائمة بناءً على صورة قمت بتحميلها في مظهري.
لقد وضعت الكود الذي أستخدمه هنا في حال كان بإمكانه مساعدة شخص آخر في المستقبل!
HTML:
```html
Start a conversation with the AI Chatbot
```
CSS:
```css
#chatbot-avatar {
position: fixed; /* يثبت الصورة الرمزية في مكانها */
bottom: 50px; /* المسافة من أسفل الصفحة */
right: 50px; /* المسافة من يمين الصفحة */
cursor: pointer; /* يغير المؤشر إلى مؤشر عند التحويم */
z-index: 1000; /* يضمن أن الصورة الرمزية فوق المحتوى الآخر */
text-align: center; /* يوسط نص التلميح مباشرة أسفل الصورة الرمزية */
}
#chatbot-avatar img {
width: 200px; /* اضبط الحجم حسب الحاجة */
height: 200px; /* اضبط الحجم حسب الحاجة */
transition: transform 0.3s; /* تأثير تحويم سلس */
}
#chatbot-avatar:hover img {
transform: scale(1.5); /* تكبير الصورة الرمزية قليلاً عند التحويم */
}
.tooltip {
visibility: hidden; /* مخفي افتراضيًا */
width: 200px; /* عرض التلميح */
background-color: #000C34; /* لون خلفية التلميح */
color: #fff; /* لون نص التلميح */
text-align: center; /* توسيط النص */
border-radius: 5px; /* زوايا مستديرة */
padding: 8px; /* مساحة داخلية للتلميح */
position: absolute; /* تحديد الموضع */
bottom: 220px; /* الموضع فوق الصورة الرمزية */
right: 50%; /* توسيط مع الصورة الرمزية */
transform: translateX(50%); /* تعديل للتوسيط */
opacity: 0; /* شفاف افتراضيًا */
transition: opacity 0.3s; /* انتقال سلس */
z-index: 999; /* يوضع أسفل الصورة الرمزية مباشرة */
}
#chatbot-avatar:hover .tooltip {
visibility: visible; /* إظهار التلميح */
opacity: 1; /* جعله مرئيًا بالكامل */
}
```
هذا هو شكله على الصفحة (يظهر النص “ابدأ محادثة…” عند التحويم فوق الصورة الرمزية فقط.
هناك شيء واحد لم أتمكن من القيام به بعد، وهو جعله يظهر على الصفحة الرئيسية فقط، في الوقت الحالي يظهر على كل صفحة، بما في ذلك صفحة مناقشة روبوت الدردشة بالذكاء الاصطناعي، حيث يكون زائدًا عن الحاجة بوضوح… لقد حاولت إضافة نص برمجي لتحديد الصفحة وحظرها في كل مكان باستثناء الصفحة الرئيسية، وما إلى ذلك.. لم ينجح حتى الآن. سأرى ما إذا كان بإمكاني القيام بالمزيد غدًا!
---
### Author:  [@system](https://meta.discourse.org/u/system)
#### Post date: [13 يونيو 2025، 4:45م UTC](https://meta.discourse.org/t/create-a-more-noticeable-link-for-ai-persona/365884/11 "2025-06-13T16:45:25Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.